/* ──────────────────────────────────────────────────────────────────────────
   Performance Dashboard Base Design-Tokens (L0) — Cascade dark/light, Hue = Indigo/Violett.
   Struktur 1:1 wie content-tokens.css/crm-tokens.css; nur die Marken-Hue sind Indigo (Vince-Entscheidung 2026-06-23). Theme-Modell: NUR dark/light.
   dashboard-signatures.css (Ambient) folgt in Phase 1 (Shell).
   ────────────────────────────────────────────────────────────────────────── */
:root {
  /* Surfaces (dark, kühl-teal getönt) */
  --bg-base: #0a0b14;
  --bg-elev-1: #12131f;
  --bg-elev-2: #1a1b2b;
  --bg-elev-3: #232538;

  /* Cascade-Akzent — Teal→Cyan */
  --c-cool: #818cf8;
  --c-warm: #6366f1;
  --c-magenta: #4f46e5;
  --c-pink: #7c3aed;
  --accent: #6366f1;
  --accent-hover: #818cf8;
  --accent-soft-bg: rgba(99, 102, 241, 0.1);
  --accent-line: rgba(99, 102, 241, 0.2);
  --accent-grad: linear-gradient(135deg, #818cf8 0%, #6366f1 32%, #4f46e5 64%, #7c3aed 100%);

  /* Text (kühl-weiß) */
  --t-bright: #e8e9f6;
  --t-secondary: #b0b3cf;
  --t-muted: #787c9c;
  --t-disabled: #484c6a;
  --t-on-color: #ffffff; /* Text auf gesättigter Status-/Akzent-Fläche (Chips/Badges), theme-unabhängig */
  --accent-ink: #08110f; /* Ink auf gefuellter Akzent-Flaeche (Auth-Button) — helle Hues brauchen dunkle Ink, RULES §6b */

  /* Borders (teal-getönt) */
  --border-subtle: rgba(99, 102, 241, 0.08);
  --border-strong: rgba(99, 102, 241, 0.16);
  --border-focus: rgba(99, 102, 241, 0.55);

  /* Status-Pills (Sidebar nav-meta) */
  --s-live: #34d399;
  --s-live-bg: rgba(52, 211, 153, 0.12);
  --s-beta: #fbbf24;
  --s-beta-bg: rgba(251, 191, 36, 0.12);
  --s-neu: #22d3ee;
  --s-neu-bg: rgba(34, 211, 238, 0.14);
  --s-admin: #f87171;
  --s-admin-bg: rgba(248, 113, 113, 0.12);
  --s-dev: #94a3b8;
  --s-dev-bg: rgba(148, 163, 184, 0.14);

  /* Radii + Layout (geteilte Geometrie — byte-identisch zu den anderen Apps) */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-pill: 999px;
  --sb-w: 248px;
  --sb-w-collapsed: 72px;
  --topbar-h: 56px;

  /* Fonts */
  --font-sans: 'Geist', -apple-system, system-ui, sans-serif;

  /* Funktionsfarben — dark */
  --vh-red: #ff5757;
  --success: #34d399;
  --warn: #f59e0b;
  --danger: #f87171;
  --gold: #fbbf24;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2), 0 2px 8px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3), 0 8px 28px rgba(0, 0, 0, 0.4);

  /* ── Alias der Live-dashboard.html-Variablennamen → Cascade-Tokens (erbt Teal-Farben).
     Auch der geteilte @vh/core-Toast referenziert --bg-card/--text-primary. ── */
  --bg-card: var(--bg-elev-1);
  --bg-card-hover: var(--bg-elev-2);
  --bg-input: var(--bg-elev-1);
  --border: var(--border-subtle);
  --border-hover: var(--border-strong);
  --text-primary: var(--t-bright);
  --text-secondary: var(--t-secondary);
  --text-muted: var(--t-muted);
  --accent-rgb: 99, 102, 241;
}

html[data-theme='light'] {
  --bg-base: #eef0fa;
  --bg-elev-1: #ffffff;
  --bg-elev-2: #f6f7fd;
  --bg-elev-3: #ecedf9;

  --t-bright: #141527;
  --t-secondary: #464a63;
  --t-muted: #5f6488;
  --t-disabled: #b7bad0;

  --border-subtle: rgba(67, 56, 202, 0.08);
  --border-strong: rgba(67, 56, 202, 0.18);
  --border-focus: rgba(79, 70, 229, 0.55);

  --accent: #4f46e5;
  --accent-hover: #4338ca;
  --accent-soft-bg: rgba(79, 70, 229, 0.08);
  --accent-line: rgba(79, 70, 229, 0.24);
  --accent-rgb: 79, 70, 229;

  --s-live: #047857; --s-live-bg: rgba(4, 120, 87, 0.12);
  --s-beta: #a16207; --s-beta-bg: rgba(161, 98, 7, 0.12);
  --s-neu: #0e7490; --s-neu-bg: rgba(14, 116, 144, 0.12);
  --s-admin: #b91c1c; --s-admin-bg: rgba(185, 28, 28, 0.12);
  --s-dev: #475569; --s-dev-bg: rgba(71, 85, 105, 0.12);

  /* Funktionsfarben — light */
  --success: #16a34a;
  --warn: #d97706;
  --danger: #dc2626;
  --gold: #ca8a04;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.06), 0 6px 16px rgba(0, 0, 0, 0.08);
}