/* ============================================================================
   Secolve OT Cyber Suite — Design Tokens (v4)
   Single source of truth for colour, type, space, radius, shadow, motion.
   RGB triplets feed Tailwind's `rgb(var(--x) / <alpha-value>)` so opacity
   modifiers (bg-brand-primary/10) work. Named vars are for raw CSS.
   The dark-purple Secolve identity is carried from the approved reports.
   ============================================================================ */
:root {
  /* ── Brand purple ramp ─────────────────────────────────────────────── */
  --c-brand-50-rgb:  243 240 255;
  --c-brand-100-rgb: 233 226 255;
  --c-brand-200-rgb: 214 198 255;
  --c-brand-300-rgb: 183 156 255;
  --c-brand-400-rgb: 167 139 250;
  --c-brand-500-rgb: 124 58 237;
  --c-brand-600-rgb: 109 40 217;
  --c-brand-700-rgb: 91 26 149;
  --c-brand-800-rgb: 70 16 120;
  --c-brand-900-rgb: 57 0 107;
  --c-brand-950-rgb: 38 0 71;
  --c-brand-primary-rgb: 124 58 237;   /* #7C3AED — purple already in reports */
  --c-brand-deep-rgb:    57 0 107;      /* #39006B — deep purple in chrome */
  --c-brand-violet-rgb:  167 139 250;   /* #A78BFA */

  --c-brand-50:  rgb(var(--c-brand-50-rgb));
  --c-brand-100: rgb(var(--c-brand-100-rgb));
  --c-brand-200: rgb(var(--c-brand-200-rgb));
  --c-brand-300: rgb(var(--c-brand-300-rgb));
  --c-brand-400: rgb(var(--c-brand-400-rgb));
  --c-brand-500: rgb(var(--c-brand-500-rgb));
  --c-brand-600: rgb(var(--c-brand-600-rgb));
  --c-brand-700: rgb(var(--c-brand-700-rgb));
  --c-brand-800: rgb(var(--c-brand-800-rgb));
  --c-brand-900: rgb(var(--c-brand-900-rgb));
  --c-brand-950: rgb(var(--c-brand-950-rgb));
  --c-brand-primary: rgb(var(--c-brand-primary-rgb));
  --c-brand-deep:    rgb(var(--c-brand-deep-rgb));
  --c-brand-violet:  rgb(var(--c-brand-violet-rgb));

  /* ── Surfaces (dark) ───────────────────────────────────────────────── */
  --c-bg-app-rgb:      10 6 19;     /* #0A0613 page bg */
  --c-bg-elevated-rgb: 18 10 34;    /* #120A22 */
  --c-bg-sunken-rgb:   7 7 16;      /* #070710 */
  --c-surface-1-rgb:   18 10 34;    /* #120A22 cards / sidebar */
  --c-surface-2-rgb:   26 14 48;    /* #1A0E30 card hover, row alt */
  --c-surface-3-rgb:   36 20 65;    /* #241441 active tab / selected */
  --c-surface-4-rgb:   46 26 82;    /* #2E1A52 raised */
  --c-bg-app:      rgb(var(--c-bg-app-rgb));
  --c-bg-elevated: rgb(var(--c-bg-elevated-rgb));
  --c-bg-sunken:   rgb(var(--c-bg-sunken-rgb));
  --c-surface-1:   rgb(var(--c-surface-1-rgb));
  --c-surface-2:   rgb(var(--c-surface-2-rgb));
  --c-surface-3:   rgb(var(--c-surface-3-rgb));
  --c-surface-4:   rgb(var(--c-surface-4-rgb));

  /* ── Text ──────────────────────────────────────────────────────────── */
  --c-text-primary-rgb:   244 240 255;  /* #F4F0FF */
  --c-text-secondary-rgb: 200 187 232;  /* #C8BBE8 */
  --c-text-muted-rgb:     162 148 200;  /* #A294C8 — AA ≥6:1 on app/card surfaces */
  --c-text-disabled-rgb:  144 133 174;  /* #9085AE — AA ≥4.9:1 (was #5C4E78, failed) */
  --c-text-inverse-rgb:   10 6 19;      /* #0A0613 */
  --c-success-fg: rgb(134 239 172);
  --c-warning-fg: rgb(253 224 71);
  --c-info-fg: rgb(147 197 253);
  --c-chip-fg: var(--c-brand-violet);
  /* legacy secolve-* palette as vars (theme-switchable) — dark defaults */
  --legacy-tx1: 244 240 255; --legacy-tx2: 200 187 232; --legacy-tx3: 162 148 200; --legacy-tx4: 144 133 174;
  --legacy-bg: 10 6 19; --legacy-surf1: 18 10 34; --legacy-surf2: 26 14 48; --legacy-surf3: 36 20 65;
  --legacy-accent: 167 139 250;
  --legacy-rule: rgba(255,255,255,.06); --legacy-rule-hv: rgba(255,255,255,.12);
  --c-text-primary:   rgb(var(--c-text-primary-rgb));
  --c-text-secondary: rgb(var(--c-text-secondary-rgb));
  --c-text-muted:     rgb(var(--c-text-muted-rgb));
  --c-text-disabled:  rgb(var(--c-text-disabled-rgb));
  --c-text-inverse:   rgb(var(--c-text-inverse-rgb));

  /* ── Borders ───────────────────────────────────────────────────────── */
  --c-border-subtle:  rgba(255,255,255,.07);
  --c-border-default: rgba(255,255,255,.12);
  --c-border-strong:  rgba(167,139,250,.32);

  /* ── Risk palette (carried from reports — DO NOT change) ───────────── */
  --c-risk-critical-rgb: 248 113 113;  /* #F87171 */
  --c-risk-high-rgb:     251 146 60;   /* #FB923C */
  --c-risk-moderate-rgb: 251 191 36;   /* #FBBF24 */
  --c-risk-low-rgb:      74 222 128;   /* #4ADE80 */
  --c-risk-critical: rgb(var(--c-risk-critical-rgb));
  --c-risk-high:     rgb(var(--c-risk-high-rgb));
  --c-risk-moderate: rgb(var(--c-risk-moderate-rgb));
  --c-risk-low:      rgb(var(--c-risk-low-rgb));
  --c-risk-critical-bg: rgb(var(--c-risk-critical-rgb) / .15);
  --c-risk-high-bg:     rgb(var(--c-risk-high-rgb) / .15);
  --c-risk-moderate-bg: rgb(var(--c-risk-moderate-rgb) / .15);
  --c-risk-low-bg:      rgb(var(--c-risk-low-rgb) / .15);
  --c-risk-critical-fg: rgb(252 165 165);
  --c-risk-high-fg:     rgb(253 186 116);
  --c-risk-moderate-fg: rgb(253 224 71);
  --c-risk-low-fg:      rgb(134 239 172);
  /* Dark ink for text sitting on a SOLID risk fill (heatmap cells). The risk
     fills are theme-constant pastels, so this ink is fixed across both themes;
     it clears AA (>=6.8:1) on all four palette colours. */
  --c-on-risk-fill: #1f2937;

  /* ── OT-tracker STATE palette (D-101 — discovery/presence states) ─────
     Distinct from the risk palette by design (hues at the -500 level vs risk's
     -400, plus a muted slate for "none") so the matrix never reads as a risk
     judgement. exists=green / low_level=amber / not_found=red / none=muted. */
  --c-state-exists-rgb:   34 197 94;    /* #22C55E emerald — present */
  --c-state-low-rgb:      245 158 11;   /* #F59E0B amber  — low-level/partial */
  --c-state-notfound-rgb: 239 68 68;    /* #EF4444 red    — not found / removed */
  --c-state-none-rgb:     100 116 139;  /* #64748B slate  — doesn't exist (muted) */
  --c-state-exists:   rgb(var(--c-state-exists-rgb));
  --c-state-low:      rgb(var(--c-state-low-rgb));
  --c-state-notfound: rgb(var(--c-state-notfound-rgb));
  --c-state-none:     rgb(var(--c-state-none-rgb));
  --c-state-exists-bg:   rgb(var(--c-state-exists-rgb) / .15);
  --c-state-low-bg:      rgb(var(--c-state-low-rgb) / .15);
  --c-state-notfound-bg: rgb(var(--c-state-notfound-rgb) / .15);
  --c-state-none-bg:     rgb(var(--c-state-none-rgb) / .15);
  --c-state-exists-fg:   rgb(134 239 172);
  --c-state-low-fg:      rgb(253 224 71);
  --c-state-notfound-fg: rgb(252 165 165);
  --c-state-none-fg:     rgb(148 163 184);
  /* dark ink for text on the SOLID green/amber/red dots (theme-constant, AA) */
  --c-on-state-fill: #1f2937;

  /* ── Semantic ──────────────────────────────────────────────────────── */
  --c-success-rgb: 74 222 128;
  --c-warning-rgb: 251 191 36;
  --c-info-rgb:    96 165 250;
  --c-danger-rgb:  248 113 113;
  --c-success: rgb(var(--c-success-rgb));
  --c-warning: rgb(var(--c-warning-rgb));
  --c-info:    rgb(var(--c-info-rgb));
  --c-danger:  rgb(var(--c-danger-rgb));

  /* ── Typography ────────────────────────────────────────────────────── */
  --font-sans: "Arimo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;
  --font-display: var(--font-sans);
  --fs-xs: 0.75rem;  --fs-sm: 0.875rem; --fs-base: 1rem;
  --fs-lg: 1.125rem; --fs-xl: 1.25rem;  --fs-2xl: 1.5rem;
  --fs-3xl: 1.875rem; --fs-4xl: 2.25rem; --fs-5xl: 3rem;
  --lh-tight: 1.2; --lh-snug: 1.35; --lh-normal: 1.55; --lh-relaxed: 1.7;
  --tracking-tight: -0.02em; --tracking-normal: 0; --tracking-wide: 0.02em; --tracking-mono: 0;

  /* ── Radii ─────────────────────────────────────────────────────────── */
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 10px;
  --radius-xl: 14px; --radius-2xl: 20px; --radius-pill: 999px;

  /* ── Shadows (flat, purple-tinted — no puffy defaults) ─────────────── */
  --shadow-flat: 0 0 0 1px var(--c-border-default);
  --shadow-low:  0 1px 2px rgb(var(--c-brand-deep-rgb) / .25);
  --shadow-mid:  0 8px 24px -8px rgb(var(--c-brand-deep-rgb) / .45);
  --shadow-high: 0 20px 60px -20px rgb(var(--c-brand-deep-rgb) / .60);

  /* ── Motion ────────────────────────────────────────────────────────── */
  --t-fast: 120ms; --t-base: 200ms; --t-slow: 320ms;
  --ease-standard: cubic-bezier(.2,0,0,1);
  --ease-emphasised: cubic-bezier(.2,0,.1,1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-base: 0ms; --t-slow: 0ms; }
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
}
