/* Light themes, rebuilt from measurement rather than taste.
   ---------------------------------------------------------------------------
   The light themes were a dark-first UI with its variables flipped, and three
   things were measurably wrong. Sampling every light theme in the browser:

     panel vs ground   1.10 - 1.17   cards were the same brightness as the page
     border vs panel   1.39 - 1.84   the only other separation was invisible too
     white on accent   2.14 - 6.47   five of eleven themes failed WCAG AA

   With no depth AND no edges, every surface dissolved into every other one --
   which is why the themes read as flat and washed out without any single thing
   looking obviously broken. arctic was the worst: white button text on #38bdf8
   is 2.14:1, roughly four times short of the 4.5:1 minimum.

   Fixes, in order of how much they matter:
     1. grounds one step deeper, so white panels lift off them (1.24)
     2. borders you can actually see (~2.4:1 against a white card)
     3. --accent-strong: the accent darkened until white text on it clears 4.5:1
     4. light-appropriate shadows -- a tight contact shadow, not a dark-theme haze

   Loads after themes-20260719.css, hence the !important on tokens that file
   also sets with !important. */

/* ---- 1. shared light-mode contract ------------------------------------- */
/* Declared once for every light theme instead of per-theme patches: a theme now
   only has to say what colour it is, not how light mode works. */
body.theme-light, body.arctic{
  /* 32% of the theme's own text colour mixed into its own ground lands every
     theme at ~2.4:1 against a white card -- visible, still quiet, and it stays
     in the theme's hue family rather than going grey. */
  --line: color-mix(in srgb, var(--text) 36%, var(--bg))!important;
  /* Cards actually draw their border from --edge-soft, not --line, so the whole
     scale has to move up together -- raising --line alone changed nothing. */
  --edge-soft: color-mix(in srgb, var(--text) 30%, var(--bg))!important;
  --edge-strong: color-mix(in srgb, var(--text) 50%, var(--bg))!important;

  /* Dark themes lean on a big diffuse shadow; on a light ground that reads as
     grey smog. Light UI wants a 1px contact shadow to seat the card, plus a
     short ambient one for lift. */
  --shadow: 0 1px 2px rgba(16,24,40,.07), 0 8px 20px -6px rgba(16,24,40,.13)!important;

  /* Themes whose accent already clears 4.5:1 on white keep it unchanged; the
     five that do not override this below with a measured value. */
  --accent-strong: var(--accent);
  --button-text:#ffffff;
}

/* ---- 2. grounds, one step deeper --------------------------------------- */
/* Each keeps its own hue; only the level changes. Measured to put white panels
   at ~1.24 against the page -- enough to read as raised without going gloomy.
   (Panels themselves stay white; themes-20260719.css already handles that.) */
body.graphite-light{--bg:#e5e8ea!important;background:#e5e8ea!important}
body.midnight-light{--bg:#e3e7ef!important;background:#e3e7ef!important}
body.forest-light  {--bg:#e3e8e3!important;background:#e3e8e3!important}
body.royal-light   {--bg:#e8e5f1!important;background:#e8e5f1!important}
body.rose-light    {--bg:#eee5e8!important;background:#eee5e8!important}
body.crimson-light {--bg:#f0e6e5!important;background:#f0e6e5!important}
body.orange-light  {--bg:#f1e4db!important;background:#f1e4db!important}
body.sunrise-light {--bg:#f1e5dc!important;background:#f1e5dc!important}
body.copper-light  {--bg:#e9e0d9!important;background:#e9e0d9!important} /* panel is #fffaf6, not white, so this ground goes a shade deeper */
body.ocean-light   {--bg:#e0e8ec!important;background:#e0e8ec!important}
body.arctic        {--bg:#e2e8ec!important;background:#e2e8ec!important}

/* ---- 3. vivid accents, with the ink chosen to match ---------------------- */
/* First pass forced white text on every accent, which meant darkening each one
   until white worked -- and darkening is exactly what drains a colour. Yellow
   made the flaw obvious: no yellow carries white text at 4.5:1 and still looks
   yellow, so sunrise came out mustard.

   So the ink adapts to the accent instead of the accent bending to the ink:
     --accent-vivid  the accent at full saturation, for filled controls
     --accent-ink    white or near-black, whichever is legible on it
     --accent-strong the accent as TEXT on a white card, which still has to
                     clear 4.5:1 against white and so stays deeper

   Saturation is pushed 25% and lightness left alone wherever the pair already
   passes, so these read brighter than the originals, not just darker.
                          vivid            ink        strong        */
body.graphite-light{--accent-vivid:#5f7390;--accent-ink:#ffffff;--accent-strong:#60738f} /* 4.83 / 4.82 */
body.midnight-light{--accent-vivid:#115cff;--accent-ink:#ffffff;--accent-strong:#115cff} /* 5.27 / 5.27 */
body.forest-light  {--accent-vivid:#04b545;--accent-ink:#10141a;--accent-strong:#058635} /* 6.75 / 4.69 */
body.royal-light   {--accent-vivid:#941eff;--accent-ink:#ffffff;--accent-strong:#941ffe} /* 5.40 / 5.40 */
body.rose-light    {--accent-vivid:#f21577;--accent-ink:#10141a;--accent-strong:#e3106e} /* 4.52 / 4.60 */
body.crimson-light {--accent-vivid:#cd0808;--accent-ink:#ffffff;--accent-strong:#ca0b0b} /* 5.79 / 5.88 */
body.orange-light  {--accent-vivid:#f65400;--accent-ink:#10141a;--accent-strong:#cd4600} /* 5.45 / 4.68 */
body.sunrise-light {--accent-vivid:#d4a400;--accent-ink:#10141a;--accent-strong:#927100} /* 8.01 / 4.60 */
body.copper-light  {--accent-vivid:#aa5225;--accent-ink:#ffffff;--accent-strong:#a95226} /* 5.33 / 5.35 */
body.ocean-light   {--accent-vivid:#0096ba;--accent-ink:#10141a;--accent-strong:#007d9b} /* 5.33 / 4.75 */
body.arctic        {--accent-vivid:#31c0ff;--accent-ink:#10141a;--accent-strong:#007eb6} /* 8.87 / 4.52 */

/* ---- 4. anything that puts text on an accent fill ----------------------- */
/* Fills take the vivid accent and its matching ink. Accent-coloured TEXT takes
   --accent-strong, because there the background is the white card, not the
   accent -- the two cases have opposite requirements and need separate tokens. */
body.theme-light .btn:not(.secondary):not(.danger),
body.arctic .btn:not(.secondary):not(.danger){
  background:linear-gradient(135deg,var(--accent-vivid),color-mix(in srgb,var(--accent-vivid) 86%,#000))!important;
  color:var(--accent-ink)!important;
}
body.theme-light .tabs .tab.active,
body.arctic .tabs .tab.active{
  background-image:none!important;
  background-color:var(--accent-vivid)!important;
  border-color:var(--accent-vivid)!important;
  color:var(--accent-ink)!important;
}
body.theme-light .serviceDockCount,
body.arctic .serviceDockCount{background:var(--accent-vivid);color:var(--accent-ink)}
/* Accent text on a card: eyebrows, section headings, section links. */
body.theme-light .helpEyebrow, body.arctic .helpEyebrow,
body.theme-light .helpGroup h3, body.arctic .helpGroup h3,
body.theme-light .expandedInventoryValueLabel, body.arctic .expandedInventoryValueLabel{
  color:var(--accent-strong)!important;
}

/* ---- 5. surfaces --------------------------------------------------------- */
/* Cards get a real edge now, so they no longer depend on the shadow alone. */
body.theme-light .card, body.arctic .card,
body.theme-light .listItem, body.arctic .listItem,
body.theme-light .metric, body.arctic .metric,
body.theme-light .summary, body.arctic .summary{
  border:1px solid var(--line)!important;
  box-shadow:var(--shadow)!important;
}
/* Inputs sit *below* the card on light, not above it: on a white panel a white
   input is invisible, so it takes the ground colour and the card keeps the white. */
body.theme-light input, body.theme-light select, body.theme-light textarea,
body.arctic input, body.arctic select, body.arctic textarea{
  background-color:color-mix(in srgb,var(--bg) 55%,#fff)!important;
  border-color:var(--edge-strong)!important;
  color:var(--text)!important;
}
body.theme-light input:focus, body.theme-light select:focus, body.theme-light textarea:focus,
body.arctic input:focus, body.arctic select:focus, body.arctic textarea:focus{
  background-color:#fff!important;
  border-color:var(--accent-strong)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-strong) 22%,transparent)!important;
}
/* Text at 16-17:1 on white is harsher than it needs to be; easing it slightly
   reads as intentional rather than as a default. Still well past AA. */
body.theme-light{--text:#1f2733!important}
body.arctic{--text:#1c2938!important}