lightspeeddevelopment/lsx-customizer

@mixin content-colours(
    $bg: map-get($content, bg),
    $breaker: map-get($content, breaker),
    $header: map-get($content, header),
    $color: map-get($content, color),
    $link: map-get($content, link),
    $hover: map-get($content, hover),
    $small: map-get($content, small),
    $full-bg: map-get($content, full-bg),
    $full-color: map-get($content, full-color),
    $full-link: map-get($content, full-link),
    $full-hover: map-get($content, full-hover),
    $full-cta-bg: map-get($content, full-cta-bg),
    $full-cta-color: map-get($content, full-cta-color),
    $full-cta-link: map-get($content, full-cta-link),
    $full-cta-hover: map-get($content, full-cta-hover)
) {
    body {
        background-color: $bg;
    }

    .lsx-breaker,
    .page-header {
        border-bottom-color: $breaker;
    }

    .lsx-title {
        color: $header;

        &:after {
            background-color: $breaker;
        }
    }

    #masthead {
        #searchform {
            @media (min-width: 1200px) {
                &:hover,
                &:active,
                &:active:hover,
                &:focus {
                    .search-submit {
                        color: $link;
                    }
                }
            }

            @media (max-width: 1199px) {
                &.hover {
                    .search-submit {
                        color: $color;
                    }
                }
            }

            .search-field {
                background-color: $bg;
                color: $link;
            }

            .search-submit {
                color: $color;
                border: none;
            }
        }
    }

    .breadcrumbs-container {
        a:not(.btn) {
            @include lsx-link-colour($link, $hover);
        }
    }

    .content-area,
    .widget-area,
    .modal-content,
    // Caldera Forms
    .remodal-wrapper {
        color: $color;
        a:not(.btn):not(.wp-block-button__link):not(.has-link-anchor) {
            @include lsx-link-colour($link, $hover);
        }
        .has-link-color a:hover {
            color: $hover;
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .widget-title,
        .lsx-title {
            color: $header;
        }

        blockquote {
            border-color: $breaker;

            &:before {
                background-color: $bg;
            }

            & cite {
                color: $small;
            }
        }

        pre {
            border-color: $breaker;
            color: $color;
        }

        .lsx-list {
            padding-left: 0;
            list-style-type: none;
            padding-right: 2rem;
            li {
                margin-bottom: 1.5rem;
                display: flex;
                &:before {
                    font-size: 12px;
                    content: "\f00c";
                    display: inline-block;
                    font: normal normal normal 14px/1 "FontAwesome";
                    color: $link;
                    margin-right: 1rem;
                    padding-top: 5px;
                }
            }
        }
    }

    #home-widgets {
        h3,
        .widget-title,
        .lsx-title {
            &:after {
                background-color: $breaker;
            }
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .widget-title,
        .lsx-title {
            color: $header;
        }
    }

    .lsx-full-width {
        .content-area &,
        #home-widgets & {
            background-color: $full-bg;
            color: $full-color;

            h1,
            h2,
            h3,
            h4,
            h5,
            h6,
            .widget-title,
            .lsx-title {
                color: $full-color;
            }

            a:not(.btn) {
                @include lsx-link-colour($full-link, $full-hover);
            }
        }
    }

    .lsx-full-width-alt {
        .content-area &,
        #home-widgets & {
            background-color: $full-cta-bg;
            color: $full-cta-color;

            h1,
            h2,
            h3,
            h4,
            h5,
            h6,
            .widget-title,
            .lsx-title {
                color: $full-cta-color;
            }

            a:not(.btn) {
                @include lsx-link-colour($full-cta-link, $full-cta-hover);
            }
        }
    }

    .content-area {
        .lsx-pagination,
        .envira-pagination,
        .lsx-postnav {
            & > .page-numbers,
            & > .post-page-numbers {
                &,
                &.prev:before,
                &.next:before {
                    border-color: $link;
                    color: $link;
                }
                &.current,
                &:hover,
                &:active:hover,
                &:focus {
                    background-color: $link;
                    color: #fff;
                }
            }

            & > span.dots {
                border-color: transparent;
                color: $color;

                &:hover,
                &:active:hover,
                &:focus {
                    background-color: transparent;
                    color: inherit;
                }
            }

            & > .prev,
            & > .next {
                &:hover:before {
                    color: #fff;
                }
            }
        }
    }

    .blog,
    .archive,
    .search-results,
    .lsx-related-posts {
        margin-bottom: 0;
        .wrap.container {
            .content.role {
                > div:first-child {
                    &#primary {
                        margin-top: 8.4rem;
                    }
                }
            }
        }
        article.post,
        article.page,
        article.lsx-slot {
            .entry-meta {
                .post-meta {
                    color: $small;

                    a {
                        @include lsx-link-colour($small, $hover);
                    }
                }

                .post-meta-avatar {
                    background-color: $link;

                    &:hover {
                        border-color: $orange;
                    }
                }
            }

            .entry-title {
                .label-sticky {
                    background-color: $link;
                }
            }

            .post-tags-wrapper {
                .post-meta-categories,
                .post-tags,
                .post-comments {
                    color: $small;

                    & > a {
                        @include lsx-link-colour($small, $hover);
                    }
                }
            }
        }
    }

    .single-post {
        article.post {
            .entry-meta {
                .post-meta {
                    color: $small;

                    a {
                        @include lsx-link-colour($small, $hover);
                    }
                }

                .post-meta-avatar {
                    background-color: $link;

                    &:hover {
                        border-color: $hover;
                    }
                }
            }
            .lsx-hero-banner-block {
                .post-meta {
                    color: white;

                    a {
                        @include lsx-link-colour(white, $hover);
                    }
                }
            }

            .post-tags {
                & > a {
                    @include lsx-link-colour($small, $hover);
                }
            }
        }

        .post-navigation {
            .nav-links {
                a {
                    & > p {
                        color: $small;
                    }
                }
            }
        }
    }

    #respond {
        .comment-reply-title {
            color: $hover;
        }
    }

    #comments {
        .media-list {
            .media {
                &:not(.media-reply) {
                    border-top-color: $breaker;
                }

                .media-object {
                    background-color: $color;
                    border-color: $color;
                }

                &.bypostauthor > .media-object {
                    border-color: $hover;
                    background-color: $hover;
                }

                .media-body {
                    & > time {
                        color: $small;

                        & > a {
                            @include lsx-link-colour($small, $hover);
                        }
                    }
                }
            }
        }
    }

    .modal {
        .modal-content {
            background-color: $bg;
            border-color: $link;
        }

        .close {
            background-color: $link;
            border-color: #fff;
            box-shadow: 0 0 4px 0 $link;
            color: #fff;

            &:hover {
                background-color: $link;
            }
        }
    }

    .gallery {
        .slick-dots {
            & > li {
                & > button {
                    border-color: $color;
                }

                &.slick-active > button {
                    background-color: $color;
                }
            }
        }

        .slick-arrow {
            border-color: $color;
            color: $color;

            &:hover {
                border-color: $hover;
                color: $hover;
            }

            &.slick-disabled {
                border-color: $breaker;
                color: $breaker;
            }
        }
    }

    .slick-lightbox-inner {
        .slick-arrow {
            border-color: white;
            color: white;

            &:hover {
                border-color: white;
                color: white;
            }

            &.slick-disabled {
                border-color: #ccc;
                color: #ccc;
            }
        }
    }

    // Caldera Forms

    .remodal-wrapper {
        .remodal {
            background-color: $bg;
            border-color: $link;
        }

        .remodal-close {
            background-color: $link;
            border-color: #fff;
            box-shadow: 0 0 4px 0 $link;
            color: #fff;

            &:hover {
                background-color: $link;
                color: #fff;
            }
        }
    }

    .caldera-form-page {
        background-color: #fff;
    }

    .caldera-grid {
        .breadcrumb {
            & > li {
                & > a {
                    background-color: #fff;

                    &:hover {
                        background-color: #fff;
                    }
                }

                &.active > a {
                    background-color: $link;
                    color: #fff;

                    &:after {
                        border-color: transparent transparent $bg transparent;
                    }
                }
            }
        }
    }

    // WooCommerce

    #add_payment_method,
    .woocommerce-cart,
    .woocommerce-checkout,
    .woocommerce-account {
        table.cart {
            thead {
                tr {
                    background-color: #e6e6e6;
                }
            }

            tbody {
                tr {
                    background-color: #fff;
                }
                tr:last-child {
                    background-color: #e6e6e6;
                }
                img {
                    width: 100px;
                }
            }
        }

        .cart_totals {
            table.shop_table {
                tbody {
                    th {
                        background-color: #e6e6e6;
                    }
                    td {
                        background-color: #fff;
                    }
                }
            }
        }

        .woocommerce-checkout-review-order,
        .woocommerce-order-details,
        .woocommerce-order-downloads,
        .woocommerce-MyAccount-content {
            table.shop_table {
                thead {
                    th {
                        background-color: #e6e6e6;
                    }
                }

                tbody {
                    th,
                    td {
                        background-color: #fff;
                    }
                }

                tfoot {
                    th {
                        background-color: #e6e6e6;
                    }
                    td {
                        background-color: #fff;
                    }
                }
            }
        }
    }

    #wl-wrapper {
        table.shop_table {
            thead {
                tr {
                    background-color: #e6e6e6;
                }
            }

            tbody {
                tr {
                    background-color: #fff;
                }
                tr:last-child:not(:only-child) {
                    background-color: #e6e6e6;
                }
            }
        }

        .wl-already-in {
            background-color: #fff;
        }

        a.button.wl-add-but {
            color: $color !important;

            &:before {
                border: 1px solid $color;
                color: $color;
            }

            &:hover,
            &:active,
            &:active:hover,
            &:focus {
                color: $hover !important;

                &:before {
                    border: 1px solid $hover;
                    color: $hover;
                }
            }
        }
    }

    .woocommerce {
        .woocommerce-customer-details {
            address {
                background-color: #fff;
            }
        }
    }

    .button-social-login,
    a.button-social-login,
    input.button-social-login,
    button.button-social-login,
    .widget-area .widget a.button-social-login {
        color: #fff !important;
    }

    .woocommerce-MyAccount-navigation {
        background-color: #fff;
        height: 100%;
        @include media("<tablet") {
            margin-bottom: $lsx-medium-gap;
        }
        ul {
            // border-top: 1px solid $breaker;

            li {
                border-bottom: 1px solid $breaker;

                &:last-child {
                    border-bottom: none;
                }

                &.is-active {
                    a {
                        background-color: $link;
                        color: #fff !important;
                    }
                }
                a {
                    font-weight: 600;
                }
            }
        }
    }

    .woocommerce {
        .star-rating {
            span:before {
                color: $link;
            }
        }
    }

    .woocommerce-page #main {
        #woochimp_checkout_groups {
            .label {
                color: $color;
            }
        }
    }

    .woocommerce {
        div.product {
            .woocommerce-tabs {
                .nav-tabs {
                    & > li {
                        & > a {
                            background-color: #fff;

                            &:hover {
                                background-color: #fff;
                            }
                        }

                        &.active > a {
                            background-color: $link;
                            color: #fff;

                            &:after {
                                border-color: transparent transparent $bg
                                    transparent;
                            }
                        }
                    }
                }

                .panel {
                    background: #fff;
                }
            }

            form.cart {
                .variations {
                    td.label {
                        label {
                            color: $color;
                        }
                    }
                }
            }
        }
    }

    .wl-tab-wrap {
        .wl-tabs {
            > li {
                > a {
                    background-color: #fff !important;

                    &:hover {
                        background-color: #fff !important;
                    }
                }

                &.active > a {
                    background-color: $link !important;
                    color: #fff !important;

                    &:after {
                        border-color: transparent transparent $bg transparent;
                    }
                }
            }
        }
    }

    #add_payment_method,
    .woocommerce-cart,
    .woocommerce-checkout {
        #payment {
            ul.payment_methods {
                li:not(.woocommerce-notice) {
                    background-color: #fff;

                    &:hover {
                        background-color: $breaker;
                    }
                }
            }

            div.payment_box {
                background-color: $bg;
            }
        }
    }

    .lsx-woocommerce-slot,
    .lsx-woocommerce-review-slot {
        .lsx-woocommerce-title > a:not(.btn) {
            @include lsx-link-colour($color, $hover);
        }
    }

    .lsx-woocommerce-slot {
        background-color: #fff;

        .lsx-woocommerce-price {
            color: #77a464;
        }

        .lsx-woocommerce-content {
            a:not(.btn).moretag {
                background-color: $link;
                color: #fff;

                &:hover {
                    background-color: $hover;
                    color: #fff;
                }
            }
        }
    }

    .lsx-woocommerce-review-slot {
        .lsx-woocommerce-review-box {
            background-color: #fff;
        }

        .lsx-woocommerce-content {
            border-top: 1px solid $breaker;
        }
    }

    .lsx-woocommerce-slider {
        .slick-dots {
            & > li {
                & > button {
                    border-color: $color;
                }

                &.slick-active > button {
                    background-color: $color;
                }
            }
        }

        .slick-arrow {
            border-color: $color;
            color: $color;

            &:hover {
                border-color: $hover;
                color: $hover;
            }

            &.slick-disabled {
                border-color: $breaker;
                color: $breaker;
            }
        }
    }

    .woocommerce,
    .woocommerce-page {
        #coupons_list {
            background-color: #e6e6e6;
            border: 1px solid $table-border-color;
        }
    }

    div.pp_woocommerce {
        .pp_content_container {
            background-color: $bg;
            border-color: $link;
        }

        .close {
            background-color: $link;
            border-color: #fff;
            box-shadow: 0 0 4px 0 $link;
            color: #fff;

            &:hover {
                background-color: $link;
            }
        }
    }

    .woocommerce-page {
        #reviews {
            .product-rating {
                .product-rating-details {
                    table {
                        td {
                            &.rating-graph {
                                .bar {
                                    background-color: $breaker;
                                }
                            }
                        }
                    }
                }
            }

            .contribution-flag-form {
                background-color: $breaker;
            }
        }

        .contribution-type-selector {
            > a {
                border-bottom: 0.202em solid $breaker;

                &.active {
                    border-bottom-color: $link;
                }
            }
        }
    }

    #wc-bookings-booking-form {
        .wc-bookings-date-picker {
            .ui-datepicker {
                table {
                    background-color: #fff;
                    border: 1px solid #999;

                    th {
                        background-color: #f6f6f6;
                    }

                    thead tr {
                        border: 1px solid #999;
                    }
                }
            }
        }
    }

    #tiptip_content,
    .chart-tooltip {
        background-color: $color;
    }

    #tiptip_holder.tip_bottom {
        #tiptip_arrow_inner {
            border-bottom-color: $color;
        }
    }

    // Sensei
    .content-area,
    .learner-profile {
        .sensei-course-filters,
        #my-courses {
            li {
                a:not(.btn) {
                    background-color: #fff;
                    color: $link;

                    &.active,
                    &:hover,
                    &:hover:active,
                    &:focus {
                        background-color: $link;
                        color: #fff;
                    }
                }
            }
        }
    }

    #user-course-status-toggle {
        a:not(.btn) {
            background-color: #fff;
            color: $link;

            &.active,
            &:hover,
            &:hover:active,
            &:focus {
                background-color: $link;
                color: #fff;
            }
        }
    }

    // The Events Calendar

    #tribe-bar-form {
        .tribe-bar-filters {
            background-color: #fff;
        }
    }

    #tribe-bar-collapse-toggle {
        background-color: #fff;
    }

    .tribe-events-calendar {
        th {
            background-color: #384750;
            color: #fff;
        }

        div[id*="tribe-events-daynum-"] {
            &,
            & a {
                background-color: transparent !important;
            }
        }

        td.tribe-events-othermonth.tribe-events-past,
        td.tribe-events-othermonth.tribe-events-future {
            div[id*="tribe-events-daynum-"] {
                background-color: #ddd !important;
                &,
                & a {
                    color: #999 !important;
                }
            }
        }

        td.tribe-events-thismonth {
            div[id*="tribe-events-daynum-"] {
                background-color: #ddd !important;
                &,
                & a {
                    color: #999 !important;
                }
            }
        }

        td.tribe-events-present {
            div[id*="tribe-events-daynum-"] {
                background-color: #ccc !important;
                &,
                & a {
                    color: #999 !important;
                }
            }
        }
    }

    #tribe-events-content {
        .tribe-events-tooltip {
            h4 {
                background-color: #384750;
            }
        }
    }

    .tribe-events-tooltip {
        &.tribe-events-tooltip-flipdown {
            &:before {
                border-bottom-color: #384750;
            }
        }

        .tribe-events-calendar &,
        .tribe-events-shortcode.view-week &,
        .tribe-events-week & {
            border-color: #384750;
        }
    }

    .recurring-info-tooltip {
        border-color: #384750;
    }

    .tribe-events-list-separator-month {
        background-color: #e6e6e6;
        color: #4a4a4a;
    }

    .tribe-events-day {
        .tribe-events-day-time-slot {
            h5 {
                background-color: #e6e6e6;
                color: #4a4a4a;
            }
        }
    }

    .single-tribe_events {
        .tribe-events-schedule {
            .tribe-events-cost {
                background-color: #fff;
                border: 1px solid #ddd;
            }
        }

        .tribe-events-event-meta {
            background-color: #fff;
        }
    }

    .tribe-events-event-cost {
        .ticket-cost {
            background-color: #fff;
        }
    }

    .tribe-events-list {
        .tribe-events-loop {
            .tribe-event-featured {
                background-color: #fff;

                a:not(.tribe-events-read-more) {
                    color: $link !important;

                    &:hover,
                    &:active,
                    &:active:hover,
                    &:focus {
                        color: $hover !important;
                    }
                }

                .tribe-events-list-event-title {
                    .label {
                        background-color: #d1021b;
                    }
                }

                .tribe-events-event-meta,
                .tribe-events-content {
                    color: $color;
                }

                .tribe-events-event-cost {
                    color: $color;

                    .ticket-cost {
                        border: 1px solid $breaker;
                        color: $color;
                    }
                }
            }
        }
    }

    .tribe-events-related-events-title {
        color: $header;

        &:after {
            background-color: $breaker;
        }
    }

    .tribe-events-single {
        ul.tribe-related-events {
            li {
                .tribe-related-event-info {
                    .tribe-related-events-title > a {
                        color: $color;

                        &:hover,
                        &:active,
                        &:active:hover,
                        &:focus {
                            color: $hover;
                        }
                    }

                    .moretag {
                        background-color: $link;
                        color: #fff;

                        &:hover {
                            background-color: $hover;
                            color: #fff;
                        }
                    }
                }
            }
        }
    }
}