/* ============================================================================
 * tokens.css — Design tokens medshtab2
 *
 * SOURCE OF TRUTH для всех бренд-переменных. Используется:
 * - всеми Jinja templates (через base.html link rel="stylesheet")
 * - skill applying-brand-guidelines (для генерации документов/PDF/email)
 *
 * Изменение здесь = изменение бренда everywhere. Откат — git revert этого файла.
 *
 * Палитра: aqua-teal медицинского tone + navy accent. Sourced after rater8.com
 * audit (2026-05-22): сдвинули hue 178° → 186° (из зелёно-mint в aqua), lightness
 * 32% → 41% (светлее на 9%). Текстовые серые — нейтральный монохром #1A1A1A (TASK_314:
 * прежний tinted-teal рамп развёрнут — звучал «ИИшно»).
 *
 * См. STYLE_GUIDE.md для правил применения.
 * ============================================================================ */

/* ===================== INTER FONT (self-hosted, SIL OFL 1.1) ===============
 * Variable font (один файл покрывает weights 100-900) — self-host вместо
 * Google Fonts CDN: GDPR/152-ФЗ compliance (нет утечки IP к Google), RU
 * jurisdiction policy, устойчивость к РКН-блокировкам Google services.
 *
 * font-display: swap — мгновенный системный fallback при загрузке, Inter
 * подменяется без FOIT. preload в base.html уменьшает window подмены.
 * См. app/static/fonts/InterVariable-LICENSE.txt для SIL OFL.
 * ========================================================================== */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/static/fonts/InterVariable.woff2') format('woff2-variations'),
       url('/static/fonts/InterVariable.woff2') format('woff2');
}

/* ===================== GOLOS TEXT (self-hosted, SIL OFL 1.1) ================
 * Golos Text ВЕЗДЕ (TASK_214 Волна 0): --font-sans ведёт Golos → body, контролы,
 * таблицы, подписи. Variable woff2 (wght 400-900, один файл на subset) — ось
 * объявлена 400 900: браузер инстанцирует любой вес без faux-bold.
 * Self-host (не Google CDN): 152-ФЗ/GDPR (нет утечки IP к Google),
 * RU jurisdiction, устойчивость к РКН — тот же мотив, что у Inter выше.
 * Subsets cyrillic + latin (latin покрывает ASCII/цифры/пунктуацию).
 * См. app/static/fonts/golos/Golos-Text-LICENSE.txt для SIL OFL.
 * ========================================================================== */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/static/fonts/golos/golos-text-cyrillic.woff2') format('woff2-variations');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/static/fonts/golos/golos-text-latin.woff2') format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                 U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ===================== BRAND PRIMARY (aqua-teal) ===================== */
  /* Основной бренд-цвет. CTA, links, primary buttons, brand accents. */
  --brand-primary:        #0AB5C5;   /* ТОЛЬКО крупный декор/иконки/плашки (НЕ под белый текст) */
  --brand-primary-dark:   #008495;   /* hover state, pressed buttons */
  --brand-primary-light:  #E0F7FA;   /* фоны акцентов, badges, focus ring */
  --brand-primary-text:   rgba(10, 181, 197, 0.72);  /* приглушённый text (decor only) */

  /* --brand-ink — контраст-safe тон того же hue для ТЕКСТА/КНОПОК/ССЫЛОК.
   * white-on-ink = 5.8:1, ink-on-white = 5.8:1 → WCAG AA (audit 2026-05-30 fix:
   * белый текст на #0AB5C5 давал лишь 2.49:1). Использовать для всего, что несёт
   * текст или белый текст; #0AB5C5 оставить для декоративных акцентов. */
  --brand-ink:        #00707E;
  --brand-ink-hover:  #005A64;   /* pressed/hover для ink-кнопок */

  /* ===================== BRAND SECONDARY (navy) ======================= */
  /* Trust accent — для headings секций, security badges, trust signals. */
  /* Pair (aqua + navy) = классическая healthcare палитра. */
  --brand-secondary:        #023F88;
  --brand-secondary-dark:   #012559;
  --brand-secondary-light:  #E8EEF7;
  --brand-secondary-text:   rgba(2, 63, 136, 0.72);

  /* ===================== TEXT (нейтральный монохром, TASK_314) ========= */
  /* Все текстовые токены — единый near-black #1A1A1A (НЕ pure #000 → без halation).
     TASK_314: развёрнут прежний tinted-teal рамп (warm tinge / micro-teal) — был «ИИшный». */
  --graphite:         #1A1A1A;
  --graphite-text:    #1A1A1A;
  --graphite-60:      #1A1A1A;   /* secondary text/captions — тот же чёрный (тон. разделения нет — выбор владельца) */
  --graphite-30:      #8A8A8A;   /* disabled, placeholder — нейтральный серый (аффорданс «пусто/недоступно») */

  /* ===================== SURFACES ===================================== */
  --white:        #FFFFFF;
  --gray-bg:      #F7F9FA;   /* page background с micro-blue tint (был #F7F7F7 beige) */
  --gray-mid:     #F1F5F9;   /* default badges, alt rows */
  --gray-border:  #E2E5E7;   /* outlined по rater8 */
  --beige:        #F7F9FA;   /* alias для legacy landing — НЕ использовать в новых стилях */
  --beige-dark:   #ECEEF1;

  /* ===================== BRAND SURFACES (design kit «konfetka», 2026-05-31) =====
   * Плитки кабинета: тонкий бренд-бордюр по периметру + лёгкий «волновой»
   * градиент (рецепт лендинга .feature-item). Hero — фирменный aqua-градиент
   * (.blog-grad). Источник правды для .ms-tile / .ms-kpi-card--rich / .ms-hero. */
  --brand-border:        rgba(10, 181, 197, 0.30);   /* бордюр плиток (idle) — 0.22→0.30 (konfetka polish: figure/ground) */
  --brand-border-strong: rgba(10, 181, 197, 0.55);   /* бордюр плиток (hover) */
  --surface-brand:       linear-gradient(145deg, #FFFFFF 55%, rgba(10, 181, 197, 0.07) 100%);
  /* TASK_422: ЕДИНСТВЕННАЯ санкционированная глянцевая поверхность бренда — крупный герой
     (напр. /competitors). Глянец НЕ добавлять на функционал (сайдбар/кнопки/бордюры/чипы)
     и НЕ на дашборд-полосы/пульс — они плоские. Один осознанный паттерн, не scatter. */
  --hero-brand:          linear-gradient(135deg, #0AB5C5 0%, #5DD4DF 55%, #B3EBF1 100%);

  /* ===================== SEMANTIC (status colors) ===================== */
  /* *-light — фоны бейджей/алертов; базовый — иконки/крупный декор;
   * *-ink — для ТЕКСТА на белом/светлом (WCAG AA, audit 2026-05-30):
   * success/warning базовые давали лишь ~3.2:1 как текст, ink-варианты = 5.0:1. */
  --success:       #16A34A;
  --success-ink:   #15803D;   /* текст «Оплачен/Активен» на белом → 5.02:1 */
  --success-light: #DCFCE7;
  --warning:       #D97706;
  --warning-ink:   #B45309;   /* текст-варнинги на белом → 5.02:1 */
  --warning-light: #FFF3E0;
  --danger:        #DC2626;   /* danger-on-white = 4.83:1 (ok как текст) */
  --danger-ink:    #B91C1C;
  --danger-light:  #FEF2F2;
  --danger-soft:   #F0D9D7;   /* приглушённый негатив-фон полосы поз/нег (TASK_393.1, не тревожный) */
  --star:          #F5A623;   /* янтарь звёзд-рейтинга (TASK_431) — .ms-star-full/-half, .ms-cmp-star; ★-дашборда supervised, не сюда */
  --award-gold:    #FFC400;   /* ярко-жёлтая заливка звёзд печатного бейджа награды (497.3); зеркало — badge_pdf.py AWARD_GOLD */
  --info:          var(--brand-secondary);
  --info-ink:      var(--brand-secondary);   /* navy 10:1 */
  --info-light:    var(--brand-secondary-light);

  /* Алерт-токены (заменяют hardcoded #991b1b/#fecaca/#065f46/#a7f3d0 в components.css) */
  --alert-error-bg:     var(--danger-light);
  --alert-error-text:   #991B1B;   /* on #FEF2F2 → 7.4:1 */
  --alert-error-border: #FECACA;
  --alert-success-bg:     var(--success-light);
  --alert-success-text:   #065F46;   /* on #DCFCE7 → 7.0:1 */
  --alert-success-border: #A7F3D0;
  --alert-warning-bg:     var(--warning-light);
  --alert-warning-text:   #92400E;
  --alert-warning-border: #FCD34D;
  --alert-info-bg:        var(--brand-secondary-light);
  --alert-info-text:      var(--brand-secondary-dark);
  --alert-info-border:    #C7D6EC;

  /* Focus ring — navy (10:1, видно на любом фоне), общий для :focus-visible */
  --focus-ring: var(--brand-secondary);

  /* ===================== DEPRECATED aliases (для landing legacy) ====== */
  /* TODO: удалить после полной миграции landing.html на --brand-* */
  --mint:       var(--brand-primary);       /* было #00A19B */
  --mint-dark:  var(--brand-primary-dark);  /* было #007A75 */
  --mint-light: var(--brand-primary-light); /* было #E6F7F6 */
  --mint-text:  var(--brand-primary-text);
  --coral:      var(--brand-primary);       /* совсем legacy */
  --coral-light: var(--brand-primary-light);
  --gray:       var(--gray-bg);             /* было #F7F7F7 */

  /* ===================== TYPOGRAPHY =================================== */
  --font-sans: 'Golos Text', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', Menlo, Monaco, Consolas, monospace;
  --sans: var(--font-sans);  /* alias для landing legacy */
  /* Display — заголовки/KPI-числа. Fallback на Inter (не системный serif),
   * чтобы при сбое загрузки шрифта вид деградировал в текущий Inter. */
  --font-display: 'Golos Text', var(--font-sans);

  /* Type scale (1.25 ratio, base 17px — TASK_314: +1px по нижней шкале) */
  --text-xs:   0.8125rem;  /* 13px */
  --text-sm:   0.9375rem;  /* 15px */
  --text-base: 1.0625rem;  /* 17px */
  --text-lg:   1.1875rem;  /* 19px */
  --text-xl:   1.25rem;    /* 20px */
  --text-2xl:  1.5rem;     /* 24px */
  --text-3xl:  1.875rem;   /* 30px */
  --text-4xl:  2.25rem;    /* 36px */
  --text-5xl:  3rem;       /* 48px */

  /* Вторичный/мелкий текст (TASK_214 Волна 0): +1 ступень размера + near-black */
  --text-secondary:         var(--graphite);   /* #1A1A1A near-black (НЕ brand-ink/тил) */
  --text-secondary-size:    0.875rem;           /* 14px (TASK_314: +1px) */
  --text-secondary-size-lg: 1rem;               /* 16px (TASK_314: +1px) */

  /* ===================== SPACING ====================================== */
  --space-1:  0.25rem;   /* 4px */
  --space-2:  0.5rem;    /* 8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */

  /* Мера одной колонки контента в Настройках (формы/списки) — общий «set-*» layout. */
  --set-w: 640px;

  /* ===================== RADII ======================================== */
  --radius-sm:   3px;
  --radius:      3px;
  --radius-md:   3px;
  --radius-lg:   3px;
  --radius-full: 9999px;

  /* ===================== SHADOWS (tinted с aqua-teal) ================= */
  --shadow-sm: 0 1px 2px rgba(10, 181, 197, 0.06), 0 1px 1px rgba(0,0,0,0.04);
  --shadow:    0 4px 20px -2px rgba(10, 181, 197, 0.12), 0 1px 4px rgba(0,0,0,0.04);
  --shadow-lg: 0 12px 40px -8px rgba(10, 181, 197, 0.25), 0 4px 12px rgba(0,0,0,0.06);
  --shadow-xl: 0 24px 60px -12px rgba(10, 181, 197, 0.3), 0 8px 24px rgba(0,0,0,0.08);

  /* ===================== TRANSITIONS ================================== */
  --transition-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition:      200ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
  --ease-tab:        cubic-bezier(0.32, 0.72, 0, 1);   /* R3 — папки-табы; мягче Material 0.4,0,0.2,1 */
  --ease-out:        cubic-bezier(0.16, 1, 0.3, 1);   /* Волна 1 (1.5): кривая входа/раскрытия (decel); конвенция ДС, потребитель — Волна 2 */

  /* ===================== Z-INDEX ====================================== */
  --z-base:     0;
  --z-dropdown: 10;
  --z-sticky:   20;
  --z-overlay:  30;
  --z-modal:    40;
  --z-toast:    50;

  /* ===================== BREAKPOINTS (для @media references) =========== */
  --bp-sm:  640px;
  --bp-md:  768px;
  --bp-lg:  1024px;
  --bp-xl:  1280px;

  /* ===================== LAYOUT (sidebar) ============================= */
  --sidebar-w:           240px;  /* развёрнутый сайдбар (TASK_307) */
  --sidebar-w-collapsed: 64px;   /* свёрнутый: только иконки */
}