/* S1094 (owner 2026-10-13, "apply this to IMS"): the IMS console (/tracker) joins the Quintarthai glass redesign. The console
   is styled almost entirely through its own tokens (globals.css "legacy token names are kept and re-mapped"), so this layer
   re-maps the same tokens to violet glass, puts the faceted-crystal backdrop behind the shell, and turns the top strip,
   header and footer into glass. Signal amber, verdant and crimson are severity/state colours and stay as they are.
   Dark is the console default; its light theme gets the light glass. Rollback: remove the <link>. */
:root:not([data-theme="light"]) {
  --bg-primary: #0a0a12; --bg-secondary: rgba(14, 13, 26, 0.86);
  --bg-card: rgba(22, 20, 38, 0.62); --bg-card-hover: rgba(34, 31, 58, 0.80); --bg-glass: rgba(24, 22, 42, 0.55);
  --border-subtle: rgba(255, 255, 255, 0.09); --border-glow: rgba(167, 139, 250, 0.50);
  --accent-meridian: #6D28D9; --accent-meridian-bright: #A78BFA; --accent-meridian-soft: rgba(139, 92, 246, 0.18);
  --shadow-glow: 0 0 24px rgba(139, 92, 246, 0.25);
  --shadow-card: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 1px 2px rgba(0, 0, 0, 0.35), 0 14px 32px -18px rgba(0, 0, 0, 0.8);
  --qt-glass-bg: rgba(24, 24, 36, 0.55); --qt-glass-border: rgba(255, 255, 255, 0.10); --qt-glass-blur: 16px; --qt-glass-accent: #8B5CF6;
}
html[data-theme="light"] {
  --bg-primary: #ececf4; --bg-secondary: rgba(250, 250, 255, 0.84);
  --bg-card: rgba(255, 255, 255, 0.64); --bg-card-hover: rgba(255, 255, 255, 0.84); --bg-glass: rgba(255, 255, 255, 0.55);
  --border-subtle: rgba(46, 38, 110, 0.13); --border-glow: rgba(124, 58, 237, 0.40);
  --accent-meridian: #5B21B6; --accent-meridian-bright: #7C3AED; --accent-meridian-soft: rgba(124, 58, 237, 0.10);
  --shadow-glow: 0 0 16px rgba(124, 58, 237, 0.14);
  --shadow-card: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(46, 38, 110, 0.08), 0 12px 28px -16px rgba(46, 38, 110, 0.30);
  --qt-glass-bg: rgba(255, 255, 255, 0.60); --qt-glass-border: rgba(255, 255, 255, 0.90); --qt-glass-blur: 16px; --qt-glass-accent: #7C3AED;
}

/* the backdrop; the shell's own solid fill steps aside so the crystal shows between panels */
html body {
  background:
    radial-gradient(900px 600px at 12% -10%, rgba(139, 92, 246, 0.30), transparent 65%),
    radial-gradient(800px 560px at 100% 10%, rgba(99, 102, 241, 0.16), transparent 60%),
    radial-gradient(1000px 700px at 50% 120%, rgba(76, 29, 149, 0.28), transparent 60%),
    url("/assets/qt-crystal-dark.svg?v=s1094-1") center / cover no-repeat fixed, #07070b !important;
}
html[data-theme="light"] body {
  background:
    radial-gradient(900px 600px at 12% -10%, rgba(139, 92, 246, 0.20), transparent 65%),
    radial-gradient(800px 560px at 100% 10%, rgba(99, 102, 241, 0.12), transparent 60%),
    radial-gradient(1000px 700px at 50% 120%, rgba(167, 139, 250, 0.22), transparent 60%),
    url("/assets/qt-crystal-light.svg?v=s1094-1") center / cover no-repeat fixed, #e6e7ef !important;
}
div[style*="height: 100vh"][style*="background: var(--bg-primary)"] { background: transparent !important; }

/* top strip + header + footer: glass bands (blur is cheap here - each is under 90px tall) */
div[style*="height: 100vh"] > :is(div, header, footer)[style*="background: var(--bg-secondary)"] {
  -webkit-backdrop-filter: blur(var(--qt-glass-blur)) saturate(150%); backdrop-filter: blur(var(--qt-glass-blur)) saturate(150%);
}
div[style*="height: 100vh"] > header[style*="background: var(--bg-secondary)"] { box-shadow: 0 18px 36px -26px rgba(0, 0, 0, 0.7); position: relative; z-index: 5; }

/* event cards: frosted, violet edge on hover; the "new event" pulse is violet (it marks new, not severity) */
.glass-card { border-radius: 16px; -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); }
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 10px rgba(139, 92, 246, 0.26), 0 0 22px rgba(139, 92, 246, 0.10); border-color: rgba(167, 139, 250, 0.40); }
  50% { box-shadow: 0 0 18px rgba(139, 92, 246, 0.42), 0 0 36px rgba(139, 92, 246, 0.20); border-color: rgba(167, 139, 250, 0.66); }
}
::-webkit-scrollbar-thumb { background: rgba(139, 92, 246, 0.30); }
::-webkit-scrollbar-thumb:hover { background: rgba(139, 92, 246, 0.55); }

@media (prefers-reduced-transparency: reduce) {
  .glass-card, div[style*="height: 100vh"] > :is(div, header, footer) { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  :root:not([data-theme="light"]) { --bg-card: #17162a; --bg-secondary: #100f1e; }
  html[data-theme="light"] { --bg-card: #fbfbfe; --bg-secondary: #f4f4fa; }
}