/* ═══════════════════════════════════════════════════════════════
   mobile-catalog.css — мобильный каталог (03.10.2026).
   Разметку строит js/mobile-catalog.js. Только телефон (≤768px).
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:768px){
  /* Шапка с логотипом уезжает при прокрутке, липкой остаётся строка поиска */
  .mob-header{position:relative!important}

  .mc-top{position:sticky;top:0;z-index:120;display:flex;gap:8px;align-items:center;
    padding:8px 16px;background:#fff}
  .mc-search{flex:1;min-width:0;position:relative;margin:0}
  .mc-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;
    fill:none;stroke:var(--gr400);stroke-width:2;stroke-linecap:round;pointer-events:none}
  .mc-search input{width:100%;height:44px;border:none;border-radius:12px;background:var(--gr50);
    padding:0 12px 0 40px;font:400 16px/1 var(--font-text,'Inter',sans-serif);color:var(--gr800);outline:none;-webkit-appearance:none}
  .mc-search input:focus{background:#fff;box-shadow:inset 0 0 0 1.5px var(--g700)}
  .mc-search input::placeholder{color:var(--gr400)}

  .mc-filter{position:relative;flex:none;width:44px;height:44px;border-radius:12px;border:none;background:var(--gr50);
    color:var(--gr800);display:flex;align-items:center;justify-content:center;cursor:pointer}
  .mc-filter svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
  .mc-filter.on{background:var(--g800);color:#fff}
  .mc-filter-n{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
    background:#fff;color:var(--g800);border:1.5px solid var(--g800);font:700 11px/15px var(--font-text,'Inter',sans-serif);text-align:center}

  /* Категории — те же таблетки, что на сайте (.pill-tab), чуть ниже */
  /* overflow-x с !important: mobile.css глушит прокрутку всем div (overflow-x:hidden!important) */
  .mc-cats{display:flex;gap:6px;overflow-x:auto!important;overflow-y:hidden;max-width:none!important;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    padding:2px 16px 10px;background:#fff;border-bottom:1px solid var(--gr100)}
  .mc-cats::-webkit-scrollbar{display:none}
  .mc-cat{flex:none;height:34px;padding:0 14px;border-radius:100px;border:1.5px solid var(--gr200);background:#fff;
    color:var(--gr600);font:600 14px/31px var(--font-text,'Inter',sans-serif);text-decoration:none;white-space:nowrap}
  .mc-cat.on{background:var(--g800);border-color:var(--g800);color:#fff}

  /* Количество + сортировка одной строкой */
  .mc-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px 10px}
  .mc-subscribe{width:calc(100% - 32px);margin:0 16px 12px;justify-content:center;height:40px;font-size:13.5px!important}
  .mc-count{font:700 15px/1.2 var(--font-display,'Geologica',sans-serif);color:var(--gr800)}
  .mc-sort{position:relative;display:flex;align-items:center;color:var(--g700)}
  .mc-sort select{appearance:none;-webkit-appearance:none;border:none;background:transparent;padding:4px 20px 4px 0;
    font:600 14px/1.2 var(--font-text,'Inter',sans-serif);color:var(--g700);cursor:pointer;text-align:right}
  .mc-sort svg{position:absolute;right:0;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}

  /* ── Шторка фильтров: панель без своей рамки, разделителей и второго заголовка ── */
  .bottom-sheet{padding-bottom:0!important}
  .bs-header{gap:16px}
  .bs-header .bs-title{flex:1;font-size:18px}
  .bs-reset{background:none;border:none;padding:0;font:600 14px/1 var(--font-text,'Inter',sans-serif);color:var(--g700);cursor:pointer}
  #bs-content .filter-panel{border:none;border-radius:0;padding:4px 0 8px;background:none;overflow:visible}
  #bs-content .filter-header{display:none}
  #bs-content .filter-group{padding:16px 0 4px;border:none}
  #bs-content .filter-group-title{text-transform:none;letter-spacing:0;font:700 16px/1.3 var(--font-display,'Geologica',sans-serif);color:var(--gr800);margin-bottom:10px}
  #bs-content .filter-check{padding:6px 0}
  .bs-apply{border-top:none!important;box-shadow:0 -6px 16px rgba(0,0,0,.06);padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}

  /* Старые блоки, которые заменены строкой выше */
  .catalog-main .sort-bar{display:none!important}
}
