/*
 * Токены дизайн-системы EGO (тёмная тема).
 *
 * Значения перенесены 1:1 из docs/design.md §1 и меняются ТОЛЬКО там: файл —
 * отражение документа, а не самостоятельный источник. Новый цвет или отступ
 * сначала появляется в design.md, потом здесь (правило CLAUDE.md №11).
 *
 * Имена токенов совпадают с документом, чтобы правку можно было перенести
 * поиском по названию: `accent-violet` в таблице → `--accent-violet` здесь →
 * `AccentViolet` в Android и iOS.
 */

:root {
    /* ─── Поверхности и текст (§1.1) ─────────────────────────────────────── */
    --bg: #0D0D14;
    --surface: #13131F;
    --surface-elevated: #1A1A2E;
    --border: #FFFFFF14;
    --divider: #FFFFFF0F;
    --text: #F0F0F8;
    --text-secondary: #8888A8;
    --text-tertiary: #5A5A7A;

    /* ─── Бренд и акценты ────────────────────────────────────────────────── */
    --accent: #7C3AED;
    --accent-light: #8B5CF6;
    --accent-violet: #A78BFA;
    --accent-indigo: #4F46E5;
    --accent-indigo-deep: #6D28D9;
    --success: #22C55E;
    --success-light: #4ADE80;
    --warning: #F59E0B;
    --error: #EF4444;
    --error-light: #F87171;
    --input-bg: #1A1A2E;
    --button-disabled-bg: #2A1F4A;
    --button-disabled-text: #5A4A7A;

    /* ─── Приоритеты задач ───────────────────────────────────────────────── */
    --priority-urgent: #EF4444;
    --priority-high: #F59E0B;
    --priority-medium: #EAB308;
    --priority-low: #94A3B8;

    /* ─── Статусы задач ──────────────────────────────────────────────────── */
    --status-todo: #60A5FA;
    --status-in-progress: #A78BFA;
    --status-done: #4ADE80;
    --status-cancelled: #94A3B8;

    /* ─── Статусы заявок GoodWork в клиенте EGO ──────────────────────────── */
    --request-draft: #94A3B8;
    --request-open: #F59E0B;
    --request-matched: #4ADE80;
    --request-in-progress: #A78BFA;
    --request-done: #4ADE80;
    --request-cancelled: #94A3B8;
    --request-expired: #5A5A7A;

    /* ─── Градиенты (§1.2). Направление всегда 135° ──────────────────────── */
    --gradient-button: linear-gradient(135deg, #7C3AED, #6D28D9);
    --gradient-logo: linear-gradient(135deg, #7C3AED, #4F46E5);
    --gradient-progress: linear-gradient(135deg, #7C3AED, #A78BFA);
    --gradient-hero: linear-gradient(135deg, #7C3AED, #A78BFA);

    /* ─── Типографика (§1.3). Пары «размер/интерлиньяж» ──────────────────── */
    --font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", monospace;

    --hero-size: 32px;         --hero-line: 38px;         --hero-weight: 800;
    --title-size: 22px;        --title-line: 28px;        --title-weight: 700;
    --screen-title-size: 20px; --screen-title-line: 26px; --screen-title-weight: 700;
    --section-size: 16px;      --section-line: 22px;      --section-weight: 600;
    --body-strong-size: 15px;  --body-strong-line: 21px;  --body-strong-weight: 600;
    --body-size: 14px;         --body-line: 20px;         --body-weight: 400;
    --caption-size: 13px;      --caption-line: 18px;      --caption-weight: 400;
    --micro-size: 11px;        --micro-line: 14px;        --micro-weight: 500;

    /* ─── Сетка и отступы (§1.4). Шаг 4 ──────────────────────────────────── */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --screen-padding: 16px;

    /* ─── Радиусы ────────────────────────────────────────────────────────── */
    --radius-input: 14px;
    --radius-card: 18px;
    --radius-card-large: 20px;
    --radius-bubble: 18px;
    --radius-bubble-tail: 4px;
    --radius-sheet: 20px;
    --radius-pill: 999px;

    /* ─── Высоты и размеры ───────────────────────────────────────────────── */
    --height-button: 52px;
    --height-input: 52px;
    --height-tabbar: 65px;
    --size-tab-icon: 22px;
    --size-mic: 36px;
    --size-checkbox: 22px;
    --avatar-profile: 80px;
    --avatar-chat: 32px;
    --avatar-executor: 42px;
    --photo-message-height: 240px;
    --photo-message-max-width: 300px;

    /* ─── Motion (§1.7) ──────────────────────────────────────────────────── */
    --motion-screen: 200ms;
    --motion-message: 180ms;
    --motion-dot: 120ms;
    --easing: cubic-bezier(0.2, 0, 0, 1);

    /* ─── Ширина мобильного макета ───────────────────────────────────────── */
    /* Клиент мобильный: на широком экране он остаётся колонкой телефона,
       а не растягивается на весь монитор (так же было в легаси-клиенте) */
    --app-max-width: 480px;
}

/* Inter вендорится (правило CLAUDE.md №18): переменное начертание одним
   файлом на кириллицу и латиницу — вместо пяти файлов на каждый вес */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../vendor/fonts/inter-cyrillic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../vendor/fonts/inter-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F,
        U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}


/* ─── Светлая тема (§1.0) ────────────────────────────────────────────────────
   Переопределяются только цвета: типографика, отступы, радиусы и градиенты от
   темы не зависят. Два селектора вместо одного — потому что тем три:
   «светлая» задаётся явным выбором (`data-theme="light"`), а «авто» отдаёт
   решение системе и срабатывает, только когда выбора не сделано. */

:root[data-theme="light"],
:root[data-theme="auto"] {
    color-scheme: light;

    --bg: #F4F4FA;
    --surface: #FFFFFF;
    --surface-elevated: #FFFFFF;
    /* Главное отличие светлой темы: белую карточку на светлом фоне держит
       бордер, а не разница светлоты */
    --border: #E3E3EE;
    --divider: #14141F14;
    --text: #14141F;
    --text-secondary: #5C5C78;
    --text-tertiary: #9A9AB2;

    /* На белом фиолетовый #7C3AED даёт контраст 5:1 — кнопке хватает, мелкому
       тексту нет, поэтому основной акцент темнее */
    --accent: #6D28D9;
    --accent-light: #7C3AED;
    --accent-violet: #7C3AED;

    --success: #16A34A;
    --success-light: #16A34A;
    --warning: #D97706;
    --error: #DC2626;
    --error-light: #DC2626;

    --input-bg: #FFFFFF;
    --button-disabled-bg: #E8E6F2;
    --button-disabled-text: #A3A0B8;

    --priority-urgent: #DC2626;
    --priority-high: #D97706;
    --priority-medium: #CA8A04;
    --priority-low: #64748B;

    --status-todo: #2563EB;
    --status-in-progress: #6D28D9;
    --status-done: #16A34A;
    --status-cancelled: #64748B;

    --request-draft: #64748B;
    --request-open: #D97706;
    --request-matched: #16A34A;
    --request-in-progress: #6D28D9;
    --request-done: #16A34A;
    --request-cancelled: #64748B;
    --request-expired: #9A9AB2;
}

/* Авто: следуем за системой. Значения ровно те же, что и у явной светлой —
   дублирование неизбежно, потому что CSS не умеет наследовать блок объявлений */
@media (prefers-color-scheme: light) {
    :root[data-theme="auto"] { color-scheme: light; }
}
@media (prefers-color-scheme: dark) {
    :root[data-theme="auto"] {
        color-scheme: dark;

        --bg: #0D0D14;
        --surface: #13131F;
        --surface-elevated: #1A1A2E;
        --border: #FFFFFF14;
        --divider: #FFFFFF0F;
        --text: #F0F0F8;
        --text-secondary: #8888A8;
        --text-tertiary: #5A5A7A;

        --accent: #7C3AED;
        --accent-light: #8B5CF6;
        --accent-violet: #A78BFA;

        --success: #22C55E;
        --success-light: #4ADE80;
        --warning: #F59E0B;
        --error: #EF4444;
        --error-light: #F87171;

        --input-bg: #1A1A2E;
        --button-disabled-bg: #2A1F4A;
        --button-disabled-text: #5A4A7A;

        --priority-urgent: #EF4444;
        --priority-high: #F59E0B;
        --priority-medium: #EAB308;
        --priority-low: #94A3B8;

        --status-todo: #60A5FA;
        --status-in-progress: #A78BFA;
        --status-done: #4ADE80;
        --status-cancelled: #94A3B8;

        --request-draft: #94A3B8;
        --request-open: #F59E0B;
        --request-matched: #4ADE80;
        --request-in-progress: #A78BFA;
        --request-done: #4ADE80;
        --request-cancelled: #94A3B8;
        --request-expired: #5A5A7A;
    }
}