/* portal-bridge.css — U2: harmonize the classic Flask store with the SPA "lux" theme.
   ADDITIVE OVERLAY ONLY. Loaded after v60-neon.css and scoped to body.unified-theme,
   which base.html adds ONLY when the admin toggle `portal_unified_theme` is ON.
   Rollback: turn the toggle off, or remove the <link> in base.html, or delete this file.
   v60-neon.css itself is NEVER modified — it stays the guaranteed fallback. */

/* v60-neon.css drives the whole classic store through CSS variables, so simply
   re-pointing those variables to the SPA's exact token values re-themes every
   page (backgrounds, cards, buttons, accents) with zero structural changes. */
body.unified-theme {
  --neon-radius: 1.1rem;            /* SPA --radius */

  --bg-0: oklch(4% 0 0);            /* SPA --noir */
  --bg-1: oklch(8% .01 175);        /* SPA --background (dark teal canvas) */
  --bg-2: oklch(11% .008 180);      /* SPA --noir-soft */
  --card-bg: oklch(14% .018 178);   /* SPA --paper */
  --card-bg-2: oklch(11% .008 180); /* SPA --noir-soft */

  --fg: oklch(96% .012 95);         /* SPA --ink */
  --fg-muted: oklch(72% .018 150);  /* SPA --muted-foreground */
  --border-soft: oklch(96% .012 95 / .08);

  --neon: oklch(82% .11 88);        /* SPA --coral (champagne gold) */
  --neon-2: oklch(72% .09 168);     /* SPA --olive (jade aurora) */
  --gold: oklch(82% .11 88);
  --primary-fg: oklch(4% 0 0);      /* SPA --primary-foreground */

  --gradient-hero:
      radial-gradient(ellipse at top, oklch(82% .11 88 / .14), transparent 60%),
      radial-gradient(ellipse at bottom right, oklch(72% .09 168 / .12), transparent 60%),
      linear-gradient(180deg, oklch(8% .01 175), oklch(5% .006 180));
  --gradient-card:
      linear-gradient(160deg, oklch(14% .018 178 / .92), oklch(11% .008 180 / .82));

  --shadow-neon: 0 0 28px oklch(82% .11 88 / .30), 0 0 48px oklch(72% .09 168 / .16);
  --shadow-glow: 0 10px 28px -8px oklch(82% .11 88 / .42);
}

/* Phase 3 — avoid the white flash when leaving the SPA: paint the dark canvas
   on the document background immediately, with a short fade. Scoped so it only
   affects pages that opted into the unified theme. */
body.unified-theme {
  background-color: oklch(8% .01 175);
  transition: background-color .25s ease;
}