/*
  Design tokens — project-agnostic primitives.
  Reuse this file as-is in any future UI; build semantic aliases
  (surface/text/border colors, per-component tokens) on top of it
  in a separate stylesheet rather than editing these values in place.
*/

:root {
  /* ---------- Neutral scale: 100 (darkest) -> 10 (lightest), step 10 ---------- */
  --neutral-100: #16151c;
  --neutral-90:  #2b2a33;
  --neutral-80:  #46454f;
  --neutral-70:  #61606b;
  --neutral-60:  #7c7b86;
  --neutral-50:  #9796a1;
  --neutral-40:  #b2b1bb;
  --neutral-30:  #cfced6;
  --neutral-20:  #e7e6ec;
  --neutral-10:  #f7f7fa;

  /* ---------- Brand: primary ---------- */
  --color-primary-600: #821ec9; /* darker shade — text/hover, ~7:1 contrast on white */
  --color-primary-500: #a225fb; /* base — gradient dark stop */
  --color-primary-400: #bb75ec; /* gradient light stop */
  --color-primary-100: #faeefe; /* soft tint background */

  /* ---------- Semantic (success/warning/danger) ---------- */
  --color-success: #157f3c;
  --color-success-soft: #e7f7ed;
  --color-warning: #a15c00;
  --color-warning-soft: #fff3dc;
  --color-danger: #c21807;
  --color-danger-soft: #fdebea;

  /* ---------- Typography ---------- */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  /* Only two weights ever — no 600/700/bold */

  /* Body/UI text: 12 / 14 / 16 only */
  --text-sm: 12px;
  --text-base: 14px;
  --text-lg: 16px;

  /* Headings: strict h1-h6 scale, all --fw-medium */
  --h1-size: 32px;
  --h2-size: 28px;
  --h3-size: 24px;
  --h4-size: 20px;
  --h5-size: 16px;
  --h6-size: 14px;

  /* ---------- Spacing: multiples of 2, prefer 2/4/6/8 for tight spacing ---------- */
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;

  /* ---------- Radius: 4 / 8 / 16 / 24 only, plus one named exception ---------- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-control: 12px; /* buttons/inputs — deliberate exception to the 4-value scale */

  /* ---------- Shadows: plain neutral, no brand tint on neutral surfaces ---------- */
  --shadow-xs: 0 1px 2px rgba(16, 15, 30, 0.05);
  --shadow-sm: 0 2px 6px rgba(16, 15, 30, 0.06), 0 1px 2px rgba(16, 15, 30, 0.04);
  --shadow: 0 2px 6px rgba(16, 15, 30, 0.05), 0 10px 24px rgba(16, 15, 30, 0.06);
  --shadow-lg: 0 6px 12px rgba(16, 15, 30, 0.07), 0 18px 32px rgba(16, 15, 30, 0.09);

  /* ---------- Palette: 6 distinct accent colors for user-assignable tags/folders ---------- */
  --palette-purple: #a225fb;
  --palette-blue: #2563eb;
  --palette-green: #16a34a;
  --palette-amber: #f59e0b;
  --palette-pink: #ec4899;
  --palette-teal: #0d9488;
}
