/* ============================================================
   Дизайн-токены ЛК sivikshop
   ⚠️ ВРЕМЕННЫЕ значения — сняты «на глаз» со скриншотов Figma.
   Будут заменены точными переменными из Figma (get_variable_defs),
   когда сбросится лимит Figma MCP. Менять только здесь.
   ============================================================ */

:root {
  /* --- Цвета: бренд (точные из логотипа sivikshop.ru) --- */
  --c-brand:          #1B4E9B; /* синий логотипа Sivik */
  --c-primary:        #2563D6; /* основной синий: кнопки, «Каталог», плашки */
  --c-primary-dark:   #1E4FB0; /* hover/active */
  --c-primary-band:   #2A4A9C; /* синяя плашка «Личный кабинет» на входе */
  --c-accent:         #E41D2D; /* фирменный красный: «Распродажа», бейдж корзины */
  --c-accent-dark:    #C4151F; /* hover красного */

  /* --- Цвета: текст --- */
  --c-text:           #1F2A37; /* основной */
  --c-text-2:         #5A6B7B; /* вторичный */
  --c-muted:          #8A94A0; /* подписи, плейсхолдеры */
  --c-link:           #2B6FD6; /* ссылки */
  --c-on-primary:     #FFFFFF; /* текст на синем */

  /* --- Цвета: поверхности --- */
  --c-bg:             #F4F5F7; /* фон страницы */
  --c-surface:        #FFFFFF; /* карточки, панели */
  --c-field-bg:       #F7F8FA; /* фон полей ввода */
  --c-border:         #E2E5E9; /* бордеры, разделители */
  --c-border-strong:  #CDD3DA;

  /* --- Сайдбар --- */
  --c-sidebar-guest:  #2A2A2A; /* тёмный сайдбар на экранах входа */
  --c-sidebar:        #ECEEF1; /* светлый сайдбар в кабинете */

  /* --- Статусные --- */
  --c-success:        #6AAE5A; /* эко-теги, успех */
  --c-danger:         #E2231A;
  --c-disabled:       #A6ADB5; /* неактивная кнопка («Войти») */

  /* --- Типографика --- */
  --font-base: 'Ubuntu', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --fz-12: 12px;  --fz-13: 13px;  --fz-14: 14px;  --fz-16: 16px;
  --fz-18: 18px;  --fz-20: 20px;  --fz-24: 24px;  --fz-28: 28px;
  --lh-tight: 1.2;  --lh-base: 1.5;
  --fw-regular: 400;  --fw-medium: 500;  --fw-bold: 700;

  /* --- Отступы (шаг 4) --- */
  --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;

  /* --- Радиусы --- */
  --r-sm: 6px;  --r-md: 10px;  --r-lg: 14px;  --r-pill: 999px;

  /* --- Тени --- */
  --shadow-card: 0 1px 3px rgba(20, 30, 45, .08);
  --shadow-pop:  0 8px 32px rgba(20, 30, 45, .18);

  /* --- Каркас (масштаб Figma 1920×1280 адаптирован под реальные вьюпорты) --- */
  --header-h:  72px;   /* в Figma 115px на канвасе 1920 */
  --sidebar-w: 300px;  /* в Figme 418px на канвасе 1920 */
  --content-max: 1100px;
  --gutter: 32px;
}
