/* ════════════════════════════════════════════════════════════════════════════
 * PATCH 11.3 — Мобильный фильтр каталога: выпадашки больше не обрезаются.
 *
 * БАГ (ROADMAP 23.06, «фильтр карточек не работает»):
 *   На ≤760px .kp-cat-fbar-left имел overflow-x:auto + flex-wrap:nowrap
 *   (горизонтальный скролл пилюль, patch-5.1:868). overflow-x:auto создаёт
 *   clipping-контекст (по спецификации overflow-y тоже становится auto) →
 *   абсолютная выпадашка .kp-cat-fpill-drop обрезалась по высоте и уезжала
 *   за правый край экрана. Вдобавок мобильное правило left:0;right:0
 *   (patch-6.9:151) анкерилось к УЗКОЙ пилюле, а не к контейнеру.
 *   Итог: тап по пилюле → она желтела (is-open), но панель выбора была
 *   невидима → пользователь видел «кнопка просто желтеет, фильтр не работает».
 *   Подтверждено в браузере на 390px: drop.right=480 при ширине вьюпорта 390.
 *
 * ФИКС:
 *   • Пилюли переносятся (flex-wrap:wrap, overflow:visible) — нет clipping.
 *   • Выпадашка анкерится к полноширинному .kp-cat-fbar-inner (а не к пилюле)
 *     и раскрывается панелью во всю ширину ПОД баром: left:0/right:0 → панель
 *     никогда не уходит за экран и не обрезается.
 *   • z-index поднят над плавающим виджетом мессенджеров (.cw, z-index:50).
 *   • «Применить» во всю ширину — крупный тач-таргет, не прячется под виджет.
 *
 * «ВСЕ ФИЛЬТРЫ» (.kp-cat-fpill-all) скрыта: при wrap все пилюли и так видны,
 * а кнопка лишь желтела без визуального эффекта (источник жалобы Nick).
 * Полноценная единая «панель всех фильтров» (стиль illan) — отдельная задача.
 *
 * Скоуп строго .kp-cat-* / [data-kp-fpill-*]. patch-5.1 / 6.9 не редактируем
 * (перекрываем порядком загрузки + равной/большей специфичностью).
 * ════════════════════════════════════════════════════════════════════════════ */

/* «ВСЕ ФИЛЬТРЫ» — нефункциональная кнопка (только желтела). Скрываем везде:
 * на десктопе и планшете пилюли и так умещаются (flex-wrap:wrap, patch-5.1:198),
 * на мобиле — переносятся (см. ниже). */
body.kp-body .kp-cat-fpill-all {
    display: none;
}

@media (max-width: 760px) {

    /* 1. Пилюли переносятся в строки; контейнер НЕ клиппит выпадашки. */
    body.kp-body .kp-cat-fbar-left {
        flex-wrap: wrap;
        overflow: visible;
        row-gap: 8px;
        padding-bottom: 0;
    }

    /* 2. Анкер выпадашки — полноширинный inner, не узкая пилюля.
     *    (.kp-cat-fpill[data-kp-fpill-toggle] держал position:relative —
     *    перебиваем тем же селектором, равная специфичность + порядок ниже.) */
    body.kp-body .kp-cat-fbar-inner {
        position: relative;
    }
    body.kp-body .kp-cat-fpill[data-kp-fpill-toggle] {
        position: static;
    }

    /* 3. Выпадашка (и обычная, и «Цвет» — у обеих класс .kp-cat-fpill-drop) —
     *    панель во всю ширину под баром, поверх виджета мессенджеров (.cw=50).
     *    display НЕ трогаем: открытие управляется .is-open в patch-6.9. */
    body.kp-body .kp-cat-fpill .kp-cat-fpill-drop {
        left: 0;
        right: 0;
        top: 100%;
        margin-top: 6px;
        min-width: 0;
        max-width: none;
        z-index: 60;
    }

    /* 4. «Применить» во всю ширину — не прячется под плавающий виджет. */
    body.kp-body .kp-cat-fpill-drop-foot {
        flex-wrap: wrap;
        row-gap: 10px;
    }
    body.kp-body .kp-cat-fpill-apply {
        width: 100%;
        margin-left: 0;
    }
}