/* LAYER 01 — PRIMITIVE
   Raw, meaningless-on-their-own values. NEVER reference these from a component;
   go through the semantic layer in tokens/semantic-*.css. */
:root {
  /* ---- Primary: Orka Blue. The only hue used for primary actions, links and focus. ---- */
  --orka-blue-50: #F1F8FE;
  --orka-blue-100: #E7F2FD;
  --orka-blue-200: #C6E2FA;
  --orka-blue-300: #86BEF2;
  --orka-blue-400: #5AA8EE;
  --orka-blue-500: #3D9BF0;
  --orka-blue-600: #1E8FEC;
  --orka-blue-700: #1573C6;
  --orka-blue-800: #0A3B73;
  --orka-blue-900: #0A3463;

  /* ---- Secondary: Deep Navy. Doubles as the neutral ramp — text, borders, dense surfaces. ---- */
  --orka-neutral-0: #FFFFFF;
  --orka-neutral-25: #F8FBFF;
  --orka-neutral-50: #F2F7FD;
  --orka-neutral-100: #E9F1FB;
  --orka-neutral-150: #E2EAF3;
  --orka-neutral-200: #CBD8E8;
  --orka-neutral-300: #9FB0C6;
  --orka-neutral-400: #7587A0;
  --orka-neutral-500: #5E7187;
  --orka-neutral-600: #41566F;
  --orka-neutral-700: #243B57;
  --orka-neutral-800: #142C4B;
  --orka-neutral-850: #0F2440;
  --orka-neutral-900: #0A2A52;
  --orka-neutral-950: #06182E;

  /* The orca's fin — the mark's navy. Same value as neutral-850, named for brand use. */
  --orka-fin: #0F2440;

  /* Dark-mode surface anchor, quoted by the chart validator in Dashboards §04. */
  --orka-dark-surface: #0E2742;

  /* ---- Raw state hues (measured from shipped OrkaOS builds) ---- */
  --orka-success-600: #0CA86C;
  --orka-success-700: #05A46B;
  --orka-success-50: #E2F9F0;
  --orka-warning-600: #C58209;
  --orka-warning-50: #FDF3E1;
  --orka-error-600: #CB2D20;
  --orka-error-500: #DB655B;
  --orka-error-50: #FCE5E3;
  --orka-count-red: #EA4336;

  /* ---- AI accent. Indigo -> Teal, reserved for AI-assisted moments ONLY. ---- */
  --orka-accent-indigo: #5B6CF5;
  --orka-accent-teal: #0C9FAB;

  /* ---- Categorical data hues. Fixed slot order IS the CVD-safety mechanism —
         never cycle, never re-pick. Light and dark are separately tuned palettes. ---- */
  --orka-chart-1-light: #1E8FEC;  --orka-chart-1-dark: #3897EB;
  --orka-chart-2-light: #0C9FAB;  --orka-chart-2-dark: #0DA997;
  --orka-chart-3-light: #5B6CF5;  --orka-chart-3-dark: #7D87EC;
  --orka-chart-4-light: #05A46B;  --orka-chart-4-dark: #04AC79;
  --orka-chart-5-light: #C58209;  --orka-chart-5-dark: #BD8700;
  --orka-chart-6-light: #8B5CF6;  --orka-chart-6-dark: #987CE9;
  --orka-chart-7-light: #ED6076;  --orka-chart-7-dark: #E06282;
  --orka-chart-8-light: #029BD2;  --orka-chart-8-dark: #229FD0;

  /* ---- Spacing scale. 4px base. Use for gap and padding — never a hand-picked margin. ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  /* ---- Radius. Grows with a component's footprint. ---- */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 30px;
  --radius-2xl: 40px;
  --radius-pill: 999px;

  /* ---- Type scale ---- */
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-md: 15px;
  --fs-lg: 16px;
  --fs-xl: 18px;
  --fs-2xl: 20px;
  --fs-3xl: 24px;
  --fs-4xl: 30px;
  --fs-5xl: 36px;
  --fs-6xl: 44px;
  --fs-7xl: 56px;
  --fs-8xl: 68px;

  --fw-regular: 400; /* @kind font */
  --fw-medium: 500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold: 700; /* @kind font */
  --fw-extrabold: 800; /* @kind font */
  --fw-black: 900; /* @kind font */

  /* ---- Icon sizes. md (18px) is the default inline size. ---- */
  --icon-xs: 14px; /* @kind spacing */
  --icon-sm: 16px; /* @kind spacing */
  --icon-md: 18px; /* @kind spacing */
  --icon-lg: 20px; /* @kind spacing */
  --icon-xl: 24px; /* @kind spacing */
  --icon-2xl: 32px; /* @kind spacing */
  --icon-3xl: 40px; /* @kind spacing */

  /* ---- Opacity scale. Every hover/pressed/disabled state draws from this,
         instead of each component inventing its own faded gray. ---- */
  --opacity-4: 0.04; /* @kind other */
  --opacity-8: 0.08; /* @kind other */
  --opacity-12: 0.12; /* @kind other */
  --opacity-16: 0.16; /* @kind other */
  --opacity-24: 0.24; /* @kind other */
  --opacity-38: 0.38; /* @kind other */
  --opacity-60: 0.60; /* @kind other */
  --opacity-87: 0.87; /* @kind other */
}
