
:root {
    --site-font-family: Arial, Helvetica, sans-serif;
    --site-heading-font-family: Arial, Helvetica, sans-serif;
    --site-font-size: 16px;
    --site-line-height: 1.50;
    --site-background: #F7F5F2;
    --site-surface: #FFFFFF;
    --site-text: #333333;
    --site-muted-text: #746963;
    --site-primary: #C49A63;
    --site-primary-hover: #AD7F47;
    --site-accent: #A27642;
    --site-border: #E8DDD3;
    --site-card-radius: 24px;
    --site-input-radius: 12px;
    --site-button-radius: 13px;
    --site-card-shadow: 0 14px 40px rgba(65, 47, 38, .09);
    --site-content-max-width: 1440px;
    --client-sidebar-width: 260px;
    --client-sidebar-bg: #222222;
    --client-sidebar-gold: #C9A96E;
    --client-sidebar-text: #FFFFFF;
}

body {
    color: var(--site-text);
    background: var(--site-background);
    font-family: var(--site-font-family);
    font-size: var(--site-font-size);
    line-height: var(--site-line-height);
}

:where(h1, h2, h3, h4, h5, h6) {
    color: var(--site-text);
    font-family: var(--site-heading-font-family);
}

:where(
    .container,
    .courses-page,
    .client-certificates,
    .masters-page,
    .locations-page,
    .services-page
) {
    max-width: var(--site-content-max-width) !important;
}

.site-content > * {
    max-width: min(var(--site-content-max-width), 100%) !important;
}

.client-sidebar {
    color: var(--client-sidebar-text);
    background: var(--client-sidebar-bg);
}

.client-sidebar .logo,
.client-sidebar nav a,
.client-sidebar .login > a,
.client-sidebar .profile-link,
.client-sidebar .header-name {
    color: var(--client-sidebar-text);
}

.client-sidebar nav a:hover,
.client-sidebar nav a:focus-visible,
.client-sidebar nav a.active {
    color: var(--client-sidebar-text);
    background: var(--client-sidebar-gold);
}

footer {
    border-color: var(--site-border);
    background: var(--site-surface);
}

:where(
    .card,
    .service-card,
    .category-card,
    .master-card,
    .location-card,
    .locations-map-card,
    .client-certificate-card,
    .course-card,
    .sidebar-card,
    .appointment-card,
    .payment-due-card,
    .register-card,
    .email-confirmation-card,
    .profile-document-card,
    .profile-password-card
) {
    border-color: var(--site-border) !important;
    border-radius: var(--site-card-radius) !important;
    background: var(--site-surface) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.site-content :where(
    [class$="-card"],
    [class*="-card "]
) {
    border-radius: var(--site-card-radius) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.category-card > img {
    box-sizing: border-box;
    border: 1px solid var(--site-border) !important;
    border-radius: var(--site-card-radius) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.courses-tabs,
.client-certificates__tabs,
.services-hero,
.operation-history-count,
.profile-content,
.profile-sidebar,
.appointment-chat-dialog {
    border-color: var(--site-border) !important;
    border-radius: var(--site-card-radius) !important;
    background: var(--site-surface) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.courses-tabs button,
.courses-tabs a,
.client-certificates__tabs a {
    border-radius: var(--site-button-radius) !important;
}

.courses-tabs button.active,
.courses-tabs button:hover,
.courses-tabs a:hover,
.client-certificates__tabs a.active,
.client-certificates__tabs a:hover {
    color: #fff !important;
    background: var(--site-primary) !important;
}

.services-hero h1,
.profile-content,
.profile-sidebar,
.appointment-chat-dialog {
    color: var(--site-text) !important;
}

.operation-history-count span,
.appointment-chat-header p,
.appointment-chat-state,
.appointment-chat-empty {
    color: var(--site-muted-text) !important;
}

.operation-history-count strong,
.appointment-chat-eyebrow {
    color: var(--site-accent) !important;
}

.appointment-chat-header,
.appointment-chat-form {
    border-color: var(--site-border) !important;
    background: var(--site-surface) !important;
}

.appointment-chat-message {
    border-radius: var(--site-input-radius) !important;
    color: var(--site-text) !important;
    background: var(--site-background) !important;
}

.appointment-chat-message.is-own {
    color: #fff !important;
    background: var(--site-primary) !important;
}

.appointment-chat-readonly {
    border-radius: var(--site-input-radius) !important;
    color: var(--site-muted-text) !important;
    background: var(--site-background) !important;
}

.appointment-chat-compose textarea {
    border-color: var(--site-border) !important;
    border-radius: var(--site-input-radius) !important;
    color: var(--site-text) !important;
    background: var(--site-surface) !important;
}

.appointment-chat-compose button,
.appointment-chat-button {
    border-color: var(--site-border) !important;
    border-radius: var(--site-button-radius) !important;
}

.outline-btn {
    border-color: var(--site-primary) !important;
    border-radius: var(--site-button-radius) !important;
    color: var(--site-primary) !important;
    background: var(--site-surface) !important;
}

.outline-btn:hover {
    color: #fff !important;
    background: var(--site-primary-hover) !important;
}

.gold-btn,
.booking-open,
.master-booking-submit,
button[type="submit"],
input[type="submit"] {
    border-radius: var(--site-button-radius) !important;
}

.gold-btn,
.booking-open,
.master-booking-submit {
    border-color: var(--site-primary) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
}

.site-content button[type="submit"]:not(
    [class*="secondary"]
):not(
    [class*="danger"]
):not(
    [class*="refund"]
) {
    border-color: var(--site-primary) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
}

.site-content button[type="submit"]:not(
    [class*="secondary"]
):not(
    [class*="danger"]
):not(
    [class*="refund"]
):hover {
    background: var(--site-primary-hover) !important;
}

.gold-btn:hover,
.booking-open:hover,
.master-booking-submit:hover {
    background: var(--site-primary-hover) !important;
}

.master-booking-profile {
    color: var(--client-sidebar-text) !important;
    background: var(--client-sidebar-bg) !important;
}

.master-booking-profile > img {
    border-radius: var(--site-card-radius) !important;
}

.master-booking-profile :where(p, a, h2) {
    color: var(--client-sidebar-text) !important;
}

.master-booking-profile :where(.master-booking-kicker, a),
.master-booking-flow-heading > span {
    color: var(--client-sidebar-gold) !important;
}

.master-booking-flow {
    color: var(--site-text) !important;
    background: var(--site-surface) !important;
}

.master-booking-flow-heading h3 {
    color: var(--site-text) !important;
}

.client-certificate-card__sold {
    border-color: var(--site-border) !important;
    border-radius: var(--site-button-radius) !important;
    color: var(--site-muted-text) !important;
    background: var(--site-background) !important;
}

.client-certificates__empty,
.courses-empty,
.operation-history-empty {
    border-color: var(--site-border) !important;
    border-radius: var(--site-card-radius) !important;
    color: var(--site-muted-text) !important;
    background: var(--site-surface) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.client-certificates__empty :where(h2, p),
.operation-history-empty :where(h2, p) {
    color: inherit !important;
}

.info-row {
    border-color: var(--site-border) !important;
    color: var(--site-text) !important;
}

.info-row .label {
    color: var(--site-muted-text) !important;
}

.info-row .value {
    color: var(--site-text) !important;
}

.course-primary-button,
.payment-btn:not(.is-paid) {
    border-color: var(--site-primary) !important;
    border-radius: var(--site-button-radius) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
}

.course-primary-button:hover,
.payment-btn:not(.is-paid):hover {
    background: var(--site-primary-hover) !important;
}

.payment-btn.is-paid {
    border-radius: var(--site-button-radius) !important;
}

.course-countdown {
    border: 1px solid var(--site-border) !important;
    border-radius: var(--site-input-radius) !important;
    color: var(--site-muted-text) !important;
    background: var(--site-background) !important;
}

.course-countdown strong {
    color: var(--site-accent) !important;
}

.course-card__type,
.client-certificate-card__limited {
    border: 1px solid var(--site-border) !important;
    border-radius: var(--site-button-radius) !important;
    color: var(--site-accent) !important;
    background: var(--site-background) !important;
}

.course-payment-result,
.appointment-modal-content {
    border-color: var(--site-border) !important;
    border-radius: var(--site-card-radius) !important;
    color: var(--site-text) !important;
    background: var(--site-surface) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.course-payment-result > p {
    color: var(--site-muted-text) !important;
}

.course-payment-result__icon {
    border-radius: var(--site-input-radius) !important;
    color: var(--site-accent) !important;
    background: var(--site-background) !important;
}

.sidebar-toggle {
    border-color: var(--site-border) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
    box-shadow: var(--site-card-shadow) !important;
}

.sidebar-toggle:hover {
    background: var(--site-primary-hover) !important;
}

.client-certificate-services {
    color: var(--site-text) !important;
}

.client-certificate-services span {
    border: 1px solid var(--site-border) !important;
    border-radius: var(--site-input-radius) !important;
    color: var(--site-accent) !important;
    background: var(--site-background) !important;
}

.client-certificates__empty > a {
    border-radius: var(--site-button-radius) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
}

.client-certificates__empty > a:hover {
    background: var(--site-primary-hover) !important;
}

.appointment-chat-compose button {
    color: #fff !important;
    background: var(--site-primary) !important;
}

.appointment-chat-button {
    color: var(--site-accent) !important;
    background: var(--site-surface) !important;
}

:where(input, select, textarea) {
    border-color: var(--site-border) !important;
    border-radius: var(--site-input-radius) !important;
    color: var(--site-text);
    background: var(--site-surface);
    font-family: var(--site-font-family) !important;
}

:where(button, input[type="button"], input[type="submit"]) {
    font-family: var(--site-font-family) !important;
}

.site-content :where(
    button,
    [role="button"],
    a[class*="btn"],
    a[class*="button"]
):not([class*="close"]):not([class*="arrow"]):not([class*="nav"]) {
    border-radius: var(--site-button-radius) !important;
}

:where(
    .gold-btn,
    .full-btn,
    .login-btn,
    .payment-btn,
    .course-primary-button,
    .client-certificate-card__buy,
    .certificate-redemption-submit,
    .hero-btn
) {
    border-radius: var(--site-button-radius) !important;
    color: #fff !important;
    background: var(--site-primary) !important;
}

:where(
    .gold-btn,
    .full-btn,
    .login-btn,
    .payment-btn,
    .course-primary-button,
    .client-certificate-card__buy,
    .certificate-redemption-submit,
    .hero-btn
):hover {
    background: var(--site-primary-hover) !important;
}

:where(a, .footer-link) {
    accent-color: var(--site-accent);
}

.courses-tabs,
.client-certificates__tabs {
    border-color: var(--site-border);
}

.courses-tabs button.active,
.courses-tabs button:hover,
.client-certificates__tabs a.active,
.client-certificates__tabs a:hover {
    background: var(--site-primary);
}

footer {
    border-color: var(--site-border) !important;
    color: var(--site-muted-text) !important;
    background: var(--site-surface) !important;
}

.footer-content {
    color: var(--site-muted-text) !important;
}

.footer-link {
    color: var(--site-muted-text) !important;
}

.footer-link:hover {
    color: var(--site-accent) !important;
}

.footer-master-login {
    color: var(--site-accent) !important;
}

.footer-master-login:hover {
    color: var(--site-primary-hover) !important;
}
