/* Approved warm-mocha variant A. Explicit opt-in: no homepage/admin/app changes. */
body.mocha-theme {
  --mocha-page: #34261e;
  --mocha-header: #21160f;
  --mocha-card: #48362b;
  --mocha-field: #3e2d23;
  --mocha-hover: #584230;
  --mocha-text: #f3e8d5;
  --mocha-muted: #ded0b9;
  --mocha-line: #806549;
  --mocha-gold: #ceb073;
  --mocha-accent: #dfbf7d;
  --mocha-on-gold: #23170f;
  --catalog-brown: var(--mocha-page);
  --catalog-panel: var(--mocha-card);
  --catalog-cream: var(--mocha-text);
  --catalog-gold: var(--mocha-gold);
  --catalog-border: var(--mocha-line);
  --wizard-gold: var(--mocha-gold);
  --wizard-border: var(--mocha-line);
  background: var(--mocha-page);
  color: var(--mocha-text);
  color-scheme: dark;
}
.mocha-theme .site-header { position: relative; background: var(--mocha-header); border-bottom: 0; }
.mocha-theme .header-inner { height: 94px; }
.mocha-theme .brand img { width: 64px; height: 64px; object-fit: contain; }
.mocha-theme :is(.massages-hero, .massage-catalog, .offers-main, .booking-hero, .booking-main, .voucher-hero, .voucher-main, .voucher-success, .service-detail-hero, .service-detail-content, .legal-hero, .legal-content) { background: var(--mocha-page); color: var(--mocha-text); }
body.mocha-theme.booking-page .booking-hero { min-height: 0; padding: 26px 0; }
.mocha-theme .voucher-hero { min-height: 0; padding: 40px 0; border-bottom: 0; }
.mocha-theme .legal-hero { padding: 45px 0 26px; }
.mocha-theme .service-detail-hero { border-bottom-color: var(--mocha-line); }
.mocha-theme .service-detail-hero h1 { font-size: clamp(2.15rem, 3.6vw, 3.8rem); overflow-wrap: anywhere; }
.mocha-theme .contact-hero { padding-top: 48px; }
.mocha-theme .site-footer { background: #0f0c0a; }
.mocha-theme .skip-link { background: var(--mocha-gold); color: var(--mocha-on-gold); }

/* Compact inset information card. All original labels and copy remain intact. */
body.mocha-theme :is(.booking-assurance, .happy-hours-rules, .voucher-facts) { background: transparent; color: var(--mocha-text); border: 0; padding: 0; }
.mocha-theme :is(.booking-assurance-grid, .happy-hours-rules-grid, .voucher-facts-grid) {
  display: grid; gap: 0; background: var(--mocha-card); color: var(--mocha-text);
  border: 1px solid var(--mocha-line); border-radius: 10px; padding: 0 22px;
}
body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact) {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); align-content: start;
  column-gap: 14px; row-gap: 5px; min-width: 0; padding: 20px 24px;
  border: 0; border-right: 1px solid var(--mocha-line);
}
body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact):first-child { padding-left: 0; }
body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact):last-child { padding-right: 0; border-right: 0; }
.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact)::before {
  content: ''; grid-column: 1; grid-row: 1 / span 2; width: 20px; height: 20px; margin-top: 2px;
  background: var(--mocha-accent); -webkit-mask: var(--mocha-icon) center / contain no-repeat; mask: var(--mocha-icon) center / contain no-repeat;
}
.mocha-theme [data-mocha-icon="card"] { --mocha-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E"); }
.mocha-theme [data-mocha-icon="pin"] { --mocha-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Cpath d='M20 10c0 6-8 12-8 12S4 16 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.mocha-theme [data-mocha-icon="clock"] { --mocha-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.mocha-theme [data-mocha-icon="calendar"] { --mocha-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 11h18m-13 5 3 3 5-5'/%3E%3C/svg%3E"); }
.mocha-theme [data-mocha-icon="mail"] { --mocha-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 6 9 7 9-7'/%3E%3C/svg%3E"); }
body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact) > span { grid-column: 2; margin: 0; color: var(--mocha-accent); font: 500 .7rem/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact) > strong { grid-column: 2; color: var(--mocha-text); font: 400 1rem/1.5 var(--sans); white-space: normal; letter-spacing: normal; }

/* Cards share the approved warmer fill, thin border and gently rounded corners. */
body.mocha-theme :is(.massage-card, .offer-card, .booking-panel, .booking-summary, .booking-confirmation, .voucher-form-panel, .voucher-success-wrap, .contact-card, .service-detail-copy-grid aside) {
  background: var(--mocha-card); color: var(--mocha-text); border: 1px solid var(--mocha-line); border-radius: 10px;
}
.mocha-theme :is(.massage-card, .offer-card):hover { border-color: var(--mocha-accent); }
.mocha-theme :is(.massage-content > p, .offer-description, .service-lead, .service-detail-copy-grid p, .service-detail-copy-grid dd, .voucher-note, .voucher-pickup-help, .voucher-success-note, .booking-privacy, .booking-hotel-address p, .booking-hotel-address small, .booking-processing-copy > span, .booking-processing-hint, .voucher-processing-copy > span, .voucher-processing-hint) { color: var(--mocha-muted); }
.mocha-theme :is(.service-detail-copy-grid h2, .contact-card, .contact-about .service-secondary-action, .booking-summary-list dd, .booking-victory-list dd, .voucher-success-details dd, .manage-confirmation-details dd, .booking-package-victory) { color: var(--mocha-text); }
.mocha-theme :is(.contact-card dt, .service-detail-copy-grid dt, .booking-summary-list dt, .booking-victory-list dt, .voucher-success-details dt, .manage-confirmation-details dt, .booking-summary .eyebrow, .voucher-form-panel .eyebrow, .voucher-success-heading .eyebrow, .booking-package-coverage strong) { color: var(--mocha-accent); }
.mocha-theme :is(.contact-card dl div, .service-detail-copy-grid dl div, .booking-summary-list > div, .booking-victory-list > div, .voucher-success-details > div, .booking-step, .booking-package-coverage, .manage-confirmation-details > div) { border-color: var(--mocha-line); }
.mocha-theme :is(.booking-confirmation-card, .voucher-success-details, .booking-offer-context, .booking-package-victory, .booking-nearest, .booking-selection-context, .service-happy-note, .stripe-payment-element, .stripe-voucher-element) { background: var(--mocha-field); color: var(--mocha-text); border-color: var(--mocha-line); border-radius: 8px; }
.mocha-theme .voucher-catalog { border: 0; gap: 12px; }
.mocha-theme .voucher-product { padding: 0 16px; background: var(--mocha-card); border: 1px solid var(--mocha-line); border-radius: 10px; }
.mocha-theme .voucher-product-heading { color: var(--mocha-text); }
.mocha-theme .voucher-product > p { color: var(--mocha-muted); }
.mocha-theme .voucher-product li { color: var(--mocha-text); }
.mocha-theme .voucher-product :is(li strong, .voucher-product-from) { color: var(--mocha-accent); }
.mocha-theme .voucher-offer-overview { border-color: var(--mocha-line); }
.mocha-theme .voucher-price { background: var(--mocha-field); color: var(--mocha-text); border: 1px solid var(--mocha-line); border-radius: 6px; }

/* Native inputs, custom dropdowns and the date picker form one visual family. */
body.mocha-theme :is(.booking-field > span, .booking-form > label > span, .booking-form legend, .booking-tip-custom label span, .voucher-field > span, .voucher-field legend, .booking-form .booking-terms > span, .booking-form .booking-package-terms > span) { color: var(--mocha-muted); }
body.mocha-theme :is(.booking-field input:not([type=checkbox]):not([type=radio]), .booking-field select, .booking-form input:not([type=checkbox]):not([type=radio]), .booking-form select, .booking-form textarea, .booking-hotel-address textarea, .voucher-field input:not([type=checkbox]):not([type=radio]), .voucher-field select, .voucher-field textarea, .essence-select .essence-select-trigger, .booking-date-picker .booking-date-trigger) {
  background: var(--mocha-field); color: var(--mocha-text); border-color: var(--mocha-line); border-radius: 8px;
}
.mocha-theme :is(.booking-form input, .booking-form textarea, .voucher-field input, .voucher-field textarea)::placeholder { color: var(--mocha-muted); opacity: .85; }
.mocha-theme select option { background: var(--mocha-card); color: var(--mocha-text); }
body.mocha-theme :is(.essence-select .essence-select-list, .booking-date-picker .booking-calendar) { background: var(--mocha-card); color: var(--mocha-text); border-color: var(--mocha-line); scrollbar-color: var(--mocha-line) var(--mocha-card); }
.mocha-theme .essence-select .essence-select-option { color: var(--mocha-text); }
.mocha-theme .essence-select .essence-select-group { color: var(--mocha-muted); }
.mocha-theme .essence-select .essence-select-option[aria-selected="true"] { background: var(--mocha-gold); color: var(--mocha-on-gold); }
.mocha-theme .essence-select-option[aria-selected="true"] .essence-select-tick { color: var(--mocha-on-gold); }
.mocha-theme .essence-select-option.is-active:not([aria-disabled="true"]) { box-shadow: inset 0 0 0 1px var(--mocha-accent); }
.mocha-theme .essence-select-chevron { border-color: var(--mocha-accent); }
@media (hover: hover) { .mocha-theme .essence-select-option:hover:not([aria-disabled="true"]):not([aria-selected="true"]) { background: var(--mocha-hover); } }
body.mocha-theme .booking-date-picker :is(.booking-calendar-title, .booking-calendar-day, .booking-calendar-nav) { color: var(--mocha-text); }
body.mocha-theme .booking-date-picker .booking-calendar-weekday { color: var(--mocha-muted); }
body.mocha-theme .booking-date-picker .booking-calendar-day.selected { color: var(--mocha-on-gold); background: var(--mocha-gold); border-color: var(--mocha-gold); }
body.mocha-theme .booking-date-picker .booking-calendar-day.closed-day:disabled { background: var(--mocha-field); color: #bbab95; }
.mocha-theme .wizard-step-number { background: var(--mocha-field); border-color: var(--mocha-line); }
.mocha-theme .wizard-progress-step[aria-current=step] .wizard-step-number { background: var(--mocha-gold); color: var(--mocha-on-gold); }
.mocha-theme :is(.wizard-selection, .wizard-bar, .wizard-day, .booking-choice, .catalog-price-option, .offer-package-price) { border-color: var(--mocha-line); }
.mocha-theme :is(.booking-payment-choice label, .voucher-options label, .booking-voucher, .booking-tip-choice) { background: var(--mocha-field); border-color: var(--mocha-line); border-radius: 8px; color: var(--mocha-text); }
body.mocha-theme .booking-payment-choice label span { color: inherit; }
body.mocha-theme :is(.booking-voucher legend, .booking-tip-choice legend) { color: var(--mocha-muted) !important; }
body.mocha-theme :is(.booking-payment-choice label, .voucher-options label):has(input:checked) { background: var(--mocha-gold); color: var(--mocha-on-gold); border-color: var(--mocha-gold); box-shadow: none; }
.mocha-theme :is(input[type=checkbox], input[type=radio]) { accent-color: var(--mocha-gold); }
.mocha-theme :is(.booking-voucher-entry button, .booking-voucher-use, .booking-tip-options button, .booking-tip-custom button, .booking-payment-back, .payment-check-again, .booking-nearest-button, .voucher-product-choose) { background: var(--mocha-field); color: var(--mocha-text); border-color: var(--mocha-line); border-radius: 6px; }
body.mocha-theme :is(.button:not(.button-outline), .catalog-book, .massage-book, .offer-package-book, .booking-submit, .wizard-next, .voucher-submit, .voucher-success-primary, .service-primary-action) { background: var(--mocha-gold); border-color: var(--mocha-gold); color: var(--mocha-on-gold); border-radius: 6px; }
.mocha-theme :is(.catalog-price-option[aria-pressed=true], .booking-choice.active, .wizard-day[aria-pressed=true], .booking-tip-options button.active) { background: var(--mocha-gold); color: var(--mocha-on-gold); border-color: var(--mocha-gold); }
.mocha-theme :is(.booking-confirmation .text-link, .voucher-success-actions a:not(.voucher-success-primary), .manage-secondary-link, .service-secondary-action) { color: var(--mocha-accent); border-color: var(--mocha-line); }
.mocha-theme .booking-submit-total { color: var(--mocha-text); border-color: var(--mocha-line); }
.mocha-theme :is(.booking-field-error, .booking-form .booking-field-error, .booking-voucher-status.error, .manage-cancel) { color: #ffbdb3; }
.mocha-theme :is(.booking-result.error, .voucher-result.error, .essence-select .essence-select-error) { background: #52342c; color: #ffe0da; border-color: #bc8271; }
.mocha-theme :is(.booking-result.success, .voucher-result.success) { background: var(--mocha-field); color: var(--mocha-text); }
.mocha-theme :is(.booking-voucher-status:not(.error), .voucher-result.success a) { color: #d4e7bf; }
.mocha-theme :is(.booking-processing-spinner, .voucher-processing-spinner) { border-color: var(--mocha-line); border-top-color: var(--mocha-gold); }
.mocha-theme :is(button, a, input, select, textarea):focus-visible { outline: 3px solid var(--mocha-accent); outline-offset: 3px; }

/* Navigation surfaces and long-form pages use the same warm tones. */
.mocha-theme :is(.site-menu-dialog, .site-nav) { background-color: var(--mocha-card); color: var(--mocha-text); }
.mocha-theme .site-menu-dialog .site-nav { background: transparent; }
.mocha-theme .site-menu-dialog .site-nav > a:hover { background: var(--mocha-hover); }
.mocha-theme .site-menu-dialog .site-nav > a[aria-current] { background: var(--mocha-field); border-color: var(--mocha-gold); }
.mocha-theme .legal-article { background: var(--mocha-card); border: 1px solid var(--mocha-line); border-radius: 10px; padding: 28px; }
.mocha-theme .legal-article :is(p, ol, ul, li, strong, h2, h3, td) { color: var(--mocha-text); }
.mocha-theme :is(.legal-updated, .legal-status) { color: var(--mocha-accent); }
.mocha-theme .legal-article :is(th, blockquote) { background: var(--mocha-field); color: var(--mocha-text); }
.mocha-theme .legal-article :is(th, td, blockquote) { border-color: var(--mocha-line); }
.mocha-theme .legal-article a { text-decoration-color: var(--mocha-accent); }

@media (max-width: 820px) {
  .mocha-theme :is(.happy-hours-rules-grid, .voucher-facts-grid) { grid-template-columns: minmax(0, 1fr); }
  body.mocha-theme :is(.happy-hours-rule, .voucher-fact) { padding: 17px 0; border: 0; border-bottom: 1px solid var(--mocha-line); }
  body.mocha-theme :is(.happy-hours-rule, .voucher-fact):last-child { border-bottom: 0; }
}
@media (max-width: 680px) {
  .mocha-theme .header-inner { height: 82px; }
  .mocha-theme .brand img { width: 52px; height: 52px; }
  body.mocha-theme.booking-page .booking-hero { padding: 18px 0 22px; }
  .mocha-theme .voucher-hero { padding: 22px 0 28px; }
  .mocha-theme .legal-hero { padding: 28px 0 20px; }
  .mocha-theme .contact-hero { padding-top: 28px; }
  .mocha-theme :is(.booking-assurance-grid, .happy-hours-rules-grid, .voucher-facts-grid) { grid-template-columns: minmax(0, 1fr); padding: 0 16px; }
  body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact) { padding: 16px 0; border: 0; border-bottom: 1px solid var(--mocha-line); column-gap: 12px; }
  body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact):last-child { border-bottom: 0; }
  body.mocha-theme :is(.booking-assurance-item, .happy-hours-rule, .voucher-fact) > strong { font-size: .94rem; }
  .mocha-theme .legal-article { padding: 20px 16px; }
}
