/* ==========================================================================
   Design tokens - единственото място с цветове, размери и сенки.
   Designer агентът работи тук и в components.css; логиката не зависи от
   тези стойности.
   ========================================================================== */
:root {
  /* цветове */
  --color-bg: #FAFAFC;
  --color-surface: #FFFFFF;
  --color-surface-2: #F3F2F8;
  --color-ink: #1F1D24;
  --color-ink-soft: #46434F;
  --color-muted: #6B6874;
  --color-line: #E4E2EC;
  --color-line-strong: #C9C6D6;

  --color-primary: #5B4BDB;
  --color-primary-deep: #4536C4;
  --color-primary-soft: #EEEBFF;
  --color-primary-ink: #FFFFFF;

  --color-accent: #F5A524;
  --color-accent-soft: #FFF3DC;
  --color-success: #1F7A3D;
  --color-success-soft: #E7F5EC;
  --color-danger: #C0392B;
  --color-danger-soft: #FBEAE9;

  /* типография */
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: var(--font-body);
  --text-xs: 0.8rem;
  --text-s: 0.9rem;
  --text-m: 1rem;
  --text-l: 1.15rem;
  --text-xl: 1.4rem;
  --text-2xl: 1.8rem;
  --text-3xl: 2.4rem;
  --leading: 1.5;

  /* отстояния */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;

  /* форми */
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 18px;
  --radius-pill: 999px;
  --shadow-s: 0 1px 2px rgba(31, 29, 36, 0.06);
  --shadow-m: 0 6px 20px rgba(31, 29, 36, 0.10);
  --focus-ring: 0 0 0 3px rgba(91, 75, 219, 0.35);

  /* размери */
  --tap: 48px;               /* минимална цел за палец */
  --content-max: 680px;
  --wide-max: 1100px;
  --duration: 160ms;
  --ease: cubic-bezier(.2, .7, .3, 1);
}