/* ============================================================
   CShield · Dark mode token overrides
   Light is the default; dark ships in v1 across all surfaces.
   Applied via [data-theme="dark"] or .dark on a root element.
   Brand hexes are generally maintained; surfaces + text invert.
   ============================================================ */
[data-theme="dark"], .dark {
  --page-bg: var(--slate-900);          /* #0F172A */
  --surface-card: var(--slate-800);     /* #1E293B */
  --surface-elevated: #334155;
  --surface-subtle: #334155;
  --border-default: #334155;
  --border-emphasis: #475569;
  --divider: #475569;
  --text-primary: var(--slate-100);     /* #F1F5F9 */
  --text-secondary: var(--slate-400);   /* #94A3B8 */
  --text-tertiary: var(--slate-500);    /* #64748B */
  --text-heading: var(--slate-100);
  --icon-tertiary: var(--slate-500);
  --backdrop: rgba(0, 0, 0, 0.6);

  /* Brand primary maintained — sufficient contrast on dark surfaces */
  --brand-primary-wash: #1E3A6B;

  /* Semantics lightened for visibility on dark surfaces */
  --safe: #10B981;
  --warning: #F59E0B;
  --critical: #EF4444;                  /* brightened red-500 for badge visibility */

  /* Active Interruption red is UNCHANGED in dark mode — part of the moment,
     not a themed surface. --active-interruption stays #DC2626. */

  /* Dark shadows: increased opacity (~30%) to compensate for reduced perception */
  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.32);
  --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.40);
  --shadow-3: 0 16px 32px rgba(0, 0, 0, 0.50);
}
