/* ============================================================
   EUFORIA — Archivi prodotto + drawer filtri  ·  CSS
   File:   assets/css/archivio.css  ·  handle: euforia-archivio
   Server: wp-content/themes/hello-elementor-child/assets/css/archivio.css
   Carica solo sugli archivi (functions-archivio-APPEND.php).
   ------------------------------------------------------------
   La GRIGLIA card è già globale (woo-loop.css): qui c'è solo il
   "vestito" dell'archivio (hero, striscia editoriale full-bleed,
   toolbar, chip) + il drawer filtri (pattern dei drawer PDP/carrello).
   Design "Luce di Sicilia": pastello, lusso sobrio, tocco di colore.
   ============================================================ */

/* token di riserva (identici allo style.css del child → nessun effetto se già definiti) */
:root{
  --paper:#FFFFFF; --paper-2:#FCFAF6; --linen:#F6F1E9; --line:#E8E1D5;
  --grey:#ECECEA; --t-teal:#E2EFEC; --t-straw:#F1ECD8; --t-sun:#F7EFD6;
  --terra:#C75D38; --fucsia:#C42C7B; --gold:#BE8F39; --gold-l:#E0BC5A; --teal:#1C9AA1;
  --ink:#2B2723; --ink-soft:#6E6557; --ink-mut:#9C9486;
  --font-d:'Cormorant Garamond',Georgia,serif;
  --font-b:'Quicksand',system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* guard overflow orizzontale (il drawer off-canvas non deve allargare la pagina),
   scopato agli archivi via le body class di WooCommerce */
body.post-type-archive-product,
body.tax-product_cat,
body.tax-product_tag,
body.tax-pa_soggetto{overflow-x:clip;}

/* padding-bottom = respiro tra fine prodotti/paginazione e footer (vale in TUTTI gli
   stati: griglia sola, griglia+paginazione, stato vuoto). Solo verticale → non tocca
   il full-bleed della striscia editoriale. */
.euf-arch{font-family:var(--font-b);color:var(--ink);padding-bottom:clamp(56px,7vw,96px);}
.euf-arch *{box-sizing:border-box;}

/* ---------- HERO CATEGORIA ---------- */
.euf-arch-head{max-width:920px;margin:0 auto;padding:44px 24px 26px;text-align:center;}
.euf-arch-crumb{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mut);margin-bottom:20px;}
.euf-arch-crumb a{color:var(--ink-mut);transition:color .2s;} .euf-arch-crumb a:hover{color:var(--fucsia);}
.euf-arch-crumb span{color:var(--ink);}
.euf-arch-kick{display:block;margin-bottom:12px;font-size:11px;font-weight:700;letter-spacing:.20em;text-transform:uppercase;color:var(--gold);}
.euf-arch-title{font-family:var(--font-d);font-weight:500;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(30px,5vw,46px);line-height:1.04;color:var(--ink);margin:0;}
.euf-arch-desc{max-width:560px;margin:16px auto 0;font-size:14.5px;line-height:1.75;color:var(--ink-soft);}
.euf-arch-desc p{margin:0 0 .6em;}
/* nasconde l'eventuale breadcrumb Woo di default (usiamo il nostro nell'hero) */
.woocommerce-breadcrumb{display:none;}

/* ---------- STRISCIA EDITORIALE — FULL-BLEED (esce dal container) ---------- */
.euf-arch-strip{width:100vw;margin-left:calc(50% - 50vw);display:flex;gap:2px;overflow-x:auto;
  scrollbar-width:none;background:var(--paper);scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.euf-arch-strip::-webkit-scrollbar{height:0;}
.euf-ed{flex:1 0 0;min-width:190px;height:clamp(240px,34vh,340px);position:relative;overflow:hidden;
  background:var(--grey);display:block;text-decoration:none;scroll-snap-align:start;}
.euf-ed img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
.euf-ed::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(22,19,15,.62) 0%,rgba(22,19,15,.15) 42%,rgba(22,19,15,0) 72%);transition:background .3s;}
.euf-ed:hover img{transform:scale(1.06);}
.euf-ed:hover::after{background:linear-gradient(to top,rgba(22,19,15,.72) 0%,rgba(22,19,15,.22) 46%,rgba(22,19,15,0) 76%);}
/* fallback quando il termine non ha immagine → tinta pastello deterministica */
.euf-ed:not(:has(img)){background:var(--t-straw);}
.euf-ed:nth-child(3n+2):not(:has(img)){background:var(--t-teal);}
.euf-ed:nth-child(3n):not(:has(img)){background:var(--t-sun);}
.euf-ed-cap{position:absolute;left:18px;right:14px;bottom:18px;z-index:2;color:#fff;}
.euf-ed:not(:has(img)) .euf-ed-cap{color:var(--ink);}
.euf-ed-cap .k{display:block;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72);margin-bottom:5px;}
.euf-ed:not(:has(img)) .euf-ed-cap .k{color:var(--ink-mut);}
.euf-ed-cap .t{font-family:var(--font-d);font-weight:500;font-size:20px;line-height:1.05;}
.euf-ed-cap .u{display:block;width:0;height:1.5px;background:var(--gold-l);margin-top:9px;transition:width .45s var(--ease);}
.euf-ed:hover .euf-ed-cap .u{width:34px;}
.euf-ed.is-gold::after{background:linear-gradient(to top,rgba(120,88,25,.7) 0%,rgba(120,88,25,.28) 45%,rgba(120,88,25,.06) 78%);}
.euf-ed.is-gold .euf-ed-cap .k{color:var(--gold-l);}
.euf-ed.is-gold .euf-ed-cap .t::before{content:"\2605 ";color:var(--gold-l);}
@media(max-width:640px){.euf-ed{min-width:62vw;height:210px;}}

/* ---------- TOOLBAR (non sticky) ---------- */
.euf-arch-toolbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:2px;}
.euf-arch-toolbar-in{max-width:1280px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:14px;}
.euf-arch-count{font-size:12px;font-weight:600;color:var(--ink-soft);} .euf-arch-count b{color:var(--ink);font-weight:700;}
.euf-arch-toolbar-right{display:flex;align-items:center;gap:20px;}
.euf-arch-fltlink{display:inline-flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font-family:var(--font-b);font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ink);transition:color .2s;}
.euf-arch-fltlink:hover,.euf-arch-fltlink:focus{color:var(--fucsia)!important;background:none;}
.euf-arch-fltlink .cnt{display:none;min-width:17px;height:17px;padding:0 5px;border-radius:100px;background:var(--fucsia);color:#fff;font-size:9.5px;font-weight:700;line-height:17px;text-align:center;letter-spacing:0;}
.euf-arch-fltlink.has-active .cnt{display:inline-block;} .euf-arch-fltlink.has-active{color:var(--fucsia);}
.euf-arch-sort{position:relative;}
.euf-arch-sort select{appearance:none;-webkit-appearance:none;background:none;border:none;cursor:pointer;font-family:var(--font-b);font-size:11px;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--ink);padding:8px 22px 8px 4px;}
.euf-arch-sort::after{content:"";position:absolute;right:6px;top:50%;width:7px;height:7px;border-right:1.5px solid var(--ink-soft);border-bottom:1.5px solid var(--ink-soft);transform:translateY(-70%) rotate(45deg);pointer-events:none;}

/* chip filtri attivi */
.euf-arch-active{max-width:1280px;margin:0 auto;padding:0 24px;display:none;flex-wrap:wrap;gap:8px;}
.euf-arch-active.is-show{display:flex;padding-top:16px;}
.euf-fchip{display:inline-flex;align-items:center;gap:7px;background:var(--linen);border:1px solid var(--line);border-radius:100px;padding:6px 8px 6px 13px;font-size:11.5px;font-weight:600;color:var(--ink);}
.euf-fchip button{background:none;border:none;cursor:pointer;color:var(--ink-mut);width:18px;height:18px;display:grid;place-items:center;border-radius:100px;line-height:0;padding:0;transition:.2s;}
.euf-fchip button:hover{color:var(--fucsia);background:#fff;} .euf-fchip button svg{width:11px;height:11px;}
.euf-fclear{background:none;border:none;cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--ink-soft);padding:0 0 2px;align-self:center;transition:.2s;}
.euf-fclear:hover{color:var(--fucsia);border-color:var(--fucsia);}

/* ---------- GRIGLIA (spaziatura archivio; la card è globale) ---------- */
.euf-arch-body{max-width:1280px;margin:0 auto;padding:28px 24px 10px;}
.euf-arch .products,
.euf-arch ul.products{gap:34px 22px!important;}
.euf-arch-results .woocommerce-info,.euf-arch-results .woocommerce-notices-wrapper{display:none;}

/* stato vuoto */
.euf-arch-empty{text-align:center;padding:70px 20px 40px;}
.euf-arch-empty h3{font-family:var(--font-d);font-weight:500;font-size:26px;color:var(--ink);margin:0;}
.euf-arch-empty p{font-size:14px;color:var(--ink-soft);margin:12px auto 22px;max-width:380px;line-height:1.7;}
.euf-arch-empty-go{display:inline-flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.euf-arch-line{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;transition:.2s;}
.euf-arch-line:hover{color:var(--fucsia);border-color:var(--fucsia);}

/* paginazione */
.euf-arch-pag{max-width:1280px;margin:8px auto 0;padding:24px;display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;}
.euf-arch-pag a,.euf-arch-pag span{min-width:38px;height:38px;display:grid;place-items:center;border-radius:100px;font-size:12.5px;font-weight:600;color:var(--ink-soft);text-decoration:none;transition:.2s;}
.euf-arch-pag a:hover{background:var(--linen);color:var(--ink);} .euf-arch-pag .cur{background:var(--ink);color:#fff;}
.euf-arch-pag .nxt{width:auto;padding:0 16px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);} .euf-arch-pag .nxt:hover{color:var(--fucsia);background:none;}

/* stato "carico" durante l'AJAX */
.euf-arch-results.is-busy{opacity:.45;pointer-events:none;transition:opacity .2s;}

/* =====================================================
   BOTTONE FILTRI FLOTTANTE (compare scrollando)
   ===================================================== */
.euf-ffab{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(16px);z-index:400;
  display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;border:none;cursor:pointer;
  font-family:var(--font-b);font-size:10.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;padding:11px 18px;border-radius:100px;
  box-shadow:0 12px 30px -12px rgba(43,39,35,.55);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),transform .3s var(--ease),background .25s;}
.euf-ffab.is-show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
/* testo SEMPRE bianco: il tema ha un button:hover che sovrascrive il colore base → !important
   in hover/focus/active per tenerlo bianco su sfondo fucsia */
.euf-ffab,.euf-ffab:link,.euf-ffab:visited{color:#fff;}
.euf-ffab:hover,.euf-ffab:focus,.euf-ffab:active{background:var(--fucsia);color:#fff!important;}
.euf-ffab svg{width:14px;height:14px;}
.euf-ffab .cnt{min-width:16px;height:16px;padding:0 5px;border-radius:100px;background:#fff;color:var(--ink);font-size:9.5px;font-weight:700;line-height:16px;text-align:center;letter-spacing:0;display:none;}
.euf-ffab.has-active .cnt{display:inline-block;} .euf-ffab.has-active:hover .cnt{color:var(--fucsia);}
@media(max-width:640px){
  .euf-ffab{bottom:calc(12px + env(safe-area-inset-bottom));padding:8px 14px;font-size:9.5px;letter-spacing:.08em;gap:6px;}
  .euf-ffab svg{width:12px;height:12px;}
  .euf-ffab .cnt{min-width:15px;height:15px;line-height:15px;font-size:9px;}
}

/* =====================================================
   DRAWER FILTRI (slide da destra — pattern cart drawer)
   ===================================================== */
.euf-fdrawer-backdrop{position:fixed;inset:0;z-index:99988;background:rgba(20,25,25,.45);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;}
.euf-fdrawer-backdrop.is-open{opacity:1;visibility:visible;}
.euf-fdrawer{position:fixed;top:0;right:0;bottom:0;z-index:99989;width:min(410px,94vw);background:var(--paper);transform:translateX(100%);
  transition:transform .4s var(--ease);display:flex;flex-direction:column;box-shadow:-24px 0 60px -30px rgba(0,0,0,.4);
  font-family:var(--font-b);color:var(--ink);}
.euf-fdrawer.is-open{transform:translateX(0);}
.euf-fdrawer *{box-sizing:border-box;}
.euf-fdrawer-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:22px 24px 16px;}
.euf-fdrawer-title{font-family:var(--font-d);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:22px;line-height:1;display:inline-flex;align-items:baseline;gap:9px;}
.euf-fdrawer-title .n{font-family:var(--font-b);font-size:12px;font-weight:600;color:var(--ink-mut);} .euf-fdrawer-title .n:empty{display:none;}
.euf-fdrawer-close{background:none;border:none;cursor:pointer;color:var(--ink);width:36px;height:36px;display:grid;place-items:center;border-radius:100px;transition:background .2s;line-height:0;padding:0;}
.euf-fdrawer-close:hover{background:var(--linen);} .euf-fdrawer-close svg{display:block;width:20px;height:20px;}
.euf-fdrawer-maiolica{flex:0 0 auto;height:3px;background:linear-gradient(90deg,var(--teal) 0 20%,var(--t-sun) 20% 40%,var(--fucsia) 40% 60%,var(--gold) 60% 80%,var(--teal) 80% 100%);}
.euf-fdrawer-scroll{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:4px 24px 16px;}

.euf-fgrp{border-bottom:1px solid var(--line);}
.euf-fgrp-h{width:100%;background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px 2px;font-family:var(--font-b);font-size:12px;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--ink);}
.euf-fgrp-h .chev{width:9px;height:9px;border-right:1.5px solid var(--ink-soft);border-bottom:1.5px solid var(--ink-soft);transform:rotate(45deg);transition:transform .3s var(--ease);margin-top:-3px;}
.euf-fgrp.is-open .euf-fgrp-h .chev{transform:rotate(-135deg);margin-top:2px;}
.euf-fgrp-body{max-height:0;overflow:hidden;transition:max-height .35s var(--ease);}
.euf-fgrp.is-open .euf-fgrp-body{max-height:560px;}
.euf-fgrp-in{padding:2px 2px 20px;}
.euf-fgrp-note{font-size:11px;color:var(--ink-mut);line-height:1.5;margin-top:8px;}

/* Fase 2 (bloccato) */
.euf-f2{font-size:8.5px;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold-l);border-radius:100px;padding:2px 7px;}
.euf-fgrp.is-locked .euf-fgrp-h{cursor:default;color:var(--ink-mut);}
.euf-fgrp.is-locked .euf-fgrp-h .chev{display:none;}
.euf-fgrp.is-locked .euf-fgrp-body{max-height:none;}
.euf-fgrp.is-locked .euf-fgrp-in{opacity:.5;pointer-events:none;}

/* Colore — swatch */
.euf-fswatches{display:flex;flex-wrap:wrap;gap:11px;}
.euf-fsw{cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;width:52px;text-align:center;}
.euf-fsw .dot{width:32px;height:32px;border-radius:100px;border:1px solid var(--line);box-shadow:inset 0 0 0 3px #fff;transition:.2s;}
.euf-fsw input{position:absolute;opacity:0;pointer-events:none;}
.euf-fsw .nm{font-size:10px;font-weight:600;color:var(--ink-soft);line-height:1.2;}
.euf-fsw input:checked + .dot{box-shadow:inset 0 0 0 3px #fff,0 0 0 2px var(--gold);}
.euf-fsw input:checked ~ .nm{color:var(--ink);font-weight:700;}

/* Taglia — pill */
.euf-fpills{display:flex;flex-wrap:wrap;gap:8px;}
.euf-fpill{cursor:pointer;} .euf-fpill input{position:absolute;opacity:0;pointer-events:none;}
.euf-fpill span{display:grid;place-items:center;min-width:42px;height:36px;padding:0 12px;border:1px solid var(--line);border-radius:100px;font-size:12px;font-weight:600;color:var(--ink);transition:.2s;}
.euf-fpill input:checked + span{background:var(--ink);color:#fff;border-color:var(--ink);}

/* lista checkbox (Finitura, Soggetto) */
.euf-fopts{display:flex;flex-direction:column;gap:2px;}
.euf-fopt{display:flex;align-items:center;gap:11px;cursor:pointer;padding:8px 2px;font-size:13.5px;color:var(--ink);}
.euf-fopt input{position:absolute;opacity:0;pointer-events:none;}
.euf-fopt .box{width:19px;height:19px;border:1.5px solid var(--line);border-radius:5px;display:grid;place-items:center;flex:0 0 auto;transition:.2s;}
.euf-fopt .box svg{width:12px;height:12px;opacity:0;transform:scale(.6);transition:.2s;color:#fff;}
.euf-fopt input:checked + .box{background:var(--ink);border-color:var(--ink);} .euf-fopt input:checked + .box svg{opacity:1;transform:scale(1);}
.euf-fopt.is-gold input:checked + .box{background:var(--gold);border-color:var(--gold);}
.euf-fopt .txt{flex:1;} .euf-fopt .dotmini{width:9px;height:9px;border-radius:100px;background:var(--gold);margin-left:6px;}

/* Prezzo */
.euf-fprice{display:flex;align-items:center;gap:10px;margin-top:4px;}
.euf-fprice-in{flex:1;display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:8px;padding:9px 11px;font-size:13px;color:var(--ink);}
.euf-fprice-in span{color:var(--ink-mut);} .euf-fprice-in input{border:none;outline:none;width:100%;font-family:var(--font-b);font-size:13px;color:var(--ink);-moz-appearance:textfield;}
.euf-fprice-in input::-webkit-outer-spin-button,.euf-fprice-in input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.euf-fprice-sep{color:var(--ink-mut);font-size:12px;}

/* piede drawer — Applica + Azzera (tocco fucsia) */
.euf-fdrawer-foot{flex:0 0 auto;border-top:1px solid var(--line);background:var(--paper-2);padding:15px 24px 18px;}
.euf-fapply{display:block;width:100%;text-align:center;cursor:pointer;font-family:var(--font-b);font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:15px 22px;border-radius:100px;background:var(--ink);color:#fff;border:1px solid var(--ink);transition:.25s var(--ease);}
.euf-fapply:hover,.euf-fapply:focus{background:var(--fucsia);border-color:var(--fucsia);color:#fff;}
/* pending = ci sono filtri selezionati ma non ancora applicati → il pulsante si accende
   (fucsia + pulse) e mostra "Mostra N risultati": chiaro che è l'azione da fare */
.euf-fapply.is-pending{background:var(--fucsia);border-color:var(--fucsia);color:#fff!important;animation:eufApplyPulse 1.7s var(--ease) infinite;}
@keyframes eufApplyPulse{0%,100%{box-shadow:0 0 0 0 rgba(196,44,123,0);}50%{box-shadow:0 0 0 5px rgba(196,44,123,.18);}}
@media(prefers-reduced-motion:reduce){.euf-fapply.is-pending{animation:none;}}
.euf-freset{display:block;width:100%;text-align:center;cursor:pointer;background:none;border:none;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);padding:12px 8px 2px;transition:.2s;}
.euf-freset:hover{color:var(--fucsia);}

@media(max-width:480px){.euf-fdrawer{width:100vw;}}
@media(max-width:640px){
  .euf-arch-head{padding:32px 18px 20px;}
  .euf-arch-toolbar-in{padding:12px 16px;}
  .euf-arch-toolbar-right{gap:14px;}
  .euf-arch-active{padding:0 16px;}
  .euf-arch-body{padding:22px 14px 10px;}
  .euf-arch-pag{padding:22px 14px;}
}
@media(prefers-reduced-motion:reduce){
  .euf-fdrawer,.euf-fdrawer-backdrop,.euf-ed img,.euf-ffab{transition:none!important;}
}
