/* =============================================================
   arc therapy — colour-theme system
   Five whole-site treatments, scoped under :root[data-theme="…"].
   Mechanism: redefine the tokens site.css already declares
   (--forrest, --sage, --sage-pale, --sage-mist, --moss, --cedar,
   --cedar-soft, --clay, --ivory, --paper, --line, --line-soft) so
   every component that already consumes those tokens re-themes
   itself for free. Targeted selector overrides are added only
   where site.css bakes a colour in as a literal hex/rgba instead
   of a token (header nav states, mbar, booking-desk header band,
   the closing CTA band) — i.e. exactly where a flipped surface
   needs its text/links/borders to flip with it.

   Palette discipline: every value below is one of the five brand
   colours (Forrest #1F3B1C · Sage #A3B099 · Moss #80806B ·
   Cedar #663826 · Ivory #F0EDE0) or a same-hue tint/shade of one.
   No outside greys. Contrast checked against WCAG 4.5:1 (body
   text) / 3:1 (large display text) for every ground it sits on.
   ============================================================= */

/* ---------- 1. forest — the current look (default) ----------
   No overrides. This is the palette already shipped in site.css;
   the other four themes are variations FROM this baseline. The
   switcher sets data-theme="forest" explicitly so its own select
   shows the right option selected, but nothing here needs to
   change for that to render correctly. */


/* ---------- 2. ivory — light-led ----------
   Header flips to warm ivory with forest type and a cedar Book
   button; the default button colour follows suit so the whole
   page reads bright and editorial rather than forest-green. */
:root[data-theme="ivory"]{
  --sage-mist:#F1F4EC;
  --moss:#5C5C4E;         /* darkened for 4.5:1+ on the brighter grounds below */
  --ivory:#F6F3E8;
  --paper:#FBF9F3;
  --line:rgba(31,59,28,.10);
  --line-soft:rgba(31,59,28,.06);
}

:root[data-theme="ivory"] .hdr{background:var(--ivory);color:var(--forrest);box-shadow:0 1px 0 var(--line)}
:root[data-theme="ivory"] .brand svg{fill:var(--forrest)}
:root[data-theme="ivory"] .nav a,
:root[data-theme="ivory"] .nav .off{color:var(--moss)}
:root[data-theme="ivory"] .nav a:hover{background:rgba(31,59,28,.07);color:var(--forrest)}
:root[data-theme="ivory"] .nav a[aria-current="page"]{background:rgba(31,59,28,.10);color:var(--forrest)}
:root[data-theme="ivory"] .nav .off{color:rgba(92,92,78,.55)}
:root[data-theme="ivory"] .hdr-tel{color:var(--cedar)}
:root[data-theme="ivory"] .hdr-tel:hover{color:var(--forrest)}
:root[data-theme="ivory"] .burger{border-color:rgba(31,59,28,.25);color:var(--forrest)}

/* Book button + default buttons lean cedar in this theme */
:root[data-theme="ivory"] .btn{background:var(--cedar);color:var(--ivory)}
:root[data-theme="ivory"] .btn:hover{background:var(--cedar-soft)}
/* …restated AFTER the generic override above so the variants keep their own identity */
:root[data-theme="ivory"] .btn-clay{background:var(--clay);color:var(--forrest-deep)}
:root[data-theme="ivory"] .btn-clay:hover{background:#d9b294;color:var(--forrest-deep)}
:root[data-theme="ivory"] .btn-line{background:transparent;color:var(--forrest);border-color:var(--line);box-shadow:none}
:root[data-theme="ivory"] .btn-line:hover{background:rgba(31,59,28,.06);color:var(--forrest);box-shadow:none}

/* Booking desk header band flips with the site header */
:root[data-theme="ivory"] .desk-top{background:var(--ivory);color:var(--forrest)}
:root[data-theme="ivory"] .desk-step{color:var(--cedar)}

/* Mobile action bar mirrors the header */
:root[data-theme="ivory"] .mbar{background:var(--ivory);box-shadow:0 -1px 0 var(--line)}
:root[data-theme="ivory"] .mbar .a2{color:var(--forrest);border-color:rgba(31,59,28,.28)}

/* Legacy "Colours" nav dropdown (site.css), themed defensively in case a page uses it */
:root[data-theme="ivory"] .drop-btn{color:var(--moss)}
:root[data-theme="ivory"] .nav-drop:hover .drop-btn,
:root[data-theme="ivory"] .nav-drop:focus-within .drop-btn{color:var(--forrest)}
:root[data-theme="ivory"] .drop-menu{background:var(--paper);border-color:var(--line)}
:root[data-theme="ivory"] .drop-menu a{color:var(--moss)}
:root[data-theme="ivory"] .drop-menu a:hover{background:rgba(31,59,28,.07);color:var(--forrest)}
:root[data-theme="ivory"] .drop-menu a[aria-current="page"]{background:rgba(31,59,28,.10);color:var(--forrest)}


/* ---------- 3. cedar — warm-led ----------
   Cedar brown carries the header, the booking desk and the
   closing band; greens retreat to accents and the mist section
   band, which is left untouched on purpose. */
:root[data-theme="cedar"]{
  --moss:#5C5C4E;
  --paper:#FBF7EF;
  --line:rgba(102,56,38,.14);
  --line-soft:rgba(102,56,38,.09);
}

:root[data-theme="cedar"] .hdr{background:var(--cedar);color:var(--ivory)}
:root[data-theme="cedar"] .nav a,
:root[data-theme="cedar"] .nav .off{color:var(--clay)}
:root[data-theme="cedar"] .nav a:hover{background:rgba(240,237,224,.12);color:var(--ivory)}
:root[data-theme="cedar"] .nav a[aria-current="page"]{background:rgba(240,237,224,.16);color:var(--ivory)}
:root[data-theme="cedar"] .nav .off{color:rgba(230,198,172,.5)}
:root[data-theme="cedar"] .hdr-tel{color:var(--clay)}
:root[data-theme="cedar"] .hdr-tel:hover{color:var(--ivory)}
:root[data-theme="cedar"] .burger{border-color:rgba(240,237,224,.35);color:var(--ivory)}

:root[data-theme="cedar"] .desk-top{background:var(--cedar);color:var(--ivory)}
:root[data-theme="cedar"] .desk-step{color:var(--clay)}

:root[data-theme="cedar"] .cta{background:var(--cedar);color:var(--ivory)}
:root[data-theme="cedar"] .cta p{color:var(--clay)}

:root[data-theme="cedar"] .mbar{background:var(--cedar)}
:root[data-theme="cedar"] .mbar .a2{color:var(--ivory);border-color:rgba(240,237,224,.4)}

:root[data-theme="cedar"] .drop-btn{color:var(--clay)}
:root[data-theme="cedar"] .nav-drop:hover .drop-btn,
:root[data-theme="cedar"] .nav-drop:focus-within .drop-btn{color:var(--ivory)}
:root[data-theme="cedar"] .drop-menu{background:#4A2818;border-color:rgba(230,198,172,.3)}
:root[data-theme="cedar"] .drop-menu a{color:var(--clay)}
:root[data-theme="cedar"] .drop-menu a:hover,
:root[data-theme="cedar"] .drop-menu a[aria-current="page"]{background:rgba(240,237,224,.14);color:var(--ivory)}


/* ---------- 4. sage — the softest ----------
   Sage carries the header and the booking desk with forest type;
   grounds shift to mist and pale sage instead of cream ivory;
   cedar keeps doing all the accent work (arrows, highlights,
   the booking-desk progress bar, the big calculator number). */
:root[data-theme="sage"]{
  --sage-pale:#D5DCC9;
  --sage-mist:#E1E7D9;
  --moss:#5C5C4E;
  --ivory:#ECF0E5;   /* repurposed: sec-ivory band + text-on-dark (cta) */
  --paper:#F6F8F3;
}

:root[data-theme="sage"] .hdr{background:var(--sage);color:var(--forrest)}
:root[data-theme="sage"] .brand svg{fill:var(--forrest)}
:root[data-theme="sage"] .nav a,
:root[data-theme="sage"] .nav .off{color:var(--forrest)}
:root[data-theme="sage"] .nav a:hover{background:rgba(31,59,28,.10)}
:root[data-theme="sage"] .nav a[aria-current="page"]{background:rgba(31,59,28,.16)}
:root[data-theme="sage"] .nav .off{color:rgba(31,59,28,.45)}
:root[data-theme="sage"] .hdr-tel{color:var(--forrest)}
:root[data-theme="sage"] .hdr-tel:hover{color:var(--cedar)}
:root[data-theme="sage"] .burger{border-color:rgba(31,59,28,.3);color:var(--forrest)}

:root[data-theme="sage"] .desk-top{background:var(--sage);color:var(--forrest)}
:root[data-theme="sage"] .desk-step{color:var(--forrest);opacity:.75}

:root[data-theme="sage"] .mbar{background:var(--sage)}
:root[data-theme="sage"] .mbar .a2{color:var(--forrest);border-color:rgba(31,59,28,.3)}

:root[data-theme="sage"] .drop-btn{color:var(--forrest)}
:root[data-theme="sage"] .drop-btn:hover{color:var(--cedar)}
:root[data-theme="sage"] .drop-menu{background:var(--paper);border-color:rgba(31,59,28,.15)}
:root[data-theme="sage"] .drop-menu a{color:var(--forrest)}
:root[data-theme="sage"] .drop-menu a:hover,
:root[data-theme="sage"] .drop-menu a[aria-current="page"]{background:rgba(31,59,28,.12)}


/* ---------- 5. ink — highest contrast ----------
   A near-black shade of forrest becomes the dark anchor
   everywhere it already drives a background (header, booking
   desk, closing band, mobile bar, default buttons) purely by
   redefining --forrest/--forrest-deep — the existing sage and
   ivory literals baked into the header/nav rules read clearly
   against it, which is what does the "lifting" the brief asks
   for, with no further overrides required. */
:root[data-theme="ink"]{
  --forrest:#0B140A;
  --forrest-deep:#050A04;
  --sage-mist:#F0F3EB;
  --moss:#4E4E40;
  --ivory:#F5F2E6;
  --paper:#FDFCFA;
  --line:rgba(11,20,10,.18);
  --line-soft:rgba(11,20,10,.10);
}

:root[data-theme="ink"] .hdr{border-bottom:1px solid rgba(163,176,153,.18)}
