/* GS Configuratore Abbigliamento — stili (scope .gs-var, wrapper .gs-abb.gs-var) */
.gs-abb-loading{padding:24px;color:#6b625c;font-style:italic}
.gs-var{--ink:#15171c;--paper:#f7f5f0;--accent:#ff5722;--accent-t:#c2410c;--line:#e2ded4;--muted:#6b625c;
  max-width:1200px;margin:0 auto;color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.5;text-align:left}
.gs-var *,.gs-var *::before,.gs-var *::after{box-sizing:border-box}
.gs-var button{margin:0;padding:0;border:none;background:none !important;color:var(--ink) !important;font:inherit;text-transform:none !important;letter-spacing:normal !important;box-shadow:none;border-radius:0;cursor:pointer;width:auto;min-height:0;line-height:1.3;transition:border-color .15s,background .15s,box-shadow .15s}
.gs-var input[type=number],.gs-var input[type=text]{margin:0;background:#fff;color:var(--ink);font:inherit}
.gs-head{margin:0 0 24px}
.gs-eyebrow{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-t);font-weight:700;margin-bottom:8px}
.gs-title{font-size:32px;line-height:1.08;margin:0 0 8px;font-weight:800;letter-spacing:-.02em}
.gs-lead{font-size:15px;color:#5a5a52;margin:0;max-width:600px}
.gs-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:24px;align-items:start}
.gs-config{display:flex;flex-direction:column;gap:16px;min-width:0}
.gs-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 24px;box-shadow:0 1px 2px rgba(20,23,28,.04)}
.gs-box-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.gs-box-n{font-size:11px;font-weight:800;color:var(--accent-t);background:#fff2ec;padding:3px 8px;border-radius:6px}
.gs-box-t{font-size:17px;font-weight:700;margin:0}
.gs-flabel{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:12px 0 10px}
.gs-intro{font-size:13px;color:#6b625c;margin:-4px 0 14px;line-height:1.5}
.gs-cosaricevi{margin:14px 0;padding:12px 14px;background:rgba(255,255,255,.08);border-radius:12px}
.gs-cr-t{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#6b625c;font-weight:700;margin-bottom:6px}
.gs-cr-i{font-size:13px;color:#e8e8e2;line-height:1.55;padding-left:14px;position:relative}
.gs-cr-i:before{content:"•";position:absolute;left:0;color:var(--accent-t);font-weight:700}
.gs-pills{display:flex;gap:10px;flex-wrap:wrap}
.gs-var .gs-pill{padding:11px 16px;border:1.5px solid var(--line) !important;border-radius:12px;background:#fff !important;color:var(--ink) !important;font-weight:700;font-size:14px}
.gs-var .gs-pill:hover{border-color:var(--ink) !important}
.gs-var .gs-pill.on{border-color:var(--accent-t) !important;background:var(--accent-t) !important;color:#fff !important;box-shadow:0 2px 8px rgba(255,87,34,.25)}
.gs-sizes{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:10px}
.gs-size{display:flex;flex-direction:column;align-items:stretch;gap:5px}
.gs-size-l{font-size:12px;font-weight:800;color:var(--muted);text-align:center;text-transform:uppercase}
.gs-size-i{height:46px;text-align:center;border:1.5px solid var(--line);border-radius:12px;font-size:17px;font-weight:800;width:100%}
.gs-size-i:focus{outline:none;border-color:var(--accent-t)}
.gs-tot{margin-top:14px;font-size:15px;color:var(--ink)}
.gs-graf{display:flex;flex-direction:column;gap:10px}
.gs-var .gs-graf-o{display:flex;align-items:center;gap:12px;padding:14px;border:1.5px solid var(--line) !important;border-radius:12px;background:#fff !important;color:var(--ink) !important;text-align:left;width:100%}
.gs-var .gs-graf-o:hover{border-color:#c9c4b8 !important}
.gs-var .gs-graf-o.on{border-color:var(--accent-t) !important;box-shadow:inset 0 0 0 1.5px var(--accent)}
.gs-chk{width:22px;height:22px;border-radius:6px;border:1.5px solid #c8c4ba;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:var(--accent-t);flex-shrink:0}
.gs-fmain{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.gs-fl{font-weight:700;font-size:14px}
.gs-fc{margin-left:auto;font-size:13px;color:var(--muted);font-weight:700;white-space:nowrap;text-align:right}
.gs-upload{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 18px;border:2px dashed var(--line);border-radius:12px;cursor:pointer;background:#faf8f3;margin-top:14px}
.gs-up-i{width:42px;height:42px;border-radius:999px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}
.gs-up-t{font-size:13.5px;font-weight:600;color:#6a6a60;text-align:center}
.gs-fileerr{margin-top:8px;font-size:13px;color:#c0431a;font-weight:600}
.gs-filelist{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.gs-filerow{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#f1faf5;border:1px solid #bfe6cf;border-radius:10px;font-size:13px}
.gs-fileok{color:#2f8f5b;font-weight:800}
.gs-filenm{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-var .gs-filerm{margin-left:auto;color:#c0431a !important;font-size:14px;font-weight:700;flex-shrink:0}
.gs-note-ta{width:100%;min-height:80px;margin-top:8px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;font:inherit;font-size:14px;background:#fff;color:var(--ink);resize:vertical;box-sizing:border-box}
.gs-note-ta:focus{outline:none;border-color:var(--accent-t)}
.gs-leads{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gs-var .gs-lead{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 14px;border:1.5px solid var(--line) !important;border-radius:12px;background:#fff !important;color:var(--ink) !important;text-align:left}
.gs-var .gs-lead:hover{border-color:#c9c4b8 !important}
.gs-var .gs-lead.on{border-color:var(--accent-t) !important;box-shadow:inset 0 0 0 1.5px var(--accent)}
.gs-var .gs-lead.off{opacity:.45;cursor:not-allowed}
.gs-lead-ic{line-height:0;margin-bottom:2px}
.gs-lead-l{font-weight:800;font-size:14.5px}
.gs-lead-d{font-size:11.5px;color:#6b625c}
.gs-lead-x{font-size:10px;font-weight:700;color:#c0431a;text-transform:uppercase;margin-top:2px}
.gs-summary{position:relative;align-self:start}
.gs-sum-inner{background:var(--ink);color:#fff;border-radius:18px;padding:24px;box-shadow:0 10px 30px rgba(20,23,28,.18)}
.gs-sum-t{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#b8afa6;font-weight:700;margin-bottom:14px}
.gs-sum-p{font-size:17px;font-weight:800;display:flex;flex-direction:column;gap:2px;margin-bottom:16px}
.gs-sum-s{font-size:12.5px;color:#b5b5ac;font-weight:500}
.gs-price{font-size:40px;font-weight:800;letter-spacing:-.02em;color:var(--accent-t);line-height:1;margin-top:4px}
.gs-price-iva{font-size:14px;font-weight:700;color:#b5b5ac;margin-left:8px}
.gs-price-m{font-size:12.5px;color:#b5b5ac;margin-top:8px}
.gs-ready{font-size:12.5px;color:#d8d8d0;margin-top:10px;display:flex;flex-direction:column;text-transform:capitalize}
.gs-ready-sub{font-size:11px;color:#b8afa6;text-transform:none;margin-top:3px}
.gs-ship{font-size:12px;color:#b5b5ac;margin-top:8px}
.gs-var .gs-cta{display:block;width:100%;margin-top:18px;padding:15px;background:var(--accent) !important;color:#fff !important;border-radius:12px;font-size:19px;font-weight:800;text-align:center}
.gs-var .gs-cta:hover{filter:brightness(1.05)}
.gs-var .gs-cta:disabled{opacity:.6;cursor:default}
.gs-msg{margin-top:12px;font-size:13px;text-align:center;color:#cfcfc7}
.gs-msg.ok{color:#5fd09a;font-weight:600}
.gs-msg.ok a{color:#fff;text-decoration:underline}
.gs-msg.err{color:#ff8a65;font-weight:600}
.gs-disc{margin-top:22px;font-size:12px;color:#6b625c;text-align:center}
@media(max-width:860px){
  .gs-var{padding-left:14px;padding-right:14px}
  .gs-var .gs-graf-o{flex-wrap:wrap}
  .gs-grid{grid-template-columns:1fr}
  .gs-leads{grid-template-columns:1fr}
  .gs-title{font-size:26px}
  .gs-summary{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:9999;margin:0}
  .gs-sum-inner{border-radius:16px 16px 0 0;padding:14px 18px;display:grid;grid-template-columns:1fr auto;grid-template-areas:"price cta" "ready cta";align-items:center;gap:2px 14px;box-shadow:0 -8px 24px rgba(20,23,28,.25)}
  .gs-sum-t,.gs-sum-p,.gs-price-m,.gs-ship,.gs-cosaricevi{display:none}
  .gs-price{grid-area:price;font-size:26px;margin:0}
  .gs-ready{grid-area:ready;margin:0}
  .gs-ready-sub{display:none}
  .gs-var .gs-cta{grid-area:cta;width:auto;margin:0;padding:14px 22px;white-space:nowrap}
  .gs-msg{grid-column:1/-1}
  .gs-config{padding-bottom:130px}
}

/* ============================================================================
 *  SKIN "Griglia calda" — struttura + calore, meno bianco.
 *  Fondo crema con card bianche che staccano, testate colorate con numero pieno,
 *  Quantità e Consegna affiancate (via :has, nessuna modifica al JS), preventivo
 *  allineato in cima. Un solo arancione, nero caldo. Accessibile.
 * ========================================================================== */
.gs-tot{--accent:#f0662b;--ink:#1a1613;--line:#e7ded1;--muted:#6b625c;--wash:#fff2ea;--washline:#f7cbb4;--cream:#f5f0e7}

/* colonna delle scelte: pannello crema, le card bianche ci staccano sopra.
   griglia: Quantità stretta + Consegna larga sulla stessa riga; il resto a tutta. */
.gs-tot .gs-config{background:var(--cream);border-radius:16px;padding:16px;gap:16px;
  display:grid;grid-template-columns:minmax(190px,240px) 1fr;align-items:start}
.gs-tot .gs-box{grid-column:1/-1;background:#fff;border:1px solid var(--line);border-radius:13px;
  padding:0;overflow:hidden;box-shadow:0 1px 2px rgba(26,22,19,.04)}
.gs-tot .gs-box:has(.gs-qty-ctl){grid-column:1}
.gs-tot .gs-box:has(.gs-leads){grid-column:2}

/* testata colorata con numero pieno */
.gs-tot .gs-box-h{margin:0;gap:10px;padding:12px 16px;background:var(--wash);border-bottom:1px solid var(--washline)}
.gs-tot .gs-box-n{width:23px;height:23px;border-radius:7px;background:var(--accent-t);color:#fff;
  font-size:12px;font-weight:800;display:grid;place-items:center;padding:0;min-width:0;opacity:1}
.gs-tot .gs-box-t{font-size:15px;font-weight:700;letter-spacing:-.01em}
/* corpo card */
.gs-tot .gs-box > :not(.gs-box-h){margin-left:16px;margin-right:16px}
.gs-tot .gs-box > .gs-intro{margin-top:12px}
.gs-tot .gs-box > *:last-child{margin-bottom:16px}
.gs-tot .gs-box:has(.gs-qty-ctl) .gs-box-h{margin-bottom:0}
.gs-tot .gs-intro{font-size:12.5px;margin:12px 16px 0}

/* Quantità: solo lo stepper, centrato, niente prezzo ripetuto */
.gs-tot .gs-box:has(.gs-qty-ctl) > .gs-qty-ctl{margin:16px;display:flex;justify-content:center}
.gs-tot .gs-qty-ctl{gap:0;border:1.5px solid var(--line);border-radius:11px;overflow:hidden;background:#fff}
.gs-tot .gs-qbtn{width:46px !important;height:46px;border:0 !important;border-radius:0 !important;
  background:transparent !important;font-size:20px}
.gs-tot .gs-qbtn:hover{background:var(--accent-t) !important;color:#fff !important}
.gs-tot .gs-qinput{width:56px !important;height:46px;border:0 !important;border-left:1.5px solid var(--line) !important;
  border-right:1.5px solid var(--line) !important;border-radius:0 !important;font-size:16px;font-weight:800;
  font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.gs-tot .gs-qinput::-webkit-outer-spin-button,.gs-tot .gs-qinput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* Consegna: 3 chip compatte */
.gs-tot .gs-leads{gap:10px}
.gs-tot .gs-lead{padding:12px 13px;border-radius:10px;border-width:1px !important}
.gs-tot .gs-lead.on{border-color:var(--accent-t) !important;background:var(--wash) !important;box-shadow:none}
.gs-tot .gs-lead-l{font-size:14px}.gs-tot .gs-lead-d{font-size:11px}

/* Opzioni file compatte */
.gs-tot .gs-graf{gap:8px}
.gs-tot .gs-graf-o{padding:12px 14px;border-radius:10px;border-width:1px !important}
.gs-tot .gs-graf-o.on{border-color:var(--accent-t) !important;background:var(--wash) !important;box-shadow:none}
.gs-tot .gs-chk{width:20px;height:20px;border-radius:6px}.gs-tot .gs-fl{font-size:14px}
.gs-tot .gs-upload{border-radius:11px}

/* Preventivo: allineato in cima, nero caldo (già var --ink), sticky */
.gs-tot .gs-summary{align-self:start}
.gs-tot .gs-grid{align-items:start}

/* Accessibilità */
.gs-tot .gs-qbtn:focus-visible,.gs-tot .gs-qinput:focus-visible,.gs-tot .gs-lead:focus-visible,
.gs-tot .gs-graf-o:focus-visible,.gs-tot .gs-upload:focus-within,.gs-tot .gs-cta:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.gs-tot *{transition:none !important}}

/* Mobile: tutto in colonna */
@media (max-width:640px){
  .gs-tot .gs-config{grid-template-columns:1fr;padding:12px}
  .gs-tot .gs-box:has(.gs-qty-ctl),.gs-tot .gs-box:has(.gs-leads){grid-column:1}
  .gs-tot .gs-box:has(.gs-qty-ctl) > .gs-qty-ctl{justify-content:flex-start}
}

/* Miniatura del prodotto in cima al preventivo: contesto visivo di cosa si configura */
.gs-tot .gs-sum-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.gs-tot .gs-sum-thumb{flex:0 0 52px;width:52px;height:52px;border-radius:10px;overflow:hidden;background:#fff;
  border:1px solid rgba(255,255,255,.14)}
.gs-tot .gs-sum-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.gs-tot .gs-sum-htxt{min-width:0}
.gs-tot .gs-sum-name{font-weight:700;font-size:1rem;line-height:1.2;color:#fff;margin-top:2px}

/* Colori disponibili: riga di testo servita dal server (SEO + no-JS). Il configuratore
   mostra gli stessi colori come pastiglie, qui restano leggibili anche senza JavaScript. */
.gs-abb-colori{margin:10px 2px 0;font-size:.85rem;line-height:1.5;color:#6b625c}
.gs-abb-colori strong{color:#4a423d;font-weight:600}