/* ============================================================
   КАТАЛОГ: три зони (фільтри · результати · карта), картки, фасети.
   Макет за spec/05-ui-pages.md §2.
   ============================================================ */

.catalog{display:grid;grid-template-columns:280px 1fr;gap:var(--sp-5);align-items:start}
@media(max-width:1080px){.catalog{grid-template-columns:1fr}}

/* ---- Панель фільтрів ---- */
.filters{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto}
@media(max-width:1080px){
  .filters{position:static;max-height:none;display:none}
  .filters.is-open{display:block}
}
.filters__head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);margin-bottom:var(--sp-2)}
.filters__head h2{font-size:1.05rem;margin:0}

.facet{border-top:1px solid var(--line);padding:var(--sp-3) 0}
.facet:first-of-type{border-top:0}
.facet>summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;
               align-items:center;gap:8px;padding:2px 0}
.facet>summary::-webkit-details-marker{display:none}
.facet>summary::after{content:"▾";color:var(--muted);font-size:.8rem;transition:.15s}
.facet[open]>summary::after{transform:rotate(180deg)}
.facet__body{padding-top:var(--sp-2);display:flex;flex-direction:column;gap:2px}
.facet__body--chips{flex-direction:row;flex-wrap:wrap;gap:6px}

.opt{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.92rem;cursor:pointer;line-height:1.3}
.opt input{accent-color:var(--brand);width:16px;height:16px;flex:0 0 auto;margin:0}
.opt__count{margin-left:auto;color:var(--muted);font-size:.82rem;font-variant-numeric:tabular-nums}
.opt.is-empty{opacity:.45}
.opt.is-empty input:not(:checked){pointer-events:none}

.switchrow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 0;font-size:.92rem;cursor:pointer}
.switchrow input{accent-color:var(--brand);width:18px;height:18px;margin:0}

/* ---- Верхній рядок результатів ---- */
.catalog__bar{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.catalog__count{font-weight:700}
.catalog__bar .spacer{margin-left:auto}
.activechips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--sp-4)}
.filters-toggle{display:none}
@media(max-width:1080px){.filters-toggle{display:inline-flex}}

/* ---- Пагінація ---- */
.catalog__more{display:flex;justify-content:center;margin-top:var(--sp-6)}
.pager{display:flex;gap:8px;justify-content:center;margin-top:var(--sp-6);flex-wrap:wrap}
.pager a,.pager span{padding:8px 14px;border-radius:var(--r-sm);border:1.5px solid var(--line)}
.pager .is-current{background:var(--brand);color:#fff;border-color:var(--brand)}

/* ---- Карта (Leaflet + OSM, DEC-006) ---- */
.catalog{grid-template-columns:280px 1fr}
@media(min-width:1400px){.catalog{grid-template-columns:260px 1fr 360px}}

.catalog__map{position:sticky;top:80px;display:none}
@media(min-width:1400px){.catalog__map{display:block}}
.catalog__map .map{height:calc(100vh - 120px);min-height:420px}
.map__search{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:500;box-shadow:var(--shadow-2)}
.map__clear{position:absolute;top:12px;right:12px;z-index:500;background:var(--surface)}
.map__note{position:absolute;bottom:26px;left:12px;right:12px;z-index:500;margin:0;font-size:.78rem;
           background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 10px}

/* Перемикач «Список | Карта» — потрібен там, де карта не вміщається збоку */
.viewswitch{display:none;gap:4px;background:var(--brand-soft);padding:4px;border-radius:var(--r-pill)}
.viewswitch button{border:0;background:transparent;color:var(--muted);font:inherit;font-weight:600;
                   font-size:.85rem;padding:7px 14px;border-radius:var(--r-pill);cursor:pointer}
.viewswitch button[aria-selected="true"]{background:var(--brand);color:#fff}
@media(max-width:1399px){
  .viewswitch{display:flex}
  .catalog[data-active-view="map"] .catalog__results{display:none}
  .catalog[data-active-view="map"] .catalog__map{display:block;position:relative;top:auto}
  .catalog[data-active-view="map"] .map{height:70vh}
}
