/* ==============================================================================
   app/static/css/shared.css

   CSS-аудит, §05/§06 (P106/P107) — единственный CSS-файл, подключаемый ВСЕМИ
   ТРЕМЯ layout'ами (кабинет — base.html, гостевой — auth_layout.html,
   публичный — public/base.html). НЕ первый шаг общей миграции токенов
   (аудит, P001, "большой взрыв" явно исключён этой же задачей) — сознательно
   узкий: только МЕХАНИЗМ двух компонентов, которые раньше были реализованы
   ДВАЖДЫ, независимо, для кабинета и публичного сайта — кнопки (контур +
   инверсия цвета на hover) и баннеры/flash-сообщения (единая формула
   высоты/отступов).

   Правила здесь ПАРАМЕТРИЗОВАНЫ переменными (--wod-btn-color,
   --wod-btn-padding-y/x, --wod-btn-height и т.д.) — САМИ значения этих
   переменных остаются локальными за каждым layout'ом (design-system.css у
   кабинета, инлайн-<style> у public/base.html): кабинет и публичный сайт
   продолжают выглядеть по-разному (разная плотность/палитра — сознательно,
   см. ТЗ), одинакова только ФОРМА правила. --wod-border-width/--wod-radius —
   единственные ДВЕ переменные, которые здесь заданы буквально (:root) — обе
   и так уже были ЧИСЛЕННО одинаковы в обеих системах (1px/4px), различий во
   внешнем виде это не меняет, только устраняет два независимых литерала.
   ============================================================================== */

:root {
    --wod-border-width: 1px;
    --wod-radius: 4px;
    /* Высота баннера = 1.25x высоты кнопки; отступ = 0.5x высоты баннера —
       формула ОДНА, а --wod-btn-height каждый layout вычисляет сам, из
       СВОИХ размеров кнопки (font-size/padding) — см. design-system.css
       (кабинет) и public/base.html (публичный сайт) за конкретными
       формулами. Смена --wod-border-width здесь одна меняет оба btn-height,
       а значит и оба alert-height/margin — единственная реально общая
       точка правки на оба layout'а разом (см. проверку в комментарии
       коммита этой задачи). */
    --wod-alert-height: calc(1.25 * var(--wod-btn-height));
    --wod-alert-margin: calc(0.5 * var(--wod-alert-height));
}

/* ------------------------------------------------------------------------
   КНОПКИ — контур (прозрачный фон, рамка+текст цветом --wod-btn-color) с
   инверсией в залитую при hover (фон --wod-btn-color, текст
   --wod-btn-invert-color, по умолчанию белый). Раньше эта ЛОГИКА была
   написана дважды: design-system.css (кабинет, семантические цвета через
   --wod-btn-color) и public/base.html (публичный сайт, --wod-blue/белый
   захардкожены под ровно два варианта). Список классов ниже — ОБЪЕДИНЕНИЕ
   вариантов из обеих систем (кабинетные btn-primary/…/btn-wod + публичные
   btn-light/btn-outline-light) — лишние для конкретной страницы селекторы
   просто ничего не находят, вреда нет. .btn-link НЕ включён (никогда не
   был частью этого паттерна ни в одной из систем — обычная Bootstrap-ссылка,
   не контурная кнопка).
   ------------------------------------------------------------------------ */
.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-wod,
.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
.btn-outline-warning, .btn-outline-info, .btn-light, .btn-outline-light {
    background-color: transparent !important;
    border-style: solid !important;
    border-width: var(--wod-border-width) !important;
    border-radius: var(--wod-radius) !important;
    border-color: var(--wod-btn-color) !important;
    color: var(--wod-btn-color) !important;
    padding: var(--wod-btn-padding-y) var(--wod-btn-padding-x) !important;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn-primary:hover, .btn-secondary:hover, .btn-success:hover, .btn-danger:hover,
.btn-warning:hover, .btn-info:hover, .btn-wod:hover,
.btn-outline-primary:hover, .btn-outline-secondary:hover, .btn-outline-success:hover,
.btn-outline-danger:hover, .btn-outline-warning:hover, .btn-outline-info:hover,
.btn-light:hover, .btn-outline-light:hover {
    background-color: var(--wod-btn-color) !important;
    /* Публичный "light"-вариант — единственный, где цвет текста на hover
       ДРУГОЙ, не белый (белая заливка на hover требует тёмного текста,
       не белого-на-белом) — см. --wod-btn-invert-color, переопределяется
       ТОЛЬКО у .btn-light/.btn-outline-light в public/base.html. */
    color: var(--wod-btn-invert-color, #fff) !important;
}

/* ------------------------------------------------------------------------
   БАННЕРЫ / FLASH-СООБЩЕНИЯ — раньше отдельная, вручную посчитанная копия
   у публичного сайта (min-height:60px/margin:30px, custom.css) рядом с
   формульной версией кабинета (design-system.css) — теперь одно правило,
   один --wod-alert-height/--wod-alert-margin (см. :root выше), больше не
   нужен отдельный body.wod-public-скоуп: у каждой страницы своё
   --wod-btn-height, это правило просто читает то, что уже в области
   видимости.
   ------------------------------------------------------------------------ */
.alert:not(.d-none) {
    display: flex !important;
    align-items: center !important;
    min-height: var(--wod-alert-height) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: var(--wod-alert-margin) !important;
    margin-bottom: var(--wod-alert-margin) !important;
}
.alert:not(.d-none) + .alert:not(.d-none) {
    margin-top: 0 !important;
}
.alert:not(.d-none):has(+ .alert:not(.d-none)) {
    margin-bottom: 0 !important;
}