/* Book Now uses the Client Portal light palette by default.
   Layered important declarations own theme colors over inherited dark inline CSS. */
@layer refresh-booking-light {
  @media (max-width: 767px) {
    #calendar-days > button {
      display: flex !important; align-items: center !important; justify-content: center !important;
      padding: 0 !important; line-height: 1 !important; font-variant-numeric: tabular-nums;
    }
    #confirmation-modal { z-index: 120 !important; }
    .mobile-confirmation-back { gap: 6px !important; }
    #booking { padding-top: 90px !important; }
    #book-now-availability-card { scroll-margin-top: 90px; }
    #time-slots-wrapper { scroll-margin-top: 90px; }
    #time-slots-wrapper:not(.hidden) { display: block !important; }
    #time-slots-wrapper .book-now-time-selection-bar { margin-bottom: 1rem !important; }
    #time-slots .portal-time-slot-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)) !important; gap: .4rem; }
    #time-slots .time-slot-btn {
      display: flex !important; align-items: center !important; justify-content: center !important;
      min-width: 0; min-height: 34px !important; height: 34px !important;
      padding: 0 5px !important; gap: 4px !important; flex-wrap: nowrap !important;
    }
    #time-slots .time-slot-btn .time-slot-label {
      flex: 0 0 auto !important; font-size: 12px !important; font-weight: 500 !important;
      line-height: 16px !important; white-space: nowrap; font-variant-numeric: tabular-nums;
    }
    #time-slots .time-slot-btn :is(.booking-status-icon, .request-booking-icon, .travel-fee-icon, .portal-express-request-mark) {
      width: 10px !important; height: 10px !important; min-width: 10px;
      flex: 0 0 10px !important; margin: 0 !important; align-self: center;
      object-fit: contain; font-size: 10px !important; line-height: 10px !important;
    }
    #time-slots .time-slot-btn .portal-slot-available-dot {
      width: 5px !important; height: 5px !important; flex: 0 0 5px !important; margin: 0 !important;
      align-self: center; box-shadow: none !important;
    }
    #time-slots .portal-action-day-btn {
      display: inline-flex !important; align-items: center !important; justify-content: center !important;
      gap: 6px !important; font-size: 13px !important; line-height: 18px !important;
    }
    #time-slots .portal-action-day-btn :is(.booking-status-icon, .request-booking-icon) {
      width: 13px !important; height: 13px !important; flex: 0 0 13px !important; margin: 0 !important;
    }
    .book-now-therapist-group { margin-bottom: .75rem; border: 1px solid var(--booking-border) !important; background: var(--booking-surface); }
    .book-now-therapist-group > summary { display: flex !important; min-height: 48px; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem .9rem; color: var(--booking-text); cursor: pointer; list-style: none; font-size: .88rem; font-weight: 700; }
    .book-now-therapist-group > summary::-webkit-details-marker { display: none; }
    .book-now-therapist-group > summary::after { content: '+'; flex: 0 0 auto; color: var(--booking-accent); font-size: 1.15rem; line-height: 1; }
    .book-now-therapist-group[open] > summary::after { content: '−'; }
    .book-now-therapist-group > summary:focus-visible { outline: 2px solid var(--booking-accent); outline-offset: 2px; }
    .book-now-therapist-group__content { padding: .15rem .9rem .85rem; }
    .book-now-therapist-category { margin: .75rem 0 0; }
    #sticky-bar { display: none !important; }
  }
  @media (max-width: 359px) {
    .site-header { grid-template-columns: minmax(0, 1fr) auto !important; gap: 8px !important; padding: 0 12px !important; }
    .site-header .brand { width: auto !important; min-width: 0 !important; gap: 6px !important; }
    .site-header .brand img { width: 32px !important; height: 32px !important; }
    .site-header .brand-copy strong { font-size: 13px !important; }
    .site-header .brand-copy span { font-size: 5.5px !important; }
    .site-header .menu-button { padding: 10px !important; gap: 6px !important; }
  }
  :root {
    color-scheme: light !important;
    --booking-bg: #eadecc;
    --booking-surface: #f1e6d5;
    --booking-muted-surface: #d7c9b6;
    --booking-text: #282726;
    --booking-muted: #5d5851;
    --booking-accent: #745833;
    --booking-border: #a98e64;
    --booking-button: #c3a472;
    --booking-button-hover: #b4996d;
    --booking-shadow: 0 12px 30px rgba(74,58,35,.1);
  }
  html, body, #booking { background: var(--booking-bg) !important; color: var(--booking-text) !important; }
  body { color-scheme: light !important; }
  body, body :where(div, p, span, label, legend, small, strong, em, li, dt, dd, summary, a, button, input, select, option, optgroup, textarea, h1, h2, h3, h4) {
    font-family: 'Manrope', sans-serif !important;
  }
  #refresh-recipient-matching > legend, #refresh-recipient-matching > p { color: var(--booking-text) !important; }
  body :where(div, p, span, label, small, strong, em, li, summary, a, button, h1, h2, h3, h4) { color: inherit !important; }
  body * { border-color: var(--booking-border) !important; scrollbar-color: var(--booking-border) var(--booking-surface) !important; }
  ::selection { background: var(--booking-muted-surface) !important; color: var(--booking-text) !important; }
  :is(h1,h2,h3,h4), [class*="text-brand-gold"], .booking-status-text,
  .client-booking-work-heading, .client-booking-dossier__label { color: var(--booking-accent) !important; }
  [class*="text-brand-light"], [class*="text-white"], .nav-link { color: var(--booking-text) !important; }
  [class*="text-brand-dim"], [class*="text-gray"], [class*="text-slate"],
  .booking-progress-meta, .progress-step, .booking-substatus, .client-booking-payment-note,
  .client-booking-dossier dt, .client-details-header p, .client-booking-acknowledgements label,
  .portal-calendar-legend, #address-modal label { color: var(--booking-muted) !important; }
  [class*="bg-brand-black"], [class*="bg-brand-dark"], [class*="bg-black/"],
  [class*="bg-white/"], .client-booking-dossier, .client-booking-work,
  .client-details-header, .client-booking-acknowledgements, .mobile-confirmation-actions,
  #sticky-bar, #mobile-sticky-footer, .booking-progress, .confirmation-ribbon {
    background: var(--booking-surface) !important;
  }
  .header-hero { background: var(--booking-bg) !important; }
  .header-hero::before { background: linear-gradient(rgba(234,222,204,.87), var(--booking-bg)) !important; }
  .card-fancy, .modal-card, .client-details-shell, .booking-modal-card, .blocked-modal-card,
  .booking-info-glass, .simultaneous-therapist-card,
  .modal-backdrop > div, #refresh-practitioner-notice, .refresh-treatment-options,
  .mobile-themed-select__menu, .treatment-explanation, .legend-tooltip,
  .public-simultaneous-picker__menu, .public-simultaneous-picker__trigger {
    background: var(--booking-surface) !important;
    color: var(--booking-text) !important;
    border-color: var(--booking-border) !important;
    box-shadow: var(--booking-shadow) !important;
    backdrop-filter: none !important;
  }
  .modal-backdrop, #booking-modal-overlay, #blocked-modal-overlay,
  #refresh-practitioner-notice::backdrop { background: rgba(74,58,35,.3) !important; }
  .client-booking-dossier, #availability-status, .confirmation-ribbon:not(.confirmation-ribbon--card) {
    background: #e7dbca !important;
  }
  input, select, textarea, #address-modal input, #address-modal select,
  .book-now-select, .refresh-treatment-picker .treatment-trigger,
  .mobile-themed-select__trigger, #stripe-card-element, #stripe-postal-code {
    color-scheme: light !important;
    background-color: var(--booking-surface) !important;
    color: var(--booking-text) !important;
    border-color: var(--booking-border) !important;
    box-shadow: none !important;
    caret-color: var(--booking-text) !important;
  }
  input::placeholder, textarea::placeholder { color: var(--booking-muted) !important; opacity: 1 !important; }
  input:-webkit-autofill { -webkit-text-fill-color: var(--booking-text) !important; box-shadow: 0 0 0 1000px var(--booking-surface) inset !important; }
  input[type="checkbox"], input[type="radio"] { accent-color: var(--booking-accent) !important; }
  option, optgroup { background: var(--booking-surface) !important; color: var(--booking-text) !important; }
  .book-now-select, #refresh-recipient-gender, #refresh-recipient-age-group {
    background-repeat: no-repeat !important; background-position: right 1rem center !important; background-size: 20px 20px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%23745833' stroke-width='1.5'/%3E%3C/svg%3E") !important;
  }
  button, a.border-2 { background: transparent !important; }
  a.border-2 { color: var(--booking-accent) !important; box-shadow: none !important; }
  a.border-2:hover, a.border-2:focus-visible { background: var(--booking-muted-surface) !important; color: var(--booking-text) !important; }
  .refresh-skip-link { background: var(--booking-surface) !important; color: var(--booking-text) !important; }
  button, .btn-gold, .booking-home-btn, .header-cta, .menu-button { color: var(--booking-accent) !important; }
  .btn-filled, .practitioner-notice-confirm, .booking-home-btn,
  button[class*="bg-brand-gold"], .mobile-confirmation-continue {
    background: var(--booking-button) !important;
    border-color: var(--booking-border) !important;
    color: var(--booking-text) !important;
    box-shadow: none !important;
  }
  .btn-filled:hover, .practitioner-notice-confirm:hover, .booking-home-btn:hover,
  button[class*="bg-brand-gold"]:hover, .mobile-confirmation-continue:hover { background: var(--booking-button-hover) !important; }
  .btn-gold { background: transparent !important; border-color: var(--booking-accent) !important; }
  .btn-gold:hover, .mobile-confirmation-nav [aria-current="step"] { background: var(--booking-muted-surface) !important; color: var(--booking-text) !important; }
  :is(button,a,input,select,textarea):focus-visible { outline: 2px solid var(--booking-accent) !important; outline-offset: 2px !important; }
  .refresh-treatment-picker .treatment-choice, .refresh-treatment-picker .treatment-info,
  .practitioner-notice-close, .client-modal-close-btn { background: transparent !important; color: var(--booking-accent) !important; }
  .refresh-treatment-picker .treatment-row:hover, .refresh-treatment-picker .treatment-row:focus-within,
  .refresh-treatment-picker .treatment-row:has([aria-pressed="true"]),
  .mobile-themed-select__option:hover, .mobile-themed-select__option[aria-selected="true"] {
    background: var(--booking-muted-surface) !important;
  }
  .refresh-treatment-picker .treatment-row:is(:hover,:focus-within,:has([aria-pressed="true"])) button,
  .mobile-themed-select__option:hover, .mobile-themed-select__option[aria-selected="true"] {
    color: var(--booking-text) !important;
  }
  .calendar-day-available, .calendar-day-waitlist, .time-slot-btn {
    background: var(--booking-surface) !important; color: var(--booking-text) !important;
  }
  #calendar-days button { color: var(--booking-text) !important; }
  #calendar-days button:disabled { color: var(--booking-muted) !important; }
  .calendar-day-available:hover, .calendar-day-waitlist:hover, .time-slot-btn:hover {
    background: var(--booking-muted-surface) !important;
  }
  .calendar-day-selected, .time-slot-selected, .time-slot-selected:hover {
    background: var(--booking-button) !important; color: var(--booking-text) !important;
    border-color: var(--booking-accent) !important; box-shadow: 0 0 0 1px var(--booking-accent) !important;
  }
  .calendar-day-today::after, .mobile-themed-select__chevron { border-color: var(--booking-accent) !important; }
  .legend-help, .public-simultaneous-picker__name { color: var(--booking-accent) !important; }
  .booking-spinner { border-color: var(--booking-muted-surface) !important; border-top-color: var(--booking-accent) !important; }
  .booking-progress-line, .progress-step-line { background: var(--booking-border) !important; }
  .pac-container { background: var(--booking-surface) !important; color: var(--booking-text) !important; box-shadow: var(--booking-shadow) !important; }
  .pac-item { color: var(--booking-muted) !important; background: transparent !important; }
  .pac-item-query, .pac-matched { color: var(--booking-accent) !important; }
  .pac-item:hover, .pac-item-selected { background: var(--booking-muted-surface) !important; }
  .pac-icon { filter: none !important; }
  #stripe-payment-section, .confirmation-ribbon--card, [class*="bg-blue-"], [class*="bg-indigo-"] {
    background: #e7eff8 !important; color: #244b78 !important; border-color: #779cc7 !important;
  }
  #stripe-payment-section p, #stripe-payment-section [class*="text-brand"],
  .confirmation-ribbon--card *, [class*="text-blue-"], [class*="text-indigo-"] { color: #244b78 !important; }
  #stripe-card-element, #stripe-postal-code { border-color: #635bff !important; }
  [class*="text-red-"], .booking-error-icon, .stripe-field-invalid { color: #9e3434 !important; }
  [class*="bg-red-"] { background: #f5e2dc !important; border-color: #bc7065 !important; }
  [class*="text-green-"], [class*="text-emerald-"], .booking-success-icon { color: #276341 !important; }
  [class*="bg-green-"], [class*="bg-emerald-"] { background: #e0eadb !important; border-color: #77966d !important; }
  [class*="text-amber-"], [class*="text-yellow-"] { color: #775013 !important; }
  [class*="bg-amber-"], [class*="bg-yellow-"] { background: #f3e4be !important; border-color: #a98e64 !important; }
  .site-header, .mobile-menu, .site-footer { background: var(--booking-surface) !important; color: var(--booking-text) !important; box-shadow: var(--booking-shadow) !important; }
  .site-header .brand-copy strong, .site-header .brand-copy span, .header-social a,
  .header-social button, .mobile-menu a { color: var(--booking-accent) !important; }
  .header-social a, .header-social button { background: transparent !important; }
  .header-social a, .header-social button { opacity: 1 !important; }
  .header-social a:hover, .header-social a:focus-visible { background: var(--booking-muted-surface) !important; color: var(--booking-text) !important; }
  .header-social button:disabled { color: var(--booking-muted) !important; }
  #calendar-days .calendar-day-indicators { display: none !important; }
  .site-header .brand img { filter: grayscale(1) invert(1); mix-blend-mode: multiply; }
  .menu-lines, .menu-lines::before, .menu-lines::after { background: var(--booking-accent) !important; }
  .mobile-menu {
    z-index: 115 !important;
    inset: 84px clamp(20px, 4vw, 64px) auto auto !important;
    width: min(320px, calc(100vw - 32px)) !important;
    max-width: none !important;
    max-height: calc(100dvh - 100px);
    overflow-y: auto;
    padding: 8px !important;
    border: 1px solid var(--booking-border) !important;
    transform: none !important;
    transition: opacity 150ms ease !important;
    visibility: hidden;
  }
  #calendar-days .calendar-day-selected { background: var(--booking-button) !important; }
  .book-now-calendar-state-key [class*="bg-brand-gold/15"] { background: var(--booking-surface) !important; }
  .book-now-calendar-state-key [class*="bg-brand-gold/30"] { background: var(--booking-button) !important; }
  .mobile-menu.open { visibility: visible; }
  .site-header.scrolled + .mobile-menu { top: 70px !important; max-height: calc(100dvh - 86px); }
  .mobile-menu a, .mobile-menu button {
    padding: 12px 14px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
  }
  @media (max-width: 760px) { .mobile-menu { top: 70px !important; right: 16px !important; max-height: calc(100dvh - 86px); } }
  @media (max-width: 760px) {
    #client-details-modal .booking-summary-rows { grid-template-columns: minmax(0, 1fr) !important; }
    #client-details-modal .booking-summary-total { grid-column: 1 !important; grid-row: auto !important; text-align: left !important; margin-top: .4rem !important; }
    #client-details-modal .client-booking-dossier #summary-modal-price { white-space: normal !important; }
  }
  .booking-progress { background: transparent !important; }
  .booking-progress-meta { font-size: .75rem !important; letter-spacing: .08em !important; }
  .booking-progress .progress-step { font-size: .8125rem !important; line-height: 1.4 !important; letter-spacing: .02em !important; }
  .booking-progress-step-state { font-size: .6875rem !important; letter-spacing: .06em !important; }
  .booking-progress .progress-step.active, .booking-progress .progress-step.completed { color: var(--booking-text) !important; }
  .booking-progress .progress-step.active { font-weight: 700 !important; }
  .booking-progress-meta strong, .booking-progress .progress-step.active .booking-progress-step-state { color: var(--booking-accent) !important; }
  .booking-progress-meter { height: 3px !important; background: var(--booking-muted-surface) !important; }
  .booking-progress-fill { height: 3px !important; background: var(--booking-accent) !important; box-shadow: none !important; }
  .booking-progress-tick { background: var(--booking-accent) !important; top: -2px !important; }
  .refresh-address-logo {
    display: block !important;
    width: 144px !important; height: 144px !important;
    background: var(--booking-text) !important;
    mask-image: url('/assets/refresh-logo.webp'); mask-mode: luminance;
    mask-size: contain; mask-repeat: no-repeat; mask-position: center;
  }
  @media (max-width: 767px) { .refresh-address-logo { width: 120px !important; height: 120px !important; transform: scale(1.15); } }
  @media (min-width: 768px) { .refresh-address-logo { transform: scale(1.25); } }
}
@layer refresh-booking-light {
  #mobile-progress-footer, #mobile-progress-footer.expanded, .progress-footer {
    background: var(--booking-surface) !important; color: var(--booking-text) !important;
    box-shadow: 0 -8px 24px rgba(74,58,35,.12) !important;
  }
  .step-circle-mini, .step-circle, .progress-footer-step .step-label { color: var(--booking-accent) !important; }
  .progress-footer-step.active .step-circle-mini {
    background: var(--booking-button) !important; color: var(--booking-text) !important; box-shadow: none !important;
  }
  .progress-footer-step.completed .step-circle-mini { background: var(--booking-muted-surface) !important; color: var(--booking-text) !important; box-shadow: none !important; }
  .progress-footer-step .step-label { font-size: .6875rem !important; }
  .time-slot-btn { background: #e7dbca !important; color: var(--booking-text) !important; box-shadow: none !important; }
  .book-now-available-slot { border-color: #6d8b70 !important; background: #e7dbca !important; color: var(--booking-text) !important; }
  .book-now-slot-heading--available { color: #315f46 !important; }
  .portal-slot-available-dot { background: #315f46 !important; box-shadow: 0 0 0 1px rgba(49,95,70,.22) !important; }
  .book-now-travel-slot { border-color: #b5784e !important; background: #f2e1d2 !important; color: #713d22 !important; }
  .book-now-slot-heading--travel { color: #88451f !important; }
  .book-now-slot-heading--request { color: #315d77 !important; }
  .book-now-slot-heading--waitlist { color: var(--booking-muted) !important; }
  .book-now-available-slot:hover, .book-now-travel-slot:hover { background: #ded2c0 !important; color: var(--booking-text) !important; }
  .time-slot-btn.time-slot-selected { background: var(--booking-button) !important; color: var(--booking-text) !important; border-color: var(--booking-accent) !important; }
  .confirmation-ribbon.confirmation-ribbon--warning { background: #f3e4ce !important; border-color: #ad7947 !important; color: #714b25 !important; }
  .confirmation-ribbon--warning strong { color: #714b25 !important; }
  .confirmation-ribbon--warning input { accent-color: #885621 !important; }
  .confirmation-ribbon--card input { accent-color: #315d77 !important; }
}
@layer refresh-booking-light {
  .confirmation-ribbon:not(.confirmation-ribbon--card):not(.confirmation-ribbon--warning) {
    background: rgba(116,88,51,.16) !important;
    border-color: #886c47 !important;
    color: #282726 !important;
  }
  .confirmation-ribbon a { color: var(--booking-text) !important; }
  .confirmation-ribbon.confirmation-ribbon--card {
    background: rgba(45,112,220,.18) !important;
    border-color: #537ead !important;
    color: #1f426c !important;
  }
  .confirmation-ribbon--card * { color: #1f426c !important; }
  .confirmation-ribbon.confirmation-ribbon--warning {
    background: rgba(163,99,31,.18) !important;
    border-color: #94622e !important;
    color: #593917 !important;
  }
  .confirmation-ribbon--warning strong { color: #593917 !important; }
}
