/* =========================================================================
   Дизайн-код #au_team – токены.
   Эталон – тема Scholaria (ojs/theme/styles/_tokens.less). Подробности,
   правила применения и запреты – в DESIGN-CODE.md.

   Тема переключается одним атрибутом на <html>:
     [data-theme="light"] / [data-theme="dark"] – явный выбор посетителя;
     без атрибута действует prefers-color-scheme.
   Тёмный набор поэтому задан дважды: по системной настройке и по атрибуту.
   ========================================================================= */

:root {
    color-scheme: light;

    /* Бренд */
    --brand:        #015D1E;
    --brand-hover:  #024E19;
    --brand-soft:   #E8F1EA;
    --on-brand:     #FFFFFF;

    /* Текст */
    --ink:          #1A1F1B;
    --ink-strong:   #0B0F0C;
    --muted:        #5F6B62;
    --muted-soft:   #8C968F;   /* не для смыслового текста: 3:1 на белом */

    /* Поверхности и линии */
    --surface:      #FFFFFF;
    --surface-2:    #F6F8F6;
    --surface-3:    #EDF1EE;
    --rule:         #D9DFDB;
    --rule-strong:  #B8C2BC;

    /* Тёплая подложка блока-сообщения (только фон) и состояния. */
    --accent-soft:  #FAF1DC;
    --danger:       #B42318;
    --success:      #027A48;

    /* Фокус */
    --focus:        #015D1E;
    --focus-ring:   0 0 0 3px rgba(1, 93, 30, 0.35);

    /* Тени */
    --shadow-1:     0 1px 2px rgba(15, 20, 17, 0.04), 0 1px 3px rgba(15, 20, 17, 0.06);
    --shadow-2:     0 4px 12px rgba(15, 20, 17, 0.08), 0 2px 4px rgba(15, 20, 17, 0.04);
    --shadow-3:     0 12px 32px rgba(15, 20, 17, 0.12), 0 4px 8px rgba(15, 20, 17, 0.06);

    /* Радиусы */
    --radius-sm:    4px;
    --radius:       8px;
    --radius-lg:    16px;
    --radius-pill:  999px;

    /* Отступы – шаг 4px */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  24px;
    --space-6:  32px;
    --space-7:  48px;
    --space-8:  64px;
    --space-9:  96px;

    /* Шрифты */
    --font-sans:  "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-mono:  "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Consolas, Menlo, monospace;

    /* Кегли. База – 18px (html { font-size: 18px }), значения в rem. */
    --text-12: 0.75rem;
    --text-14: 0.875rem;
    --text-16: 1rem;
    --text-18: 1.125rem;
    --text-20: 1.25rem;
    --text-24: 1.5rem;
    --text-30: 1.875rem;
    --text-36: 2.25rem;
    --text-48: 3rem;
    --text-60: 3.75rem;

    /* Интерлиньяж */
    --leading-tight: 1.2;
    --leading-snug:  1.35;
    --leading-base:  1.6;
    --leading-loose: 1.75;

    /* Мера строки и каркас */
    --measure:          72ch;
    --container:        1200px;
    --container-narrow: 760px;
    --header-h:         72px;
}

/* Телефон. Брейкпоинты в custom properties не выносятся (в @media они не
   работают), поэтому зафиксированы здесь списком:
     1024 – меню уходит под бургер, сайдбары складываются;
      900 – двухколоночные раскладки (архив, поиск, «Редакция») в одну;
      768 – мобильная шкала кеглей и отступов;
      640 – сетки 2–4 колонки в одну, подвал в столбик;
      480 – самые узкие подстройки (карточки архива, формы). */
@media (max-width: 768px) {
    :root {
        --header-h: 56px;
        --text-48: 2rem;
        --text-36: 1.75rem;
        --text-30: 1.5rem;
        --space-7: 32px;
        --space-8: 48px;
    }
}

/* -------------------------------------------------------------------------
   Тёмная тема. Палитра Scholaria; --danger и --success взяты из АЛЁНЫ:
   светлые значения дают на тёмном фоне 2.8:1 и 3.4:1 – ниже WCAG AA.
   ------------------------------------------------------------------------- */
:root[data-theme="dark"] {
    color-scheme: dark;

    --brand:        #4FB069;
    --brand-hover:  #6CC987;
    --brand-soft:   #0E2415;
    --on-brand:     #0B130D;

    --ink:          #E8ECE9;
    --ink-strong:   #FFFFFF;
    --muted:        #9AA59E;
    --muted-soft:   #6F7A73;

    --surface:      #0F1411;
    --surface-2:    #161D18;
    --surface-3:    #1F2822;
    --rule:         #2A332C;
    --rule-strong:  #3A4640;

    --accent-soft:  #2B2415;
    --danger:       #F1746A;
    --success:      #3FBF92;

    --focus-ring:   0 0 0 3px rgba(79, 176, 105, 0.4);

    --shadow-1:     0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-2:     0 4px 12px rgba(0, 0, 0, 0.45);
    --shadow-3:     0 12px 32px rgba(0, 0, 0, 0.55);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;

        --brand:        #4FB069;
        --brand-hover:  #6CC987;
        --brand-soft:   #0E2415;
        --on-brand:     #0B130D;

        --ink:          #E8ECE9;
        --ink-strong:   #FFFFFF;
        --muted:        #9AA59E;
        --muted-soft:   #6F7A73;

        --surface:      #0F1411;
        --surface-2:    #161D18;
        --surface-3:    #1F2822;
        --rule:         #2A332C;
        --rule-strong:  #3A4640;

        --accent-soft:  #2B2415;
        --danger:       #F1746A;
        --success:      #3FBF92;

        --focus-ring:   0 0 0 3px rgba(79, 176, 105, 0.4);

        --shadow-1:     0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 3px rgba(0, 0, 0, 0.3);
        --shadow-2:     0 4px 12px rgba(0, 0, 0, 0.45);
        --shadow-3:     0 12px 32px rgba(0, 0, 0, 0.55);
    }
}

/* Движение отключается целиком, если посетитель так попросил. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}
