/* ============================================================
   01-TOKENS — шрифты, палитра, базовая типографика, доступность
   ------------------------------------------------------------
   ЕДИНСТВЕННОЕ место, где задаются цвета проекта.
   В остальных файлах цвета берутся только через var(--...).

   Служебные классы (отступы, .is-hidden, .text-*, .flex-*)
   живут в 05-utilities.css — он подключается последним.
   ============================================================ */

/* ─────────── ШРИФТЫ ─────────── */

@font-face{
    font-family:'Roboto';
    src:url('/static/fonts/roboto-300.ttf') format('truetype');
    font-weight:300;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'Roboto';
    src:url('/static/fonts/roboto-400.ttf') format('truetype');
    font-weight:400;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'Roboto';
    src:url('/static/fonts/roboto-500.woff2') format('woff2'),
        url('/static/fonts/roboto-500.ttf') format('truetype');
    font-weight:500;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'Roboto';
    src:url('/static/fonts/roboto-700.woff2') format('woff2'),
        url('/static/fonts/roboto-700.ttf') format('truetype');
    font-weight:700;
    font-style:normal;
    font-display:swap;
}

/* ─────────── ПАЛИТРА И РАЗМЕРЫ ─────────── */

:root{
    /* Бренд — шапка и навигация */
    --c-brand-900:#16324f;
    --c-brand-700:#1e4b78;

    /* Основное действие */
    --c-primary:#0b63ce;
    --c-primary-hover:#0a53ab;
    --c-primary-soft:#e8f1fd;

    /* Текст: основной → вторичный → приглушённый.
       --c-ink-3 — минимально допустимый для мелкого текста (контраст 4.6:1) */
    --c-ink:#1f2a37;
    --c-ink-2:#4a5567;
    --c-ink-3:#6b7785;
    --c-on-dark:#ffffff;
    --c-on-dark-soft:rgba(255,255,255,0.82);

    /* Границы и фоны */
    --c-line:#dfe5ee;
    --c-line-soft:#eef1f6;
    --c-bg:#f4f6fa;
    --c-surface:#ffffff;
    --c-surface-alt:#f8fafd;

    /* ── Смысловые цвета ──
       Один смысл = один цвет во всех местах сразу:
       бейдж статуса, бейдж срока, карточка дашборда,
       карточка приёмки, панель контроля сроков. */
    --c-success:#1a7f4b;
    --c-success-bg:#e6f6ec;
    --c-success-line:#b7e3c6;

    --c-warning:#9a6700;
    --c-warning-bg:#fff6e0;
    --c-warning-line:#f0d9a0;

    --c-danger:#b42318;
    --c-danger-bg:#fdecea;
    --c-danger-line:#f3bcb6;
    --c-danger-hover:#8f1c13;

    --c-info:#0b63ce;
    --c-info-bg:#e8f1fd;
    --c-info-line:#b9d5f5;

    --c-neutral:#5c6673;
    --c-neutral-bg:#eef0f3;
    --c-neutral-line:#d6dae1;

    --c-violet:#6b3fa0;
    --c-violet-bg:#f3e9fb;

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

    /* Тени */
    --sh-card:0 1px 3px rgba(22,50,79,0.06), 0 4px 12px rgba(22,50,79,0.05);
    --sh-pop:0 8px 24px rgba(22,50,79,0.14);
    --sh-header:0 2px 8px rgba(22,50,79,0.10);

    /* Отступы */
    --s-1:4px;
    --s-2:8px;
    --s-3:12px;
    --s-4:16px;
    --s-5:20px;
    --s-6:24px;

    /* Размеры шрифта */
    --fs-xs:12px;
    --fs-sm:13px;
    --fs-md:14px;
    --fs-lg:16px;
    --fs-xl:18px;

    /* Высота липкой шапки — используется для прилипающих
       заголовков таблиц (см. 03-components.css).
       Пересчитывается в 02-layout.css на узких экранах. */
    --nav-h:52px;

    /* Максимальная ширина контента */
    --w-page:1600px;
}

/* ─────────── БАЗОВАЯ ТИПОГРАФИКА ─────────── */

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Roboto', Arial, Helvetica, sans-serif;
    margin:0;
    background:var(--c-bg);
    color:var(--c-ink);
}

h1,h2,h3,h4{
    margin-top:0;
    color:var(--c-ink);
}

h2{
    font-size:22px;
}

h3{
    font-size:var(--fs-lg);
}

p{
    line-height:1.5;
}

a{
    color:inherit;
}

/* ─────────── ДОСТУПНОСТЬ ─────────── */

/* Скрыто визуально, но читается скринридером */
.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    border:0;
}

/* Видимый фокус при навигации с клавиатуры */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible{
    outline:2px solid var(--c-primary);
    outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{
        animation-duration:0.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:0.01ms !important;
        scroll-behavior:auto !important;
    }
}