:root {
    --ds-primary: #c5a880;
    --ds-primary-hover: #a38258;
    --ds-background: #faf8f5;
    --ds-surface: #ffffff;
    --ds-border: #eae6e1;
    --ds-heading: #1a1d1b;
    --ds-text: #2c302e;
    --ds-muted: #6e6a66;
    --ds-success: #3b6e47;
    --ds-warning: #c2871f;
    --ds-danger: #b83a3a;
    --ds-radius-card: 12px;
    --ds-radius-control: 8px;
    --ds-shadow-md: 0 12px 32px rgba(26, 29, 27, .10);
    --ds-display: "Playfair Display", Georgia, serif;
    --ds-sans: "Plus Jakarta Sans", Inter, sans-serif;

    /* Existing screen tokens now resolve to the same design system. */
    --bronze: var(--ds-primary) !important;
    --bronze-dark: var(--ds-primary-hover) !important;
    --gold: var(--ds-primary) !important;
    --gold-dark: var(--ds-primary-hover) !important;
    --clay: var(--ds-primary) !important;
    --clay-dark: var(--ds-primary-hover) !important;
    --cream: var(--ds-background) !important;
    --paper: var(--ds-background) !important;
    --paper-light: var(--ds-background) !important;
    --white: var(--ds-surface) !important;
    --line: var(--ds-border) !important;
    --ink: var(--ds-text) !important;
    --text: var(--ds-text) !important;
    --muted: var(--ds-muted) !important;
    --success: var(--ds-success) !important;
    --sage: var(--ds-success) !important;
    --ok: var(--ds-success) !important;
    --warning: var(--ds-warning) !important;
    --amber: var(--ds-warning) !important;
    --warn: var(--ds-warning) !important;
    --error: var(--ds-danger) !important;
    --danger: var(--ds-danger) !important;
    --red: var(--ds-danger) !important;
    --display: var(--ds-display) !important;
    --sans: var(--ds-sans) !important;
    --shadow: var(--ds-shadow-md) !important;
    --shadow-sm: 0 6px 18px rgba(26, 29, 27, .08) !important;
    --shadow-md: var(--ds-shadow-md) !important;
    --shadow-lg: 0 22px 56px rgba(26, 29, 27, .16) !important;
}

.heatmap td { text-align: center; min-width: 58px; border-radius: 6px; }
.heatmap td[data-level="0"] { background: rgba(255,255,255,.03); color: var(--muted, #9ca3af); }
.heatmap td[data-level="1"] { background: rgba(74,124,89,.22); }
.heatmap td[data-level="2"] { background: rgba(197,168,128,.32); }
.heatmap td[data-level="3"] { background: rgba(194,135,31,.45); }
.heatmap td[data-level="4"] { background: rgba(184,58,58,.55); color: #fff; }
.status.info { color: #93c5fd; }
.status.warning { color: #fbbf24; }
.status.critical { color: #f87171; }

html {
    font-size: 16px;
}

body {
    color: var(--ds-text) !important;
    background-color: var(--ds-background) !important;
    font-family: var(--ds-sans) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

p,
li,
dd,
dt,
td,
.description,
[class*="-description"],
[class*="-details"] {
    font-weight: 500 !important;
}

h1,
h2,
h3,
h1 em,
h2 em,
h3 em {
    font-family: var(--ds-display) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

h1 {
    color: var(--ds-heading);
    font-size: 36px !important;
}

h2 {
    color: var(--ds-heading);
    font-size: 28px !important;
}

h3 {
    color: var(--ds-heading);
    font-size: 20px !important;
}

.services h1,
.services h2,
.services h3,
.package-card.featured h1,
.package-card.featured h2,
.package-card.featured h3,
.booking-intro h1,
.booking-intro h2,
.booking-intro h3,
.membership-section h1,
.membership-section h2,
.membership-section h3,
.closing-cta h1,
.closing-cta h2,
.closing-cta h3,
.corporate-hero h1,
.corporate-hero h2,
.corporate-hero h3,
.kiosk-welcome h1,
.kiosk-welcome h2,
.kiosk-welcome h3,
.therapist-hero h1,
.therapist-hero h2,
.therapist-hero h3,
.hero:has(.brand) h1,
.hero:has(.brand) h2,
.hero:has(.brand) h3,
.referral-card h1,
.referral-card h2,
.referral-card h3,
.priority-stat h1,
.priority-stat h2,
.priority-stat h3 {
    color: #ffffff;
}

.subtitle,
[class*="-subtitle"],
.lead,
.hero p {
    font-size: 18px;
    font-weight: 600;
}

button,
.button,
a[class*="-button"],
a[role="button"],
input[type="submit"],
input[type="button"] {
    min-height: 48px !important;
    border-radius: var(--ds-radius-control) !important;
    font-family: var(--ds-sans) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

.button-primary,
.button-submit,
.portal-form button,
.portal-button,
.corporate-form-card form > button,
.order button,
.auth-card button,
.admin-form button,
.filter-bar button {
    color: var(--ds-heading) !important;
    background: var(--ds-primary) !important;
    border-color: var(--ds-primary) !important;
}

.button-primary:hover,
.button-submit:hover,
.portal-form button:hover,
.portal-button:hover,
.corporate-form-card form > button:hover,
.order button:hover,
.auth-card button:hover,
.admin-form button:hover,
.filter-bar button:hover {
    color: #ffffff !important;
    background: var(--ds-primary-hover) !important;
    border-color: var(--ds-primary-hover) !important;
}

label,
legend,
.form-label {
    font-family: var(--ds-sans);
    font-weight: 600 !important;
}

input,
select,
textarea {
    border-color: var(--ds-border) !important;
    border-radius: var(--ds-radius-control) !important;
    font-family: var(--ds-sans) !important;
    font-weight: 500;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select {
    min-height: 48px;
}

.card,
[class$="-card"],
.panel,
[class$="-panel"],
.modal-content,
.order,
.booking-form {
    border-color: var(--ds-border) !important;
    border-radius: var(--ds-radius-card) !important;
    box-shadow: var(--ds-shadow-md);
}

.price,
[class*="-price"],
[class*="-amount"],
[class*="-total"] strong,
time,
[class*="-time"] strong,
.service-copy > strong,
.service-meta strong,
.package-name,
.package-name strong,
.product h2,
.product footer strong,
.therapist-copy > strong,
.therapist-name,
.therapist-stats strong,
.session-title h3,
.review-card strong,
.wizard-slots button {
    font-weight: 700 !important;
}

.time-slot:hover,
.time-slot.selected,
.wizard-slots button:hover,
.wizard-slots button.selected,
.category-chips button.active {
    color: var(--ds-heading) !important;
    background: var(--ds-primary) !important;
    border-color: var(--ds-primary) !important;
}

.status-confirmed,
.status-available,
.status-completed,
.status.confirmed,
.status.completed,
.portal-status,
.flash.success,
.portal-alert.success,
.resource-state.on {
    color: var(--ds-success) !important;
    background: #e8f1eb !important;
    font-weight: 700 !important;
}

.status-in_session,
.status-occupied,
.status.in_session,
.status.occupied,
.calendar-event.status-in_session,
.week-event.status-in_session,
.room-live-card.state-occupied {
    color: var(--ds-danger) !important;
    background: #fbeaea !important;
    border-color: var(--ds-danger) !important;
    font-weight: 700 !important;
}

.status-pending,
.status-waiting,
.status-cleaning,
.status.pending,
.status.waiting,
.status.cleaning,
.flash.warning,
.consent-badge.pending {
    color: var(--ds-warning) !important;
    background: #fff4df !important;
    font-weight: 700 !important;
}

.status-cancelled,
.status-no_show,
.status-review_required,
.status.cancelled,
.status.no_show,
.status.review_required,
.flash.error,
.portal-alert.error,
.portal-flash.error {
    color: var(--ds-danger) !important;
    background: #fbeaea !important;
    font-weight: 700 !important;
}

:focus-visible {
    outline: 3px solid rgba(197, 168, 128, .42);
    outline-offset: 2px;
}

@media (max-width: 720px) {
    html,
    body {
        font-size: 15px !important;
    }

    h1 {
        font-size: 28px !important;
    }

    h2 {
        font-size: 22px !important;
    }

    h3 {
        font-size: 18px !important;
    }

    .subtitle,
    [class*="-subtitle"],
    .lead,
    .hero p {
        font-size: 18px;
    }
}

/* Admin dark-surface isolation: prevents global luxury tokens from leaving
   white text on legacy light cards, tables and controls. */
.admin-body .admin-main,
.admin-body .admin-shell { color: #ffffff !important; background: #14161a !important; }
.admin-body .admin-topbar { background: #14161a !important; }
.admin-body .panel,
.admin-body .stat-grid article,
.admin-body .staff-cards article,
.admin-body .room-grid article,
.admin-body .stock-card,
.admin-body .risk-card,
.admin-body .integration-card,
.admin-body .filter-bar,
.admin-body .reception-cards article,
.admin-body .action-menu,
.admin-body .room-live-card,
.admin-body .week-day,
.admin-body .architecture-stack > div,
.admin-body .credential-groups > div,
.admin-body .calendar-resource,
.admin-body .calendar-track,
.admin-body .week-drop-target {
    color: #ffffff !important;
    background: #1e2024 !important;
    border-color: #3a3f48 !important;
}
.admin-body .staff-cards article,
.admin-body .room-grid article,
.admin-body .stock-card,
.admin-body .reception-cards article,
.admin-body .architecture-stack > div,
.admin-body .credential-groups > div,
.admin-body .week-day { background: #25282e !important; }
.admin-body h1,
.admin-body h2,
.admin-body h3,
.admin-body h4,
.admin-body strong,
.admin-body summary,
.admin-body td,
.admin-body .calendar-nav a,
.admin-body .calendar-view-toggle a,
.admin-body .room-live-card strong { color: #ffffff !important; }
.admin-body p,
.admin-body small,
.admin-body label,
.admin-body .panel-note,
.admin-body .risk-facts span,
.admin-body .room-live-card small,
.admin-body .staff-head p,
.admin-body .stock-card p,
.admin-body td small { color: #d1d5db !important; }
.admin-body th { color: #e5e7eb !important; background: #25282e !important; border-color: #3a3f48 !important; }
.admin-body td { background: #1e2024 !important; border-color: #3a3f48 !important; }
.admin-body .panel-note,
.admin-body .risk-facts span,
.admin-body .tags span { background: #30343b !important; }
.admin-body .admin-form input,
.admin-body .admin-form select,
.admin-body .admin-form textarea,
.admin-body .filter-bar input,
.admin-body .action-menu input,
.admin-body .action-menu select { color: #ffffff !important; background: #25282e !important; border-color: #4b505b !important; }
.admin-body .calendar-nav a,
.admin-body .calendar-view-toggle a { background: #1e2024 !important; border-color: #4b505b !important; }
.admin-body .calendar-view-toggle a.active,
.admin-body .admin-sidebar nav a.active { color: #14161a !important; background: #c5a880 !important; }
.admin-body .admin-sidebar nav a.active span { color: #14161a !important; }
.admin-body .stat-icon.green,
.admin-body .stat-icon.sand,
.admin-body .resource-avatar,
.admin-body .room-grid article > span,
.admin-body .stock-card > div > span { color: #14161a !important; background: #c5a880 !important; }
.admin-body .room-live-card.state-available b { color: #baf0c8 !important; background: #1d3425 !important; }
.admin-body .info-panel { background: #1d3425 !important; }
.admin-body .calendar-feed-box { color: #ffffff !important; background: #1d3425 !important; border-color: #3f7650 !important; }
.admin-body .calendar-feed-box small,
.admin-body .calendar-feed-box p { color: #d1d5db !important; }
.admin-body .calendar-feed-box strong { color: #ffffff !important; }
@media (max-width: 780px) {
    .admin-body .admin-sidebar nav a { min-height: 48px; }
}

/* Final contrast pass for the dark luxury surface. */
.skip-link:focus {
    color: #ffffff !important;
    background: #1e2024 !important;
    outline: 2px solid #d6bb97;
}

.service-number {
    color: #d6bb97 !important;
    opacity: 1 !important;
}

.membership-card > span,
.footer-bottom,
.footer-bottom a,
.site-footer .footer-brand p,
.site-footer .footer-note p {
    color: #d1d5db !important;
}

.quote-chip,
.popular,
.priority-booking-note > span {
    color: #1a1d1b !important;
    background: #d6bb97 !important;
}

.art-caption {
    padding: 5px 8px;
    color: #ffffff !important;
    background: rgba(20, 22, 26, .82) !important;
    border-radius: 6px;
}

.secure-badge {
    color: #1a2e26 !important;
    background: #dce9df !important;
    font-weight: 700 !important;
}

/* Dark Luxury QA layer --------------------------------------------------- */
:root {
    color-scheme: dark;
    --ds-background: #14161a;
    --ds-surface: #1e2024;
    --ds-surface-raised: #25282e;
    --ds-border: #3a3f48;
    --ds-heading: #ffffff;
    --ds-text: #ffffff;
    --ds-muted: #d1d5db;
    --ds-success: #72b987;
    --ds-warning: #e4ad49;
    --ds-danger: #e36a6a;
    --ds-shadow-md: 0 18px 48px rgba(0, 0, 0, .34);

    --cream: var(--ds-background) !important;
    --paper: var(--ds-background) !important;
    --paper-light: #181a1f !important;
    --line: var(--ds-border) !important;
    --ink: var(--ds-text) !important;
    --text: var(--ds-text) !important;
    --muted: var(--ds-muted) !important;
    --white: #ffffff !important;
}

[hidden] {
    display: none !important;
}

html,
body {
    color: var(--ds-text) !important;
    background: var(--ds-background) !important;
}

body::selection {
    color: #14161a;
    background: var(--ds-primary);
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
legend,
label {
    color: var(--ds-heading);
}

p,
li,
dd,
dt,
td,
.description,
[class*="-description"],
[class*="-details"],
.step-heading p,
.service-copy small,
.therapist-copy small,
.therapist-copy em,
.room-choice small,
.product-choice small,
.review-card span,
.payment-choice small,
.currency-note,
.fieldset-note,
.consent-row,
.full-field,
.input-grid label,
.schedule-card > label,
.slot-area small {
    color: var(--ds-muted) !important;
}

.site-header,
.site-header.scrolled,
.booking-header,
.admin-topbar,
.top {
    color: var(--ds-text) !important;
    background: rgba(20, 22, 26, .94) !important;
    border-color: var(--ds-border) !important;
    backdrop-filter: blur(16px);
}

.card,
[class$="-card"],
.panel,
[class$="-panel"],
.modal-content,
.order,
.booking-form,
.booking-shell,
.booking-card,
.portal-card,
.service-card,
.package-card,
.floating-card,
.membership-card,
.membership-card > div,
.addon-card,
.reference-box,
.footer-note,
.product,
.voucher,
.review-card > div,
.success-reference,
.success-payment,
.stat-grid article,
.ops-stats article,
.ops-session {
    color: var(--ds-text) !important;
    background: var(--ds-surface) !important;
    border-color: var(--ds-border) !important;
}

.corporate-content article,
.corporate-hero aside,
.legal article {
    color: var(--ds-text) !important;
    background: var(--ds-surface) !important;
    border-color: var(--ds-border) !important;
}

.corporate-content article p,
.corporate-content article small,
.corporate-hero aside p,
.corporate-hero aside span,
.legal article p,
.legal article li {
    color: var(--ds-muted) !important;
}

.access-state,
.state.invalid,
.state.expired,
.state.used {
    color: #ffd0d0 !important;
    background: #3a2023 !important;
    border-color: #7c3c42 !important;
}

.state.valid,
.state.active {
    color: #baf0c8 !important;
    background: #1d3425 !important;
    border-color: #3f7650 !important;
}

.booking-intro,
.booking-totals,
.live-total,
.payment-ready,
.membership-section,
.services,
.closing-cta,
.corporate-hero,
.kiosk-welcome,
.therapist-hero,
.ops-hero {
    color: var(--ds-text) !important;
    background: var(--ds-surface) !important;
    border-color: var(--ds-border) !important;
}

.booking-intro > p,
.booking-intro .trust-list,
.payment-ready p,
.membership-section p,
.corporate-hero p,
.therapist-hero p {
    color: var(--ds-muted) !important;
}

.service-choice,
.therapist-choice,
.room-choice,
.product-choice,
.wizard-addon-grid label,
.schedule-card,
.priority-booking-note,
.ambience-section,
.valet-preference,
.signature-section,
.payment-choice label,
.tip-choice label,
.health-options span,
.pricing-rule-strip span,
.category-chips button,
.slot-placeholder,
.wizard-slots button,
.time-slot,
.form-privacy,
.customer-policy,
.risk-payment-alert {
    color: var(--ds-text) !important;
    background: var(--ds-surface) !important;
    border-color: var(--ds-border) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select,
textarea,
.ambience-grid select,
.valet-preference input[type="text"],
.signature-pad-wrap,
.custom-tip input[type="number"] {
    min-height: 48px;
    color: #ffffff !important;
    background: #1e2024 !important;
    border-color: var(--ds-border) !important;
}

input::placeholder,
textarea::placeholder {
    color: #9ca3af !important;
    opacity: 1;
}

select option {
    color: #ffffff;
    background: #1e2024;
}

.locale-switcher {
    position: relative;
    align-items: center;
}

.currency-switcher {
    margin: 0;
}

.currency-switcher select {
    min-height: 48px !important;
}

.language-menu {
    position: relative;
    z-index: 30;
}

.language-menu summary {
    min-width: 132px;
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
    color: #ffffff;
    background: #1e2024;
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    list-style: none;
}

.language-menu summary::-webkit-details-marker {
    display: none;
}

.language-menu summary img,
.language-options img {
    width: 26px;
    height: 18px;
    flex: 0 0 auto;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .16);
}

.language-menu summary b {
    margin-left: auto;
    color: var(--ds-muted);
}

.language-options {
    position: absolute;
    top: calc(100% + 7px);
    left: 0;
    width: 190px;
    overflow: hidden;
    padding: 6px;
    color: #ffffff;
    background: #1e2024;
    border: 1px solid var(--ds-border);
    border-radius: 10px;
    box-shadow: var(--ds-shadow-md);
}

.language-options a {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    color: #ffffff !important;
    border-radius: 7px;
    font-weight: 600;
    text-decoration: none;
}

.language-options a:hover,
.language-options a[aria-current="true"] {
    background: #2a2d33;
}

.language-options a b {
    margin-left: auto;
    color: #d6bb97;
}

button,
.button,
a[class*="-button"],
a[role="button"],
input[type="submit"],
input[type="button"] {
    min-height: 48px !important;
    color: #ffffff !important;
    background: #1e2024 !important;
    border-color: #4b505b !important;
}

.button-primary,
.button-submit,
.portal-form button,
.portal-button,
.corporate-form-card form > button,
.order button,
.auth-card button,
.admin-form button,
.filter-bar button,
.nav-cta,
.membership-button {
    color: #ffffff !important;
    background: #1e2024 !important;
    border: 1px solid var(--ds-primary) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28) !important;
}

.button-primary:hover,
.button-submit:hover,
.portal-form button:hover,
.portal-button:hover,
.corporate-form-card form > button:hover,
.order button:hover,
.auth-card button:hover,
.admin-form button:hover,
.filter-bar button:hover,
.nav-cta:hover,
.membership-button:hover {
    color: #ffffff !important;
    background: #2a2d33 !important;
    border-color: #d6bb97 !important;
}

.time-slot:hover,
.time-slot.selected,
.wizard-slots button:hover,
.wizard-slots button.selected,
.category-chips button.active,
.health-options label:has(input:checked) span,
.tip-choice label:has(> input:checked) {
    color: #ffffff !important;
    background: #765b3d !important;
    border-color: #c5a880 !important;
    font-weight: 700 !important;
}

.service-choice:has(input:checked),
.therapist-choice:has(input:checked),
.room-choice:has(input:checked),
.product-choice:has(input:checked),
.wizard-addon-grid label:has(input:checked),
.payment-choice label:has(input:checked) {
    color: #ffffff !important;
    background: var(--ds-surface-raised) !important;
    border-color: var(--ds-primary) !important;
    box-shadow: 0 0 0 3px rgba(197, 168, 128, .18) !important;
}

.service-mark,
.auto-avatar,
.automatic-room > span,
.product-icon,
.wizard-addon-grid label > span,
.booking-progress span {
    color: #ffffff !important;
    background: #2a2d33 !important;
    border-color: var(--ds-border) !important;
}

.booking-progress li {
    color: #aeb4bd !important;
}

.booking-progress li.active,
.booking-progress li.done {
    color: #ffffff !important;
}

.booking-progress li.active span,
.booking-progress li.done span {
    color: #ffffff !important;
    background: #765b3d !important;
    border-color: var(--ds-primary) !important;
}

.health-options span,
.tip-choice label,
.category-chips button,
.wizard-slots button,
.signature-clear {
    min-height: 48px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.wizard-message,
.flash.error,
.portal-alert.error,
.portal-flash.error {
    color: #ffd7d7 !important;
    background: #3a2023 !important;
    border: 1px solid #7c3c42 !important;
}

.status-confirmed,
.status-available,
.status-completed,
.status.confirmed,
.status.completed,
.portal-status,
.flash.success,
.portal-alert.success,
.resource-state.on {
    color: #baf0c8 !important;
    background: #1d3425 !important;
}

.status-pending,
.status-waiting,
.status-cleaning,
.status.pending,
.status.waiting,
.status.cleaning,
.flash.warning,
.consent-badge.pending {
    color: #ffe1a6 !important;
    background: #3c2e18 !important;
}

.status-in_session,
.status-occupied,
.status.in_session,
.status.occupied,
.status-cancelled,
.status-no_show,
.status-review_required,
.status.cancelled,
.status.no_show,
.status.review_required {
    color: #ffd0d0 !important;
    background: #3a2023 !important;
}

.signature-pad-wrap,
#signature-pad {
    background: #ffffff !important;
}

.sheet {
    color-scheme: light;
    color: #2c302e !important;
    background: #ffffff !important;
}

@media (max-width: 720px) {
    .booking-header,
    .booking-tools,
    .locale-switcher,
    .wizard-actions {
        max-width: 100%;
    }

    .booking-card {
        padding: 20px 14px !important;
    }

    .booking-tools {
        gap: 10px !important;
    }

    .locale-switcher {
        flex: 1;
    }

    .language-menu summary {
        min-width: 116px;
        max-width: 148px;
    }

    .language-options {
        width: min(190px, calc(100vw - 28px));
    }

    .currency-switcher select {
        width: 100%;
        min-width: 92px;
    }

    .wizard-actions {
        margin-right: -14px !important;
        margin-left: -14px !important;
        padding: 14px !important;
        background: rgba(30, 32, 36, .96) !important;
        border-color: var(--ds-border) !important;
    }

    .wizard-actions button:not([hidden]) {
        min-width: 0;
        width: 100%;
        padding-inline: 14px !important;
    }

    .schedule-card,
    .input-grid,
    .ambience-grid,
    .review-card,
    .payment-choice label {
        min-width: 0;
    }

    .booking-progress li small {
        max-width: 68px;
        overflow-wrap: anywhere;
        text-align: center;
    }

    .room-choice > b {
        margin-right: 8px;
        white-space: nowrap;
    }
}

.corporate-header > a,
.corporate-header > a strong {
    color: #ffffff !important;
}

.corporate-header > a small {
    color: #d1d5db !important;
}

body > main.card > p > a {
    color: #d6bb97 !important;
    font-weight: 700 !important;
}
