:root {
    --c-btn-background-color: #FD4F34;
    --c-btn-border-color: #FD4F34;
    --c-btn-text-color: #ffffff;
    --c-checkbox-color: #FD4F34;
    --c-bookmark-color: #FD4F34;
    --c-bookmark-border-width: 0;
}

._c-timetable,
._c-event-listing {
    --c-card-padding-x: 2.5rem;
    --c-card-padding-y: 1.5rem;

    ._c-header {
        --c-card-header-gap: 2.5rem;
    }
    
    >._c-content {
        --c-card-content-gap: 1.5rem;
    }

    ._c-timetable-container,
    ._c-event-listing-container {
        ._c-card {
            --c-card-content-gap: 0.5rem;
            --c-card-background-color: #F4F4F5;
            --c-card-padding-x: 1rem;
            --c-card-padding-y: 1rem;
        }
    }
}
._c-instructor {
    --c-card-padding-y: 80px;
    
    ._c-event-listing {
        --c-card-padding-x: 1.5rem;
        --c-card-padding-y: 1.5rem;
        --c-card-background-color: #F5F5F5;
    }
}

._c-skeleton-card {
    --c-card-padding-x: 1rem;
    --c-card-padding-y: 1rem;

    @media screen and (min-width: 768px) {
        --c-card-padding-x: 1rem;
        --c-card-padding-y: 1rem;
    }
}

._c-card {
    @media screen and (min-width: 768px) {
        --c-card-padding-y: 1.5rem;
        --c-card-padding-x: 1.5rem;
    }

    ._c-footer {
        @media screen and (min-width: 768px) {
            --c-card-footer-padding-y: 1.5rem;
            --c-card-padding-x: 1.5rem;
        }
    }
}

._c-plan-card,
._c-bundle-card {
    --c-card-background-color: #F5F5F5;
    
    ._c-footer {
        --c-card-footer-gap: 1.5rem;
    }
}

._c-giftcard-card,
._c-payment-card {
    --c-card-background-color: transparent;
}

._c-booking-card {
    --c-card-padding-y: 1rem;
    --c-card-padding-x: 1rem;  
}

._c-order-card {
    
    ._c-header {
        --c-card-padding-y: 1rem;

    }
}

._c-tab-system {

    ._c-credits-card,
    ._c-subscriptions-card,
    ._c-instructors,
    ._c-bookings-card,
    ._c-profile-card,
    ._c-payment-methods-card,
    ._c-event-listing {
        --c-card-background-color: transparent;

        ._c-card {
            --c-card-background-color: #f5f5f5;
            --c-card-text-color: #000000;
        }

        ._c-payment-card {
            --c-card-background-color: transparent;
        }
    }

    ._c-waitlists {
        ._c-card {
            --c-card-background-color: #ffffff;
        }
    }

}

._c-modal {
    ._c-modal-inner {
        /* Might need a better way of doing this */
        &.codex-login,
        &.codex-require-login,
        &.codex-register,
        &.codex-password-reset,
        &.codex-password-recover {
            --c-modal-footer-background-color: #000000;
            --c-modal-footer-text-color: #ffffff;

            ._c-footer {
                --c-card-footer-padding-y: 16px;
            }
        }
    }
}

._c-event {
    ._c-content {
        --c-card-padding-y: 1rem;
    }

    ._c-footer {
        --c-card-footer-gap: 1rem;
        --c-modal-footer-background-color: var(--c-card-background-color, #ffffff);
        --c-modal-footer-text-color: var(--c-card-text-color, #000000);
    }
}

._c-instructors {

    ._c-card {
        --c-card-text-color: #ffffff;
        --c-tag-border-color: #FD4F34;
        --c-tag-background-color: #FD4F34;

        ._c-bookmark {
            &._c-bookmarked {
                --c-bookmark-background-color: rgba(10, 10, 10, 0.40);
            }
        }
    }
    ._c-footer {
        --c-card-footer-background-color: transparent;
        --c-card-footer-text-color: var(--c-card-text-color);
    }
}

._c-cart {
    ._c-footer {
        --c-modal-footer-background-color: #ffffff;
        --c-modal-footer-text-color: #000000;
    }
}

._c-notification-centre {
    
    >._c-header {
        --c-card-padding-y: 1.5rem;
        --c-card-padding-x: 1rem;
    }

    >._c-content {
        --c-card-padding-y: 0rem;
        --c-card-padding-x: 1rem;

        ._c-card {
            --c-card-padding-y: 0.75rem;
            --c-card-padding-x: 1rem;
        }
    }
}

._c-bookmark {
    &._c-bookmarked {
        --c-bookmark-background-color: rgba(253, 79, 52, 0.20);
    }
}