/* ==========================================================================
   Listing template (kategorie.html, suche.html, angebote.html) – direction B:
   page head with count + sub-category chips, sticky filter column (bottom sheet
   below 1024px), toolbar (count · sort · per page · Liste/Raster), active filter
   chips, product rows (B2B default) or consumer cards, compact pager.
   Builds on components.css (.listing, .facets, .facet, .toolbar, .plist, .pgrid,
   .pager, .chip). Tokens only.
   ========================================================================== */

.lst-head{padding-top:var(--space-3)}
.lst-head h1{font-size:var(--text-32);letter-spacing:-0.02em;overflow-wrap:anywhere}
.lst-head .page-head__meta{font-variant-numeric:tabular-nums}
.lst-head__lead{margin-top:var(--space-2);max-width:70ch;color:var(--color-text)}
.lst-skel-count{display:inline-block;width:120px;vertical-align:middle}
.lst-chips{margin-top:var(--space-4)}
.lst-chips__list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:0;list-style:none}
.lst-chips__list .chip{min-height:36px;white-space:nowrap}

/* filter column */
.lst-facets .facet>summary{min-height:44px}
.lst-facets .facet__sel{max-width:10ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lst-fs{border:0;margin:0;padding:0;min-width:0;display:grid;gap:2px}
.facet__opt input:disabled{cursor:not-allowed}
.lst-facets[aria-busy="true"] .facet__n,.lst-drawer__body[aria-busy="true"] .facet__n{visibility:hidden}
.lst-facets[aria-busy="true"] .facet__body,.lst-drawer__body[aria-busy="true"] .facet__body{opacity:.6}
.lst-facet-skel{padding-top:var(--space-3)}
.lst-more{padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--color-border)}
.lst-facets__note{padding:var(--space-3) var(--space-4);font-size:var(--text-12);color:var(--color-muted);background:var(--color-surface-hover);border-top:1px solid var(--color-border)}
.lst-catlinks{display:grid;gap:0;margin:0;padding:0;list-style:none}
.lst-catlink{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);min-height:32px;color:var(--color-ink);text-decoration:none}
.lst-catlink:hover{text-decoration:underline}
.lst-catlink[aria-current="page"]{font-weight:var(--weight-bold)}
.lst-catlink .facet__n{color:var(--color-muted);font-size:var(--text-12);font-variant-numeric:tabular-nums}

/* toolbar */
.lst-toolbar{min-height:44px}
.lst-toolbar .toolbar__count{margin-right:auto;min-width:96px;font-variant-numeric:tabular-nums}
.lst-toolbar .seg button svg.i{width:16px;height:16px}
.lst-filter-btn .counter{margin-left:2px}
.lst-main{min-width:0}
.lst-main #lst-results{min-height:240px}

/* list/grid inside the template: the header row sits under the condensed header */
.lst .plist__head{--plist-sticky-top:var(--header-row-1)}

/* footer + pager */
.lst .list-foot{padding-top:var(--space-2)}
.lst .pager a,.lst .pager span{min-height:40px}
.lst .pager svg.i{width:16px;height:16px}

/* search without hits: recovery only (no empty filter column, toolbar or 2nd sourcing box) */
.lst--nohits .listing{grid-template-columns:minmax(0,1fr)}
.lst--nohits .lst-facets,.lst--nohits .lst-toolbar,.lst--nohits .sourcing,.lst--nohits .active-filters{display:none}
.lst-nohits{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-5);max-width:880px}
.lst-nohits > *{min-width:0}
.lst-nohits__box{justify-items:start}
.lst-nohits__title{font-size:var(--text-20)}
.lst-nohits__dym{font-size:var(--text-16);color:var(--color-ink)}
.lst-nohits__tips{margin:0;padding-left:var(--space-5);color:var(--color-text);display:grid;gap:var(--space-1)}
.lst-nohits__sub{font-size:var(--text-16);margin-bottom:var(--space-3)}

/* search prompt (suche.html without ?q) */
.lst-search{display:flex;gap:var(--space-2);max-width:720px;margin:var(--space-2) 0 var(--space-6)}
.lst-search .search__box{flex:1 1 auto;height:48px}
.lst-search .btn{min-height:48px}

/* bottom sheet */
.lst-drawer .facet:first-child>summary{padding-top:0}
.lst-drawer .facets__head{display:none}
.lst-drawer__body{padding:0}
.lst-drawer__body .facet>summary,.lst-drawer__body .facet__body{padding-left:var(--space-4);padding-right:var(--space-4)}

@media (max-width:1023px){
  .lst-toolbar .lst-per{display:none}
  .lst-toolbar .toolbar__count{flex:1 0 100%;margin-right:0}
}
@media (max-width:767px){
  .lst-head h1{font-size:var(--text-24)}
  .lst-chips__list{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter) 4px;scrollbar-width:none}
  .lst-chips__list::-webkit-scrollbar{display:none}
  .lst-chips__list .chip{flex:none}
  .lst-toolbar{gap:var(--space-2)}
  .lst-toolbar .lst-sort label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .lst-toolbar .lst-sort{flex:1 1 auto}
  .lst-toolbar .lst-sort .select{width:100%;height:var(--touch-min)}
  .lst-toolbar .lst-filter-btn{min-height:var(--touch-min)}
  .lst-toolbar .lst-view{display:none}
  .lst-search{flex-direction:column}
  .lst .pager{justify-content:center;width:100%}
  .lst .pager a span:not(.sr-only),.lst .pager span[aria-disabled] span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}