/* ════════════════════════════════════════════════════════════════════════════
 * patch-7.0-cat-stock.css
 *
 * Фильтр «Наличие» в шапке категории — два чекбокса (В наличии / Под заказ),
 * multi-select по паттерну Цвета (data-kp-fpill-multi).
 *
 * URL: ?filter_stock=instock,ondemand (CSV). Backend в catalog-filter.php:
 * условие добавляется только при ровно 1 выбранном (0/2 = всё доступное).
 *
 * Архитектура дропа:
 *   <div class="kp-cat-fpill-drop kp-cat-fpill-drop--stock" data-kp-fpill-drop>
 *     <div class="kp-cat-fpill-stock-list">
 *       <button class="kp-cat-fpill-stock [is-selected]"
 *               data-kp-fpill-input="filter_stock"
 *               data-kp-fpill-value="instock|ondemand"
 *               data-kp-fpill-multi>
 *         <span class="kp-cat-fpill-stock-check"></span>
 *         <span class="kp-cat-fpill-stock-name">В наличии</span>
 *         <span class="kp-cat-fpill-stock-count">12152</span>
 *       </button>
 *       … вторая строка …
 *     </div>
 *     <div class="kp-cat-fpill-drop-foot"> Сбросить · Применить </div>
 *   </div>
 *
 * ВАЖНО (баг Цвета не повторяем):
 *   На модификаторе .kp-cat-fpill-drop--stock НЕ задаём display:flex/grid —
 *   только min-width / padding. Видимость гейтит базовое правило
 *   patch-6.9:48 (display:none) и .is-open .kp-cat-fpill-drop {display:block}.
 *   Внутри списка/футера flex задаётся НЕ на самом дропе, а на .stock-list /
 *   .drop-foot — они не отвечают за видимость родителя.
 *
 * Скоуп: body.kp-body .kp-cat-fpill-stock* / .kp-cat-fpill-drop--stock.
 * ════════════════════════════════════════════════════════════════════════════ */

/* Ширина дропа — компактнее Цвета (нужны только 2 строки). display не трогаем. */
body.kp-body .kp-cat-fpill-drop--stock {
    min-width: 260px;
}

/* Список чекбоксов: вертикально, с отступами. flex-on-list ОК — не влияет
 * на видимость самого drop'а. */
body.kp-body .kp-cat-fpill-stock-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
}

/* Строка-кнопка чекбокса. Подложка как .kp-cat-fpill-color: нейтрально/желтоватая
 * при выбранном. clickable вся строка целиком. */
body.kp-body .kp-cat-fpill-stock {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    transition: background .15s;
    font-family: inherit;
    text-align: left;
    width: 100%;
    -webkit-appearance: none;
    appearance: none;
}
body.kp-body .kp-cat-fpill-stock:hover {
    background: var(--fog, #f5f5f5);
}
body.kp-body .kp-cat-fpill-stock.is-selected {
    background: var(--yellow-soft, #fff8d6);
}

/* Квадратик-чекбокс слева. Имитирует нативный checkbox без <input>: квадрат +
 * галочка через ::after при .is-selected. Тёмная заливка при выборе. */
body.kp-body .kp-cat-fpill-stock-check {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1.5px solid var(--line, #e5e5e5);
    background: #fff;
    box-sizing: border-box;
    position: relative;
    transition: background .15s, border-color .15s;
}
body.kp-body .kp-cat-fpill-stock.is-selected .kp-cat-fpill-stock-check {
    background: var(--ink, #0a0a0a);
    border-color: var(--ink, #0a0a0a);
}
body.kp-body .kp-cat-fpill-stock.is-selected .kp-cat-fpill-stock-check::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
}

/* Имя варианта — тянется на свободное место (счётчик прижат справа). */
body.kp-body .kp-cat-fpill-stock-name {
    flex: 1 1 auto;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink-2, #6b6b6b);
    line-height: 1.2;
}
body.kp-body .kp-cat-fpill-stock.is-selected .kp-cat-fpill-stock-name {
    color: var(--ink, #0a0a0a);
    font-weight: 700;
}

/* Счётчик справа — приглушённый, чуть мельче. */
body.kp-body .kp-cat-fpill-stock-count {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-3, #a0a0a0);
    font-variant-numeric: tabular-nums;
}
body.kp-body .kp-cat-fpill-stock.is-selected .kp-cat-fpill-stock-count {
    color: var(--ink-2, #6b6b6b);
}

/* Mobile ≤760: дроп уже на всю ширину контейнера через patch-6.9:150-156.
 * Дополнительных правил не нужно — list-колонка адаптируется сама. */