/* ════════════════════════════════════════════════════════════════════════════
   light-surfaces.css — light mode: every card, box, panel and tile is WHITE (2026-10-26, the user's "light mode
   colour consistency" brief). Loaded LAST in both apps, light mode ONLY (:root[data-scheme="light"]): dark mode is
   untouched (tests/browser/light-surfaces.html compares every dark card with the v4.236 baseline).

   The shared sources are fixed where they live: theme.css (--surface-card and the e1 / e2 / glass tokens), tones.css
   (a card's hue no longer fills it), team-dashboard.css (the KPI tiles). What is here are the components that
   hard-code their own light colours: inner boxes, segmented-control tracks, a gradient, a hero. They take the white
   surface with a hairline (inset, so no layout moves). Status boxes keep their colour in the BORDER and the text, not
   as a pink or amber fill.
   ════════════════════════════════════════════════════════════════════════════ */
:root:root[data-scheme="light"] {
  --sc: var(--surface-card, #FFFFFF);
  --sl: var(--surface-border, rgba(16, 24, 40, .10));
}

/* ── inner boxes and segmented-control tracks: white, a hairline ───────────── */
:root:root[data-scheme="light"] :is(
  .ps-periods, .fu-views, .fu-tabs, .seg, .lo-seg, .pp-seg, .pp-cmp > div, .pp-sum, .pp-plist li, .pp-rowbtn,
  .sb-sum > div, .ord-search, .ord-card, .qw-search, .qw-field, .pc-seg, .pc-qty, .ac-f, .mt-seg, .mt-card, .mt-list li,
  .px-ro, .act, .la-console, .calc, .cal-seg, .tr-seg, .sf-seg, .tm-seg, .sf-stats, .tm-kpis, .tm-detail,
  .mc-seg, .mc-summary, .dv-seg, .dv-kpis, .cf-stats, .cf-seg, .cc-stats > div, .tp-stats, .al-seg, .ps-earn
) {
  background: var(--sc) !important;
  box-shadow: inset 0 0 0 1px var(--sl);
}

/* ── whole cards and panels that draw their own light background ──────────── */
:root:root[data-scheme="light"] :is(.dh-card, .la, .mp-glass, .mh-hero, .bell__panel, .wp__sheet, .scp-box-in, .nv-dlg__box) {
  background: var(--sc) !important;
}
:root:root[data-scheme="light"] .mp-glass { -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 1px 2px rgba(16, 24, 40, .06), inset 0 0 0 1px var(--sl); }

/* ── status and information boxes: white, the colour in the border (the text keeps its own) ── */
:root:root[data-scheme="light"] :is(.fu-banner, .ro-banner, .mh-ro, .side__ws) {
  background: var(--sc) !important;
  box-shadow: inset 0 0 0 1px rgba(214, 120, 10, .45);
}
:root:root[data-scheme="light"] .ord-next-box { background: var(--sc) !important; }
:root:root[data-scheme="light"] .ord-next-box--hot  { box-shadow: inset 0 0 0 1px rgba(197, 48, 58, .45), inset 3px 0 0 #C5303A; }
:root:root[data-scheme="light"] .ord-next-box--warm { box-shadow: inset 0 0 0 1px rgba(214, 120, 10, .45), inset 3px 0 0 #D6780A; }
:root:root[data-scheme="light"] .ord-next-box--calm { box-shadow: inset 0 0 0 1px var(--sl); }