/*
 * Дизайн-токены приложения jurhelp.
 *
 * Значения выведены из Figma-макета `Jurhelp / UI-kit / components header`
 * (узел 173:5514) — потому что в файле Figma не заведены Variables/Styles,
 * вытаскивать `get_variable_defs` нечего. См. [[decisions]]:
 * 2026-05-22 «локальные CSS-токены вместо Figma Variables».
 *
 * Имена осмысленные, не «синий-1»: при правке палитры дизайнером меняется
 * один токен, а не 50 мест в .templ. Когда в Figma появятся Variables —
 * этот файл станет автогенерируемым.
 */
:root {
  /* ---------- Поверхности ---------- */
  --c-bg-page: #ffffff;
  --c-bg-card: #ffffff;
  --c-bg-input: #ebebeb;
  --c-bg-button-primary: #000000;
  --c-divider: rgba(0, 0, 0, 0.05);
  --c-border-input: rgba(0, 0, 0, 0.05);
  --c-shadow-card: 0 4px 3px rgba(0, 0, 0, 0.05);

  /* ---------- Текст ---------- */
  --c-text-primary: #000000;
  --c-text-on-primary: #ffffff;
  --c-text-muted: #787878;
  --c-text-section: rgba(40, 35, 93, 0.7); /* "МЕНЮ", "ДЕЛА", chevron */
  --c-text-accent: #28235d;
  --c-text-blue: #317ff2;                  /* ссылки-акценты (Frame/text/blue) */
  --c-accent: #28235d;                     /* палочка активной карточки */

  /* ---------- Маркеры (категории дел) ---------- */
  --c-marker-orange:  #ffa500;
  --c-marker-green:   #7ac555;
  --c-marker-blue:    #317ff2;
  --c-marker-purple:  #ba79fd;
  --c-marker-red:     #ff0000;
  --c-marker-magenta: #ea00ff;

  /* ---------- Состояния ошибки (Figma 870:2818 «Ошибка входа») ----------
   * Поле с ошибкой и тост: Input&Search&Dropdown/bg/error + Frame/bg pale red
   * (#ffe6e6), текст/иконка — Input text/error + Frame/icon/critical (#ff0000). */
  --c-bg-error:   #ffe6e6;
  --c-text-error: #ff0000;

  /* Снек-бар успеха (Figma 1140:4743) — Frame/bg/pale-green фон, Frame/icon/green
     кружок-галка (переиспользуем --c-marker-green #7ac555). */
  --c-bg-success: #f2faee;

  /* ---------- Типографика ---------- */
  --font-sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --fs-button: 14px;
  --fs-nav-link: 14px;
  --fs-section-title: 12px;
  --fs-case-name: 12px;
  --fs-case-type: 11px;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  --ls-section-title: 1.5px;

  /* ---------- Spacing-шкала (кратно 2/4px) ---------- */
  --sp-1: 2px;
  --sp-2: 4px;
  --sp-3: 8px;
  --sp-4: 12px;
  --sp-5: 16px;
  --sp-6: 24px;
  --sp-8: 32px;

  /* ---------- Радиусы ---------- */
  --rd-sm: 4px;                            /* Figma Radius/radius 4 (бейджи статуса/приоритета, чипы) */
  --rd-md: 8px;
  --rd-lg: 10px;
  --rd-xl: 16px;                           /* модальное окно (Figma Radius/radius 16) */

  /* ---------- Форма создания дела (Figma node 414-7138) ---------- */
  --c-bg-field: #f7f7f7;                   /* Input&Search&Dropdown/bg/main */
  --c-text-special: #69658e;               /* Frame/text/special */
  --c-bg-brand: #7dc7bf;                    /* Frame/bg/brand — бирюзовый «выполнено» (степпер/чекбоксы) */
  --c-overlay: rgba(0, 0, 0, 0.25);        /* подложка модального окна */
  --sp-5h: 20px;                           /* Spacing/spacing 20 (gap кружков цвета) */
  --modal-width: 704px;

  /* ---------- Размеры компонентов ---------- */
  --sidebar-width: 299px;
  --icon-size: 16px;
  --marker-size: 8px;

  /* ---------- Календарь (UC-CAL-1) ----------
   * «Бледная» палитра карточек по коду цвета дела (dict_color) — соответствие
   * Figma Frame/bg/pale * (узлы 835:14062/14369/14870). Фон ячейки «сегодня» —
   * pale brand #dff2ef. Высота часа недельной сетки — переменная (скролл). */
  --c-cal-red:    #ffe6e6;
  --c-cal-amber:  #fff6e6;
  --c-cal-mint:   #f2faee;
  --c-cal-blue:   #ebf3fe;
  --c-cal-violet: #f9f2ff;
  --c-cal-pink:   #fde6ff;
  --c-cal-teal:   #ddf3f0;
  --c-cal-slate:  #ebebeb;
  --c-cal-none:   #f3f3f3;
  --c-cal-today:  #dff2ef;
  /* Границы дней (столбцы недели, ячейки месяца) — темнее общего --c-divider
   * (rgba 0,0,0,0.05), который на части мониторов не виден (JURHELP-160). Только
   * межидневные линии; часовые линии внутри дня остаются на --c-divider — так
   * границы дней доминируют над более мелкой часовой разметкой. */
  --c-cal-grid:   rgba(0, 0, 0, 0.22);
  --cal-hour:     56px;
}