/* МебелеФ v3 — pages/catalog.css. Основа: прототип D6 (assets/styles.css из mebelef-prototype.zip), дополнения — ниже метки «mebelef-v3». */
/* Filters */
.filterbar{display:flex;flex-direction:column;gap:var(--space-3)}
.filterbar__row{display:flex;gap:var(--space-2);overflow-x:auto;padding-bottom:2px}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(420px,92vw);background:var(--bg);box-shadow:var(--shadow-overlay);z-index:50;display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .2s ease}
.drawer[data-open="true"]{transform:none}
.drawer__head,.drawer__foot{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5)}
.drawer__head{justify-content:space-between;border-bottom:1px solid var(--line)}
.drawer__foot{border-top:1px solid var(--line)}
.drawer__body{flex:1;overflow-y:auto;padding:0 var(--space-5)}
.fgroup{border-bottom:1px solid var(--line);padding:var(--space-4) 0;display:flex;flex-direction:column;gap:var(--space-3)}
.fgroup__t{display:flex;justify-content:space-between;align-items:center;font-size:16px;font-weight:700;background:none;border:none;padding:0;width:100%;cursor:pointer}
.subcats{display:flex;gap:var(--space-2);overflow-x:auto;padding-bottom:2px}
.subcat{display:inline-flex;align-items:center;gap:10px;height:56px;padding:0 var(--space-4) 0 6px;background:var(--surface);border-radius:var(--radius-lg);font-size:14px;font-weight:600;white-space:nowrap}
.subcat:hover{background:var(--surface-2)}
.subcat .ph{width:44px;height:44px;border-radius:10px;flex:none}
/* ==== mebelef-v3: каталог ==== */
.subcat__img,.subcat .ph{width:44px;height:44px;border-radius:10px;flex:none;object-fit:cover}
.sortform{margin-left:auto;display:flex}
a.chip{color:var(--ink)}
a.chip--applied{background:var(--ink);border-color:var(--ink);color:var(--bg)}
a.chip--applied .icon{width:16px;height:16px}
.catalog__more{display:flex;flex-direction:column;gap:var(--space-4);align-items:center;margin-top:var(--space-6)}
/* Фильтр mebelef-core внутри drawer */
.drawer[data-open="false"]{visibility:hidden;transition:transform .2s ease,visibility 0s .2s}
.drawer[data-open="true"]{visibility:visible;transition:transform .2s ease}
.drawer__body{padding:0;display:flex;flex-direction:column;min-height:0}
.mebelef-product-filter{display:flex;flex-direction:column;flex:1;min-height:0}
.mebelef-pf-body{flex:1;overflow-y:auto;padding:0 var(--space-5)}
.fgroup__t{cursor:default}
.range .field{flex:1}
.range .field label{font-size:13px;color:var(--ink-muted);font-weight:400}
.range .input{height:44px}
.check{line-height:1.3}
/* ==== Шапка категории ==== */
.cathero{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4);border-radius:var(--radius-xl);background:var(--hero)}
@media(min-width:768px){.cathero{gap:var(--space-8);padding:var(--space-6) var(--space-8)}}
.cathero__text{display:flex;flex-direction:column;gap:var(--space-2);flex:1;min-width:0}
.cathero__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-4);font-size:14px}
.cathero__eta{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.cathero__eta .icon{width:18px;height:18px}
.cathero__img{display:none}
@media(min-width:768px){
.cathero__img{display:block;flex:none;width:170px;padding:var(--space-2);border-radius:var(--radius-lg);background:var(--bg)}
.cathero__img img{width:100%;height:92px;object-fit:contain}
}
/* ==== Баннеры-врезки в сетке товаров ==== */
/* Две колонки в ширину и ровно в высоту фото товара: при квадратном
   кадре это отношение почти не зависит от числа колонок (~2,25). */
.gridbanner{grid-column:span 2;align-self:start;display:flex;flex-direction:column;justify-content:center;gap:var(--space-4);aspect-ratio:2.25;min-height:200px;padding:var(--space-5);border-radius:var(--radius-xl);background:var(--accent);color:var(--ink)}
@media(min-width:768px){.gridbanner{padding:var(--space-6) var(--space-8)}}
.gridbanner__in{display:flex;flex-direction:column;gap:var(--space-2)}
.gridbanner__k{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.gridbanner__t{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em}
@media(min-width:768px){.gridbanner__t{font-size:26px}}
.gridbanner__d{font-size:15px;line-height:1.45}
.gridbanner__cta{align-self:flex-start}
a.gridbanner:hover .gridbanner__cta{background:var(--cta-hover)}
/* На всю ширину: текст и кнопка в строку, фон спокойнее */
.gridbanner--full{grid-column:1/-1;aspect-ratio:auto;min-height:0;background:var(--surface);border:1px solid var(--line)}
@media(min-width:768px){
.gridbanner--full{flex-direction:row;align-items:center;gap:var(--space-8)}
.gridbanner--full .gridbanner__in{flex:1}
.gridbanner--full .gridbanner__cta{align-self:center;flex:none}
}
/* Баннер-картинка: надписи на самом изображении, тема ничего не рисует поверх */
.gridbanner--pic{padding:0;overflow:hidden;background:var(--surface-2);border:0}
.gridbanner--pic.gridbanner--full{aspect-ratio:1024/200;min-height:120px}
.gridbanner__pic{width:100%;height:100%;object-fit:cover}