/* ===========================================================================
   WynxxMind — Wynxx DARK theme
   ---------------------------------------------------------------------------
   Companion to style.css (the Wynxx LIGHT theme). Load this AFTER style.css.
   Derived from the LIVE site CSS (new_style/extracted.css) `.dark` block:
   near-black canvas (#0a0a0a), neutral-800 panels, indigo primary (#1e3ac9,
   lightened to ~#6172e8 where the token is used as link/active TEXT so it stays
   legible on dark). It re-declares ONLY the :root tokens — every component in
   style.css is driven through var(--token), so this re-themes the whole UI.

   Activation (any of):
     • <html data-theme="dark">      — explicit opt-in
     • <body class="theme-dark">     — scoped opt-in
     • OS prefers-color-scheme: dark — automatic, UNLESS the user forced light.
   =========================================================================== */

/* Dark COLOUR tokens live in tokens.css (plan #P17). This file keeps only dark-specific RULES. */

/* The portal footer uses var(--panel) + var(--border) (see style.css), so it auto-themes to the
   dark side-panel surface with no override needed. The GFT logo is now a PNG (fixed dark colours),
   which a token can't recolour — so invert it to WHITE on the dark panel. Covers explicit opt-in
   (data-theme="dark" / .theme-dark) AND OS-dark (unless the user forced light). */
:root[data-theme="dark"] .portal-footer-logo img,
.theme-dark .portal-footer-logo img { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .portal-footer-logo img { filter: brightness(0) invert(1); }
}

/* Release-stage pills — brighter TEXT hues on the dark canvas (the rgba tint bg/border in style.css
   carry over unchanged). Covers explicit dark opt-in AND OS-dark unless the user forced light. */
:root[data-theme="dark"] .stage-pill.stage-poc,   .theme-dark .stage-pill.stage-poc   { color: #f87171; }
:root[data-theme="dark"] .stage-pill.stage-alpha, .theme-dark .stage-pill.stage-alpha { color: #fcd34d; }
:root[data-theme="dark"] .stage-pill.stage-beta,  .theme-dark .stage-pill.stage-beta  { color: #4ade80; }
:root[data-theme="dark"] .stage-pill.stage-rc,    .theme-dark .stage-pill.stage-rc    { color: #93c5fd; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .stage-pill.stage-poc   { color: #f87171; }
  :root:not([data-theme="light"]) .stage-pill.stage-alpha { color: #fcd34d; }
  :root:not([data-theme="light"]) .stage-pill.stage-beta  { color: #4ade80; }
  :root:not([data-theme="light"]) .stage-pill.stage-rc    { color: #93c5fd; }
}