/* ============================================================================
   tokens.css — ЕДИНЫЙ СЛОВАРЬ значений внешнего вида для всего движка.
   ----------------------------------------------------------------------------
   Это НЕ правила, а переменные. Здесь нет ни одного селектора, который матчит
   виджет, поэтому файл физически ничего не переопределяет и не участвует в
   каскад-войнах (см. архитектурное решение: каждый Widgets/*.css сам за себя —
   комментарии в Button.css/Field.css). Виджеты лишь ЧИТАЮТ эти значения через
   var(--token, фолбэк): если файл не подключён, каждый виджет работает на своём
   фолбэке, как раньше. Это продолжение уже существующего приёма --spacing/
   --font-size (form-renderer.js), только теперь полный набор: цвет + геометрия.

   Сменить бренд-цвет всего приложения = одна строка --accent ниже.
   Подключать ПЕРВЫМ, до всех остальных стилей (см. <link> в *.html).

   Переопределение вниз по дереву (форма/группа/виджет) работает штатно: инлайн
   на контейнере (напр. form-renderer ставит --accent на форму) побеждает :root
   только для своего поддерева — остальное приложение не затронуто.
   ========================================================================== */

:root
{
    /* --- бренд (единственное, что обычно хочется крутить) --- */
    --accent:        #2563eb;   /* был #0078d7 — тот же синий, спокойнее */
    --accent-strong: #1d4ed8;   /* hover/нажатие */
    --accent-tint:   #eaf1ff;   /* подсветка/выделение/hover-фон */
    --accent-ink:    #ffffff;   /* текст/иконка НА акценте — НЕ инвертируется в тёмной */

    /* --- нейтраль --- */
    --page-bg:    #eef1f7;
    --app-bg:     linear-gradient(135deg, #2563eb 0%, #4f46e5 100%);  /* фон-подложка страниц и экранов входа (НЕ заливка виджетов — для них --page-bg) */
    --card:       #ffffff;
    --surface:    #f4f6fb;      /* лёгкие заливки, disabled-инпуты */
    --ink:        #1b2430;      /* основной текст (почти чёрный с синим уклоном) */
    --ink-soft:   #334155;
    --muted:      #64748b;      /* второстепенный текст/подписи */
    --muted-soft: #94a3b8;
    --line:       #e3e8f1;      /* тонкие разделители */
    --field:      #f6f8fc;      /* фон readonly-поля */
    --field-line: #d4dbe7;      /* рамка поля/контрола */

    /* --- состояния --- */
    --disabled:     #eef1f5;
    --disabled-ink: #9aa6b6;

    /* --- семантика (отдельно от бренд-акцента) --- */
    --ok:          #1f7a4d;
    --danger:      #b42318;
    --danger-tint: #fdeeec;

    /* --- эффекты --- */
    --overlay:      rgba(16,23,33,.55);   /* подложка модалок */
    --shadow-color: rgba(16,24,40,.12);   /* цвет теней */

    /* --- геометрия --- */
    --radius: 10px;    /* единое скругление всего UI (кнопки, поля, карточки, модалки) */

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

    /* --- дефолты форм (переопределяются каждой формой инлайном, см.
           form-renderer.js:73-91). Здесь — единый базовый этаж. --- */
    --spacing:   10px;
    --font-size: 14px;
}

/* Тёмная тема — переопределяем ТОЛЬКО значения, имена те же.
   По системе (prefers-color-scheme); переключатель в UI добавим позже. */
@media (prefers-color-scheme: dark)
{
    :root
    {
        --accent:        #4b86f7;
        --accent-strong: #3b82f6;
        --accent-tint:   #18263f;
        /* --accent-ink остаётся #ffffff */

        --page-bg:    #0e131b;
        --app-bg:     linear-gradient(135deg, #10214a 0%, #1e1b4b 100%);  /* тёмный вариант подложки */
        --card:       #161d27;
        --surface:    #1b2330;
        --ink:        #e7ecf4;
        --ink-soft:   #c2ccda;
        --muted:      #93a1b5;
        --muted-soft: #6b7a8f;
        --line:       #273142;
        --field:      #121a24;
        --field-line: #2c3a4c;

        --disabled:     #1b2330;
        --disabled-ink: #5f6e82;

        --ok:          #4caf7d;
        --danger:      #e5604f;
        --danger-tint: #2a1715;

        --overlay:      rgba(0,0,0,.6);
        --shadow-color: rgba(0,0,0,.45);
    }
}