/* Libre · filtri del catalogo. Solo variabili di tokens.css (con i valori di riserva).
   Desktop (oltre 1100 px): colonna a sinistra della griglia, che passa a 3 colonne.
   Telefono e tablet: pannello dal basso, aperto dal pulsante "Filtri" nella barra del catalogo. */

.lf{--lf-line:var(--line,#E2D7C8);--lf-ink:var(--ink,#1F1B17);--lf-soft:var(--soft,#5A5047);--lf-red:var(--red,#9C1B30);--lf-paper:var(--paper,#FBF8F3);--lf-stone:var(--stone,#D8CAB6);font-family:var(--sans,"Jost",system-ui,sans-serif)}
.lf-form{margin:0}
.lf-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.lf-tit{margin:0;font:600 12px/1.4 var(--sans,"Jost",system-ui,sans-serif);letter-spacing:.24em;text-transform:uppercase;color:var(--lf-ink)}
.lf-chiudi{display:none}

/* gruppi */
.lf-g{border-top:1px solid var(--lf-line)}
.lf-g:last-child{border-bottom:1px solid var(--lf-line)}
.lf-g>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0;font:600 11px/1.3 var(--sans,"Jost",system-ui,sans-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--lf-ink)}
.lf-g>summary::-webkit-details-marker{display:none}
.lf-g>summary::after{content:"+";font:300 20px/1 var(--sans,"Jost",system-ui,sans-serif);transition:transform .3s var(--ease,ease)}
.lf-g[open]>summary::after{transform:rotate(45deg)}
.lf-gb{padding:0 0 18px}

/* caselle */
.lf-list{list-style:none;margin:0;padding:0}
.lf-list li{position:relative}
.lf-o{display:flex;align-items:center;gap:10px;min-height:34px;padding:3px 0;font-size:14px;line-height:1.3;color:#3A332C;cursor:pointer}
.lf-o input{appearance:none;-webkit-appearance:none;flex:none;width:16px;height:16px;margin:0;border:1.5px solid var(--lf-stone);border-radius:2px;background:var(--lf-paper);display:grid;place-content:center;cursor:pointer;transition:background .2s,border-color .2s}
.lf-o input::after{content:"";width:9px;height:5px;border:solid var(--lf-paper);border-width:0 0 1.8px 1.8px;transform:translateY(-1px) rotate(-45deg);opacity:0}
.lf-o input:checked{background:var(--lf-ink);border-color:var(--lf-ink)}
.lf-o input:checked::after{opacity:1}
.lf-o input:focus-visible{outline:2px solid var(--lf-red);outline-offset:2px}
.lf-o:hover input:not(:disabled){border-color:var(--lf-ink)}
.lf-o.on{color:var(--lf-ink);font-weight:500}
.lf-n{flex:1;min-width:0}
.lf-c{flex:none;font-size:11px;color:var(--lf-soft);font-variant-numeric:tabular-nums}

/* albero dei tipi */
.lf-tree .lf-sub{list-style:none;margin:0 0 4px;padding:0 0 0 26px}
.lf-tree .lf-sub .lf-o{min-height:30px;font-size:13px}
.lf-tree>li>.lf-o{padding-right:30px}
.lf-x{position:absolute;right:0;top:2px;width:30px;height:30px;display:grid;place-items:center;color:var(--lf-soft)}
.lf-x::before{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg);transition:transform .25s var(--ease,ease)}
.lf-x[aria-expanded="false"]::before{transform:rotate(-45deg)}
.lf-x:hover{color:var(--lf-ink)}

/* colori */
.lf-colori{display:grid;grid-template-columns:1fr;gap:0}
.lf-sw i{flex:none;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.lf-sw input{position:absolute;opacity:0;width:20px;height:20px;margin:0;pointer-events:none}
.lf-sw input:focus-visible+i{outline:2px solid var(--lf-red);outline-offset:2px}
.lf-sw.on i{box-shadow:0 0 0 2px var(--lf-paper),0 0 0 3.5px var(--lf-ink)}
.lf-sw.off{opacity:.38;cursor:default}

/* prezzo */
.lf-prezzo{padding-top:4px}
.lf-range{position:relative;height:28px;margin:0 9px 12px}
.lf-range-bar{position:absolute;left:0;right:0;top:13px;height:2px;background:var(--lf-line)}
.lf-range-bar i{position:absolute;top:0;bottom:0;background:var(--lf-ink)}
.lf-range input{position:absolute;left:-9px;right:-9px;top:0;width:calc(100% + 18px);height:28px;margin:0;background:none;appearance:none;-webkit-appearance:none;pointer-events:none}
.lf-range input::-webkit-slider-runnable-track{background:none;height:28px}
.lf-range input::-moz-range-track{background:none}
.lf-range input::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:18px;height:18px;margin-top:5px;border-radius:50%;background:var(--lf-paper);border:1.5px solid var(--lf-ink);cursor:grab}
.lf-range input::-moz-range-thumb{pointer-events:auto;width:16px;height:16px;border-radius:50%;background:var(--lf-paper);border:1.5px solid var(--lf-ink);cursor:grab}
.lf-range input:focus-visible::-webkit-slider-thumb{outline:2px solid var(--lf-red);outline-offset:2px}
.lf-nums{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lf-num{display:flex;align-items:center;gap:6px;border:1px solid var(--lf-stone);padding:0 10px;height:42px;font-size:13px;color:var(--lf-soft);background:var(--lf-paper)}
.lf-num:focus-within{border-color:var(--lf-ink)}
.lf-num input{flex:1;min-width:0;width:100%;min-height:0;height:40px;border:0;padding:0;background:transparent;font-size:14px;color:var(--lf-ink);outline:none;-moz-appearance:textfield;appearance:textfield}
.lf-num input::-webkit-inner-spin-button,.lf-num input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* piede: Azzera e Mostra N prodotti */
.lf-foot{display:flex;align-items:center;gap:16px;padding-top:18px}
.lf-mostra{flex:1;min-height:48px;padding:0 18px}
.lf-azzera{font:600 11px/1 var(--sans,"Jost",system-ui,sans-serif);letter-spacing:.18em;text-transform:uppercase;color:var(--lf-ink);border-bottom:1.5px solid var(--lf-red,#9C1B30);padding-bottom:4px;white-space:nowrap}
.lf-azzera:hover{color:var(--lf-red,#9C1B30)}

/* pulsante "Filtri" nella barra del catalogo */
.lf-apri{display:none;align-items:center;gap:8px;height:40px;padding:0 16px;border:1px solid var(--ink,#1F1B17);font:600 11px/1 var(--sans,"Jost",system-ui,sans-serif);letter-spacing:.18em;text-transform:uppercase;color:var(--ink,#1F1B17);background:var(--paper,#FBF8F3)}
.lf-apri-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--red,#9C1B30);color:#fff;font-size:10px;letter-spacing:0}

/* filtri attivi */
.lf-attivi{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:-12px 0 24px}
.lf-attivi-t{font-size:12px;color:var(--soft,#5A5047);margin-right:4px}
.lf-chip{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 10px 0 14px;border:1px solid var(--ink,#1F1B17);border-radius:999px;font-size:13px;background:var(--paper,#FBF8F3);transition:background .2s,color .2s}
.lf-chip span{font-size:16px;line-height:1;color:var(--soft,#5A5047)}
.lf-chip:hover{background:var(--ink,#1F1B17);color:var(--paper,#FBF8F3)}
.lf-chip:hover span{color:var(--paper,#FBF8F3)}
.lf-attivi .lf-azzera{margin-left:6px}

/* nessun prodotto */
.lf-vuoto{padding:24px 0 40px;max-width:560px}
.lf-vuoto-t{font-family:var(--serif,Georgia,serif);font-size:clamp(26px,3vw,36px);line-height:1.15;margin:0 0 10px}
.lf-vuoto p:last-child{color:var(--soft,#5A5047);margin:0}
.lf-bar-vuota{justify-content:flex-start}

/* aggiornamento in corso */
.lf-carica ul.products,.lf-carica .lf-vuoto{opacity:.45;transition:opacity .2s}
.lf-velo{position:fixed;inset:0;z-index:305;background:rgba(31,27,23,.35);opacity:0;pointer-events:none;transition:opacity .35s var(--ease,ease)}

/* ---------- desktop: colonna ---------- */
@media (min-width:1101px){
  .lf-on .shop{display:grid;grid-template-columns:236px minmax(0,1fr);column-gap:clamp(32px,3.5vw,56px);align-items:start}
  .lf-on .shop>*{grid-column:2;min-width:0}
  .lf-on .shop>.shop-head,.lf-on .shop>.subcats{grid-column:1/-1}
  .lf-on .shop>.lf{grid-column:1;grid-row:span 40;position:sticky;top:132px;max-height:calc(100vh - 150px);overflow:hidden auto;overscroll-behavior:contain;scrollbar-width:thin;padding-right:6px}
  .admin-bar.lf-on .shop>.lf{top:164px;max-height:calc(100vh - 182px)}
  .lf-on .shop .grid4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lf-top{padding:16px 0 14px;border-top:1px solid var(--lf-line)}
  .lf-top+.lf-body .lf-g:first-child{border-top:0}
  .js .lf-foot .lf-mostra{display:none}
  .lf-foot:not(:has(.lf-azzera)){padding:0}
  .js .lf-foot:not(:has(.lf-azzera)){display:none}
  .lf-bar-vuota{display:none}
}

/* ---------- telefono e tablet: pannello dal basso ---------- */
@media (max-width:1100px){
  .lf-apri{display:inline-flex}
  .shop-bar .lf-apri{order:-1}
  .shop-bar:has(.lf-apri) .woocommerce-result-count{flex:1}
  .lf{position:fixed;left:0;right:0;bottom:0;z-index:310;max-height:min(88vh,760px);display:flex;flex-direction:column;background:var(--lf-paper);border-top:2px solid var(--lf-ink);box-shadow:0 -12px 40px rgba(31,27,23,.18);transform:translateY(102%);visibility:hidden;transition:transform .45s var(--ease,ease),visibility 0s linear .45s}
  .lf:target,.lf-aperto .lf{transform:none;visibility:visible;transition:transform .45s var(--ease,ease),visibility 0s}
  .lf-aperto .lf-velo{opacity:1;pointer-events:auto}
  .lf-aperto{overflow:hidden}
  .lf-form{display:flex;flex-direction:column;min-height:0;max-height:inherit}
  .lf-top{flex:none;padding:14px var(--gut,16px) 12px;border-bottom:1px solid var(--lf-line)}
  .lf-chiudi{display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;color:var(--lf-ink)}
  .lf-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 var(--gut,16px)}
  .lf-body .lf-g:first-child{border-top:0}
  .lf-g:last-child{border-bottom:0}
  .lf-o{min-height:40px}
  .lf-colori{grid-template-columns:1fr 1fr;column-gap:12px}
  .lf-foot{flex:none;padding:12px var(--gut,16px) calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--lf-line);background:var(--lf-paper)}
  .lf-attivi{margin:-14px 0 20px}
}
@media (max-width:560px){
  /* "Filtri" e ordinamento sulla stessa riga, il conteggio sotto */
  .shop-bar:has(.lf-apri){flex-direction:row;align-items:center;gap:12px 10px} /* il tema la mette in colonna sotto i 560 px */
  .shop-bar:has(.lf-apri) .woocommerce-ordering{flex:1;min-width:0}
  .shop-bar:has(.lf-apri) .woocommerce-ordering select{width:100%}
  .shop-bar:has(.lf-apri) .woocommerce-result-count{order:3;flex:1 1 100%}
  .lf-attivi-t{display:none}
}
@media (prefers-reduced-motion:reduce){
  .lf,.lf-velo{transition:none!important}
}
