/* Light islands: surfaces that stay light in BOTH themes.
 *
 * THE BUG THIS FIXES. A surface pinned light (a white modal sheet, a printed
 * page, a rendered email) keeps its background in dark mode, but its
 * DESCENDANTS keep reading the theme tokens. In dark mode --ink resolves to
 * near-white, so labels vanish on the white sheet, inputs render as black
 * boxes, and native date/select/checkbox chrome draws dark. Readable in light
 * mode, broken three ways in dark. Ported from the ASA sibling (PR #157).
 *
 * THE FIX, applied to the class rather than to each control: re-declare every
 * token the dark theme flips back to its LIGHT value, and set color-scheme so
 * native widget chrome flips too. Descendants keep using var(--ink) and
 * self-heal, with no per-control hunting.
 *
 * WHY THE INDIRECTION. BMS has four shells with FOUR palettes, and 16 of these
 * tokens have different light values per shell (Masters is green-tinted, not
 * brown). Hard-coding one set here would repaint Masters in Admin's colours.
 * So each shell publishes its own light values as --lt-* (declared in :root
 * only, never in the dark block), and this rule points at those. The literal
 * fallbacks are the Admin/Team values, used only if a shell forgets to
 * publish, which keeps a missing token light rather than silently inheriting
 * the dark one.
 *
 * USAGE: add class="light-island" to a surface that must be light for a
 * PHYSICAL reason: a QR quiet zone a scanner has to read, a third-party embed
 * that only ships a light theme, a print view. It paints itself, so the class
 * is all you need.
 *
 * DO NOT use it to keep a modal or a card light out of habit. The owner's
 * direction (ASA PR #158, walked back from #157) is that sheets FOLLOW the
 * theme and islands exist only where physically necessary.
 */
.light-island {
  color-scheme: light;
  background: var(--lt-card, #FFFFFF);
  color: var(--lt-ink, #23201A);
  --bg: var(--lt-bg, #F6F5F2);
  --bg2: var(--lt-bg2, #FBFAF8);
  --card: var(--lt-card, #FFFFFF);
  --ink: var(--lt-ink, #23201A);
  --muted: var(--lt-muted, #6F6A61);
  --faint: var(--lt-faint, #6D6962);
  --ember: var(--lt-ember, #BC5A22);
  --ember-hi: var(--lt-ember-hi, #A44D1B);
  --line: var(--lt-line, #E5E2DB);
  --line-2: var(--lt-line-2, #D9D5CD);
  --ok: var(--lt-ok, #2E7D52);
  --warn: var(--lt-warn, #9A6A0B);
  --danger: var(--lt-danger, #B23B27);
  --shadow: var(--lt-shadow, 0 1px 2px rgba(35,32,26,.05), 0 10px 26px -16px rgba(35,32,26,.16));
  --glass: var(--lt-glass, rgba(250,250,248,.88));
  --glass-2: var(--lt-glass-2, rgba(250,250,248,.94));
  --wash: var(--lt-wash, rgba(35,32,26,.05));
  --wash-soft: var(--lt-wash-soft, rgba(35,32,26,.03));
  --glow: var(--lt-glow, rgba(188,90,34,.06));
  --backdrop: var(--lt-backdrop, rgba(35,32,26,.14));
  --tick: var(--lt-tick, rgba(188,90,34,.22));
  --row-hover: var(--lt-row-hover, rgba(188,90,34,.045));
  --surface: var(--lt-surface, #FFFFFF);
  --surface-2: var(--lt-surface-2, #EEECE7);
  --raise: var(--lt-raise, #FBFAF8);
  --ember-deep: var(--lt-ember-deep, #A44D1B);
  --ember-bright: var(--lt-ember-bright, #D97A2E);
  --ember-wash: var(--lt-ember-wash, #F7E6DA);
  --ember-tint: var(--lt-ember-tint, #FAF2EB);
  --shadow-sm: var(--lt-shadow-sm, 0 1px 2px rgba(35,32,26,.05), 0 4px 12px -6px rgba(35,32,26,.12));
  --shadow-md: var(--lt-shadow-md, 0 2px 4px rgba(35,32,26,.05), 0 14px 30px -14px rgba(35,32,26,.2));
  --frost: var(--lt-frost, rgba(246,245,242,.86));
  --frost-2: var(--lt-frost-2, rgba(255,255,255,.92));
  --g-bg: var(--lt-g-bg, #F6F5F2);
  --g-card: var(--lt-g-card, #FFFFFF);
  --g-card-soft: var(--lt-g-card-soft, #FBFAF8);
  --g-ink: var(--lt-g-ink, #23201A);
  --g-body: var(--lt-g-body, #46423B);
  --g-muted: var(--lt-g-muted, #6F6A61);
  --g-faint: var(--lt-g-faint, #9A948A);
  --g-line: var(--lt-g-line, #E5E2DB);
  --g-line-strong: var(--lt-g-line-strong, #D9D5CD);
  --g-ember: var(--lt-g-ember, #BC5A22);
  --g-ember-hi: var(--lt-g-ember-hi, #A44D1B);
  --g-ember-soft: var(--lt-g-ember-soft, rgba(188, 90, 34, 0.08));
  --g-ok: var(--lt-g-ok, #2E7D52);
  --g-ok-soft: var(--lt-g-ok-soft, #E7F3EC);
  --g-err: var(--lt-g-err, #B23B27);
  --g-err-soft: var(--lt-g-err-soft, #F9ECE8);
  --g-focus: var(--lt-g-focus, rgba(188, 90, 34, 0.25));
  --g-glass: var(--lt-g-glass, rgba(250, 250, 248, 0.9));
  --g-shadow: var(--lt-g-shadow, 0 1px 2px rgba(35, 32, 26, 0.05), 0 10px 28px -14px rgba(35, 32, 26, 0.14));
  --teal: var(--lt-teal, #0C8F76);
  --teal-deep: var(--lt-teal-deep, #0A7A64);
  --teal-bright: var(--lt-teal-bright, #13B39A);
  --teal-wash: var(--lt-teal-wash, #E1F3EE);
  --teal-tint: var(--lt-teal-tint, #F0F9F6);
  --coral: var(--lt-coral, #F2603A);
  --coral-deep: var(--lt-coral-deep, #DC4E2B);
  --coral-wash: var(--lt-coral-wash, #FDEAE3);
  --shadow-pop: var(--lt-shadow-pop, 0 -8px 20px -6px rgba(20,45,38,.14));
  --glow-a: var(--lt-glow-a, rgba(19,179,154,.10));
  --glow-b: var(--lt-glow-b, rgba(242,96,58,.06));
  --scrim: var(--lt-scrim, rgba(23,35,31,.28));
  --oils-tab-on: var(--lt-oils-tab-on, #9A6206);
  --toast-bg: var(--lt-toast-bg, #17231F);
  --toast-ink: var(--lt-toast-ink, #FFFFFF);
  --toast-act: var(--lt-toast-act, rgba(255,255,255,.18));
  --toast-act-hover: var(--lt-toast-act-hover, rgba(255,255,255,.3));
  --cat-other: var(--lt-cat-other, #8A9A93);
  --wash-citrus: var(--lt-wash-citrus, #FBEECB);
  --wash-floral: var(--lt-wash-floral, #FBE1EF);
  --wash-herbs: var(--lt-wash-herbs, #EDF1D8);
  --wash-woody: var(--lt-wash-woody, #F1E5D8);
  --wash-fresh: var(--lt-wash-fresh, var(--teal-wash));
  --wash-exotic: var(--lt-wash-exotic, #EBE5FA);
  --wash-scrubs: var(--lt-wash-scrubs, #DCEDFB);
  --wash-other: var(--lt-wash-other, #E9EEEC);
}