/* =====================================================================
   INTELEO — Design Tokens
   Dark analytical theme. Navy/graphite base · precise blue · cyan accent
   · restrained teal for verified/confidence · amber/red for risk only.
   All text/UI color pairings target WCAG AA.
   ===================================================================== */

:root {
  /* ---- Brand ------------------------------------------------------- */
  --navy:            #0F2A4A;   /* brand navy (light-bg lockups) */
  --brand-600:       #2563EB;   /* primary blue */
  --brand-500:       #3B82F6;   /* primary on dark surfaces */
  --brand-400:       #5B9BFF;
  --brand-300:       #93C0FF;
  --accent-cyan:     #22D3EE;   /* verified source point / accent */
  --accent-cyan-600: #0891B2;

  /* ---- Surfaces (dark) -------------------------------------------- */
  --bg-base:      #080E16;   /* app background, deepest */
  --bg-canvas:    #0A1119;   /* page background */
  --surface-1:    #0E1824;   /* cards */
  --surface-2:    #131F2E;   /* raised / inputs */
  --surface-3:    #1A2838;   /* hover / active */
  --surface-4:    #213348;   /* highest */

  /* ---- Borders ----------------------------------------------------- */
  --border-subtle: rgba(255,255,255,0.06);
  --border:        rgba(255,255,255,0.10);
  --border-strong: rgba(255,255,255,0.16);
  --border-focus:  var(--brand-500);

  /* ---- Text -------------------------------------------------------- */
  --text-strong:   #F3F7FC;   /* headings */
  --text:          #DCE6F0;   /* body */
  --text-muted:    #98A9BD;   /* secondary */
  --text-subtle:   #677890;   /* tertiary / meta */
  --text-faint:    #45566B;   /* disabled */
  --text-on-brand: #FFFFFF;

  /* ---- Semantic ---------------------------------------------------- */
  --success:      #2DD4BF;   /* verified / confidence (teal) */
  --success-bg:   rgba(45,212,191,0.12);
  --success-bd:   rgba(45,212,191,0.34);
  --info:         #38BDF8;
  --info-bg:      rgba(56,189,248,0.12);
  --info-bd:      rgba(56,189,248,0.32);
  --warning:      #FBBF24;   /* needs verification / moderate */
  --warning-bg:   rgba(251,191,36,0.12);
  --warning-bd:   rgba(251,191,36,0.34);
  --danger:       #F4505F;   /* risk / red flag */
  --danger-text:  #FB7185;
  --danger-bg:    rgba(244,80,95,0.12);
  --danger-bd:    rgba(244,80,95,0.36);

  /* ---- Risk scale (low → critical) -------------------------------- */
  --risk-low:       #2DD4BF;
  --risk-moderate:  #FBBF24;
  --risk-elevated:  #FB923C;
  --risk-high:      #F87171;
  --risk-critical:  #EF4444;

  /* ---- Evidence status -------------------------------------------- */
  --ev-fact:    #2DD4BF;   /* Fakt źródłowy */
  --ev-infer:   #8B9BFF;   /* Wniosek AI */
  --ev-verify:  #FBBF24;   /* Wymaga weryfikacji */

  /* ---- Chart palette ---------------------------------------------- */
  --chart-1: #3B82F6;
  --chart-2: #22D3EE;
  --chart-3: #2DD4BF;
  --chart-4: #8B5CF6;
  --chart-5: #FBBF24;
  --chart-6: #64748B;

  /* ---- Typography -------------------------------------------------- */
  --font-display: 'Space Grotesk', 'IBM Plex Sans', system-ui, sans-serif;
  --font-sans:    'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* type scale (rem on 16px base) */
  --fs-display: 3.5rem;   /* 56 */
  --fs-h1:      2.5rem;   /* 40 */
  --fs-h2:      2rem;     /* 32 */
  --fs-h3:      1.5rem;   /* 24 */
  --fs-h4:      1.25rem;  /* 20 */
  --fs-lg:      1.125rem; /* 18 */
  --fs-base:    1rem;     /* 16 */
  --fs-sm:      0.875rem; /* 14 */
  --fs-xs:      0.75rem;  /* 12 */
  --fs-2xs:     0.6875rem;/* 11 — meta/labels */

  --lh-tight:   1.12;
  --lh-snug:    1.3;
  --lh-normal:  1.55;
  --lh-relaxed: 1.7;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide:  0.04em;
  --tracking-caps:  0.08em;

  /* ---- Spacing (4px base) ----------------------------------------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;

  /* ---- Radius ------------------------------------------------------ */
  --r-xs:  4px;
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  14px;
  --r-xl:  20px;
  --r-2xl: 28px;
  --r-pill: 999px;

  /* ---- Shadows (dark-tuned) --------------------------------------- */
  --sh-sm:  0 1px 2px rgba(0,0,0,0.4);
  --sh-md:  0 4px 12px rgba(0,0,0,0.45);
  --sh-lg:  0 12px 32px rgba(0,0,0,0.5);
  --sh-xl:  0 24px 64px rgba(0,0,0,0.6);
  --glow-brand: 0 0 0 1px rgba(59,130,246,0.4), 0 8px 28px rgba(37,99,235,0.30);
  --glow-cyan:  0 0 24px rgba(34,211,238,0.35);

  /* ---- Layout ------------------------------------------------------ */
  --container:    1200px;
  --container-wide: 1440px;
  --sidebar-w:    260px;
  --topbar-h:     64px;

  --ring: 0 0 0 3px rgba(59,130,246,0.35);
  --transition: 160ms cubic-bezier(0.4,0,0.2,1);
}
