/* =====================================================================
 * hifaces — дизайн-токены
 * design-system/tokens.css
 * Источник: палитра и метрики из prototype-v3/*.html
 * Дата: 2026-07-20
 *
 * Используется и Astro (публичная статика), и статикой от FastAPI.
 * Компоненты — в design-system/components.css (следующий файл).
 * Базовый шрифт Inter тянется с Google Fonts в base layout.
 * ===================================================================== */

:root {
  /* ---------- Палитра: основная (из :root прототипов) ---------- */
  --bg:       #F5F1EA;  /* фон страницы — тёплый off-white */
  --alt:      #EFE9DF;  /* альтернативный фон — футер, вспомогательные секции */
  --ink:      #1A1815;  /* основной текст — почти-чёрный с тёплым подтоном */
  --ink2:     #6B6358;  /* приглушённый текст — muted, hints */
  --acc:      #C96442;  /* акцент — тёплый терракот, primary CTA */
  --acc-h:    #B5563A;  /* акцент hover */
  --ok:       #4A7C59;  /* успех/confirmed — приглушённый зелёный */
  --bd:       #E0D8CC;  /* границы, hairlines */
  --card:     #FCFAF6;  /* фон карточек — ещё светлее bg */
  --danger:   #B0413A;  /* ошибки, destructive */
  --warn:     #9A6B1E;  /* предупреждения */

  /* ---------- Производные тона для алертов и бейджей ---------- */
  --ok-bg:      #EAF1EC;  /* фон success-алерта */
  --ok-bd:      #CADBCF;  /* граница success-алерта */
  --danger-bg:  #F6E9E7;  /* фон error-алерта */
  --danger-bd:  #E3CBC8;  /* граница error-алерта */
  --warn-bg:    #F8EEDC;  /* фон warn-алерта */
  --warn-bd:    #F0E0C8;  /* граница warn-алерта */
  --disabled:   #D8C7BD;  /* фон disabled-кнопки */

  /* ---------- Типографика ---------- */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;

  /* Размеры шрифта (rem, база 16px) */
  --fs-xs:    0.78rem;  /* 12-13px, лейблы eyebrow/uppercase */
  --fs-sm:    0.85rem;  /* hints, meta */
  --fs-base:  1rem;     /* основной текст инпутов/кнопок */
  --fs-md:    1.0625rem;/* body — базовый размер в прототипах */
  --fs-lg:    1.15rem;  /* подзаголовки секций */
  --fs-xl:    1.3rem;   /* h2 внутри карточек */
  --fs-2xl:   1.5rem;   /* h1 в зонах */
  --fs-hero:  clamp(1.8rem, 4vw, 2.6rem);  /* hero на главной */

  /* Веса */
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* Межстрочный */
  --lh-tight:   1.1;   /* заголовки */
  --lh-snug:    1.2;   /* подзаголовки */
  --lh-base:    1.6;   /* основной текст */
  --lh-loose:   1.7;   /* длинные абзацы */

  /* Letter-spacing */
  --ls-tight:   -0.02em;  /* крупные заголовки, логотип */
  --ls-normal:  0;
  --ls-wide:    0.04em;   /* labels uppercase */
  --ls-wider:   0.06em;   /* eyebrow */

  /* ---------- Спейсинги (4-px grid) ---------- */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-7:   28px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-14:  56px;

  /* ---------- Радиусы ---------- */
  --r-sm:   6px;    /* маленькие теги, мини-кнопки */
  --r-md:   8px;    /* средние кнопки, nav-btn */
  --r-lg:   10px;   /* инпуты, основные кнопки */
  --r-xl:   12px;   /* алерты, мелкие блоки */
  --r-2xl:  14px;   /* medium cards */
  --r-3xl:  16px;   /* основные карточки */
  --r-4xl:  20px;   /* крупные модальные */
  --r-pill: 999px;  /* бейджи статусов, чипы */

  /* ---------- Borders ---------- */
  --bd-w:  1px;
  --bd-w-emphasis: 2px;

  /* ---------- Тени (минимальные, прототипы почти без них) ---------- */
  --shadow-sm: 0 1px 2px rgba(26, 24, 21, 0.04);
  --shadow-md: 0 4px 12px rgba(26, 24, 21, 0.08);
  --shadow-focus: 0 0 0 3px rgba(201, 100, 66, 0.15);  /* focus ring */

  /* ---------- Переходы ---------- */
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;

  /* ---------- Layout ---------- */
  --container-public: 1120px;   /* публичные страницы: nav, hero */
  --container-narrow: 760px;    /* профиль */
  --container-form:    620px;   /* анкета, создание агента */
  --container-auth:    440px;   /* auth card */

  --nav-height: 64px;

  /* ---------- z-index ---------- */
  --z-nav:    50;
  --z-modal:  100;
  --z-toast:  200;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
    --transition-base: 0ms;
  }
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- Тёмная тема: задел на будущее, сейчас не активна ---------- */
/*
@media (prefers-color-scheme: dark) {
  :root {
    --bg:     #1A1815;
    --alt:    #232017;
    --ink:    #F5F1EA;
    --ink2:   #9E9486;
    --acc:    #D97757;
    --acc-h:  #E88669;
    --ok:     #6BA67E;
    --bd:     #3A3530;
    --card:   #232017;
    --danger: #C9504A;
    --warn:   #B8862A;
  }
}
*/