/* zvk-buttons.css — кнопки сайта в едином стиле, три варианта (27.10.2026).
   Слова владельца: «Выведи кнопки в единый стиль на сайте, максимум три варианта кнопок».

   1. Основная  — мятная заливка #00E5A4, чёрный текст.
   2. Тёмная    — заливка #0a0a0a, белый текст.
   3. Контурная — без заливки, рамка 1px цветом текста: на светлом фоне чёрная, на тёмном — белая
      (цвет текста остаётся от раздела, рамка берёт его через currentColor).
   У всех: пилюля, Inter 600 16px, высота от 48px (в подвале и в узких местах — 44px), поля 24px,
   одинаковые наведение, нажатие и рамка фокуса с клавиатуры.

   Страницы сверстаны отдельно и у каждой свои классы кнопок, поэтому здесь классы сводятся
   к трём вариантам селекторами, а не переписыванием разметки. Подключать на всех страницах
   ПЕРЕД mobile.css: там на телефоне поля 22px и кегль под zvk-btn-fit.js.
   Не кнопки (сюда не входят): плитки магазинов на страницах книг (.btn-store — фирменные цвета площадок,
   решение 20.10.2026, book-page.css), чипы и фильтры (.lg-chip, .kp__chip, .category-btn, .pp-jump),
   выпадающие списки форм (.zvk-sel__btn, .ar-select__btn), плитки и карточки-ссылки, ссылки
   «Подробнее →», переключатели калькуляторов, баннер cookie, подпись varganov-web, админка.
   Проверка: python dev/tests/buttons.py — на страницах нет кнопок вне трёх вариантов. */

/* ---------- общее для всех трёх ---------- */
:root body :is(
    .btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .lm__btn, .btn-attend,
    .book-card__btn-details, .product-card__btn-details, .btn-details, .speaker-link, .pb-btn, .pl__btn, .pl__soc,
    .zvk-map__btn, .zvk-footer__vac-link, .zvk-sub__btn
) {
    display: inline-flex !important; align-items: center !important; justify-content: center;
    min-height: 48px; box-sizing: border-box;
    padding: 11px 24px !important;
    border-radius: 999px !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-size: 16px !important; font-weight: 600 !important; line-height: 1.2 !important;
    letter-spacing: 0 !important; text-transform: none !important; text-decoration: none !important;
    box-shadow: none !important; background-image: none !important;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease !important;
}
:root body :is(
    .btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .lm__btn, .btn-attend,
    .book-card__btn-details, .product-card__btn-details, .btn-details, .speaker-link, .pb-btn, .pl__btn, .pl__soc,
    .zvk-map__btn, .zvk-footer__vac-link, .zvk-sub__btn
):is(:hover, :focus-visible) { transform: translateY(-1px); box-shadow: none !important; }
:root body :is(
    .btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .lm__btn, .btn-attend,
    .book-card__btn-details, .product-card__btn-details, .btn-details, .speaker-link, .pb-btn, .pl__btn, .pl__soc,
    .zvk-map__btn, .zvk-footer__vac-link, .zvk-sub__btn
):active { transform: translateY(0); }
:root body :is(
    .btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .lm__btn, .btn-attend,
    .book-card__btn-details, .product-card__btn-details, .btn-details, .speaker-link, .pb-btn, .pl__btn, .pl__soc,
    .zvk-map__btn, .zvk-footer__vac-link, .zvk-sub__btn
):focus-visible { outline: 2px solid #00B884 !important; outline-offset: 3px !important; }
:root body :is(.btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn)::before,
:root body :is(.btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn)::after {
    /* блики, «волны» и градиентные подложки страниц — не часть стиля кнопки */
    background-image: none;
}
:root body :is(.btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .btn-details, .pb-btn):disabled,
:root body :is(.btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn).is-loading {
    opacity: .55; cursor: default; transform: none;
}

/* ---------- 1. Основная: мята ---------- */
:root body :is(
    .btn--green, .btn--mint, .btn--primary, .btn--tag-outline, .btn--topics-more, .hero__main-cta,
    .ev-btn--mint, .bp-btn--mint, .bp-btn--gift, .tr-btn--mint, .zr__btn--mint, .ar-hero__btn--mint, .rv-btn--mint,
    .speaker-link, .pl__btn, .zvk-footer__vac-link, .zvk-sub__btn
),
:root body .btn:not([class*="btn--"]) {
    background-color: #00E5A4 !important; color: #0a0a0a !important;
    border: 1px solid #00E5A4 !important;
}
:root body :is(
    .btn--green, .btn--mint, .btn--primary, .btn--tag-outline, .btn--topics-more, .hero__main-cta,
    .ev-btn--mint, .bp-btn--mint, .bp-btn--gift, .tr-btn--mint, .zr__btn--mint, .ar-hero__btn--mint, .rv-btn--mint,
    .speaker-link, .pl__btn, .zvk-footer__vac-link, .zvk-sub__btn
):hover,
:root body .btn:not([class*="btn--"]):hover {
    background-color: #00CF94 !important; border-color: #00CF94 !important; color: #0a0a0a !important;
}
:root body :is(.btn--green, .btn--mint, .btn--primary, .ev-btn--mint, .bp-btn--mint, .tr-btn--mint, .zr__btn--mint, .ar-hero__btn--mint) :is(svg, i) {
    color: #0a0a0a !important;
}

/* ---------- 2. Тёмная ---------- */
:root body :is(.btn--dark, .btn--dzen, .ev-btn--dark, .book-card__btn-details, .product-card__btn-details, .zvk-map__btn) {
    background-color: #0a0a0a !important; color: #fff !important;
    border: 1px solid #0a0a0a !important;
}
:root body :is(.btn--dark, .btn--dzen, .ev-btn--dark, .book-card__btn-details, .product-card__btn-details, .zvk-map__btn):hover {
    background-color: #2a2a2a !important; border-color: #2a2a2a !important; color: #fff !important;
}

/* ---------- 3. Контурная: рамка цветом текста ---------- */
:root body :is(
    .btn--outline, .btn--ghost, .btn--ghost-light, .btn--light, .bp-btn--ghost, .ar-hero__btn--ghost, .zr__btn--ghost,
    .tr-btn--line, .rv-btn--line, .ev-btn--line, .btn-details, .pb-btn, .pl__soc
) {
    background-color: transparent !important;
    border: 1px solid currentColor !important;
}
/* на светлом фоне — чёрная; на тёмном цвет текста белый задан разделом и остаётся */
:root body :is(.btn--outline, .bp-btn--ghost, .ar-hero__btn--ghost, .tr-btn--line, .pl__soc) { color: #0a0a0a !important; }
:root body :is(.btn--ghost, .btn--ghost-light, .btn--light, .zr__btn--ghost, .btn-details, .pb-btn) { color: #fff !important; }
:root body :is(
    .btn--outline, .bp-btn--ghost, .ar-hero__btn--ghost, .tr-btn--line, .pl__soc
):hover { background-color: rgba(10, 10, 10, .06) !important; }
:root body :is(.btn--ghost, .btn--ghost-light, .btn--light, .zr__btn--ghost, .btn-details, .pb-btn):hover {
    background-color: rgba(255, 255, 255, .1) !important;
}

/* ---------- компактная 44px: подвал, подписка, кнопка карты ---------- */
:root body :is(.zvk-footer__vac-link, .zvk-sub__btn, .zvk-map__btn) {
    min-height: 44px; padding-top: 10px !important; padding-bottom: 10px !important; font-size: 15px !important;
}

@media (prefers-reduced-motion: reduce) {
    :root body :is(.btn, .ev-btn, .bp-btn, .rv-btn, .tr-btn, .zr__btn, .ar-hero__btn, .pp-btn, .btn-details, .pb-btn,
        .speaker-link, .pl__btn, .pl__soc, .zvk-map__btn, .zvk-footer__vac-link, .zvk-sub__btn):is(:hover, :focus-visible) { transform: none; }
}
