/*
 * IAWEB E-COMMERCE — il sistema grafico.
 *
 * Le variabili --iw-fondo, --iw-accento, --iw-font-testo... le scrive il
 * pannello (inc/asset.php): qui si usano e basta. Quelle calcolate (spazi,
 * scala dei titoli, varianti di colore) stanno qui sotto e non si toccano
 * dal pannello: sono la parte misurata del tema.
 */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* spazi: una scala sola, multipli di 4 px */
  --iw-spazio-1: 0.25rem;
  --iw-spazio-2: 0.5rem;
  --iw-spazio-3: 0.75rem;
  --iw-spazio-4: 1rem;
  --iw-spazio-5: 1.5rem;
  --iw-spazio-6: 2rem;
  --iw-spazio-7: 3rem;
  --iw-spazio-8: 4.5rem;

  /* testo: due misure per leggere, tre per i titoli, che crescono con lo schermo */
  --iw-testo-piccolo: 0.875rem;
  --iw-testo-base: 1rem;
  --iw-titolo-1: clamp(1.75rem, 1.35rem + 1.6vw, 2.5rem);
  --iw-titolo-2: clamp(1.375rem, 1.15rem + 0.9vw, 1.875rem);
  --iw-titolo-3: 1.25rem;

  --iw-accento-scuro: color-mix(in srgb, var(--iw-accento) 84%, #000);
  --iw-bordo-forte: color-mix(in srgb, var(--iw-bordo) 55%, var(--iw-testo));
  --iw-velo: color-mix(in srgb, var(--iw-testo) 6%, transparent);
  /* un grigio appena accennato per riquadri e fasce, con qualunque fondo */
  --iw-fondo-tenue: color-mix(in srgb, var(--iw-testo) 4%, var(--iw-fondo));
  --iw-ombra: 0 1px 2px rgb(0 0 0 / 0.04), 0 10px 30px rgb(0 0 0 / 0.07);
  --iw-transizione: 160ms ease;
  --iw-altezza-testata: 72px;
}

/* ------------------------------------------------------------------ base */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--iw-fondo);
  color: var(--iw-testo);
  font-family: var(--iw-font-testo);
  font-size: var(--iw-testo-base);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; }
iframe, embed, object { max-width: 100%; }
iframe { border: 0; }

/* nascosto vuol dire nascosto: nessuna regola display del tema lo deve scavalcare */
[hidden] { display: none !important; }

/* «Torna su» esiste solo sul telefono: la sua veste sta in barra-telefono.css,
   che si carica solo sotto la soglia. Qui si spegne, se no sul computer
   resterebbe un pulsante vagante in fondo alla pagina. */
.iw-su { display: none; }

h1, h2, h3, h4, h5, h6 {
  margin: 0 0 0.6em;
  font-family: var(--iw-font-titoli);
  font-weight: var(--iw-titoli-peso, 600);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--iw-testo);
}
h1 { font-size: var(--iw-titolo-1); }
h2 { font-size: var(--iw-titolo-2); }
h3 { font-size: var(--iw-titolo-3); }
h4, h5, h6 { font-size: 1rem; }

p { margin: 0 0 1em; }

a {
  color: var(--iw-accento);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition: color var(--iw-transizione);
}
a:hover { color: var(--iw-accento-scuro); }

:focus-visible { outline: 2px solid var(--iw-accento); outline-offset: 2px; }

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.iw-salta:focus {
  position: fixed !important;
  top: var(--iw-spazio-2); left: var(--iw-spazio-2);
  z-index: 1000;
  width: auto; height: auto;
  padding: var(--iw-spazio-3) var(--iw-spazio-4);
  clip: auto;
  background: var(--iw-superficie);
  color: var(--iw-testo);
  border-radius: var(--iw-raggio-piccolo);
  box-shadow: var(--iw-ombra);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ------------------------------------------------------------ impaginato */

.iw-contenitore {
  width: 100%;
  max-width: var(--iw-contenitore);
  margin-inline: auto;
  padding-inline: clamp(1rem, 3vw, 2rem);
}

.iw-contenuto { min-height: 55vh; }

/* la barra in fondo si vede solo sotto la soglia: il suo foglio si carica con
   una media query, quindi senza questa riga sopra la soglia resterebbe stampata
   come un blocco qualsiasi in fondo alla pagina */
.iw-barra-telefono { display: none; }

.iw-pagina { padding-block: var(--iw-spazio-7); }
/* disegnata con Elementor: i margini li mette lui, sezione per sezione */
.iw-pagina--disegnata { padding-block: 0; }
.iw-pagina__corpo > :last-child { margin-bottom: 0; }

.iw-elenco { display: grid; gap: var(--iw-spazio-5); margin-bottom: var(--iw-spazio-6); }
.iw-elenco__voce { padding-bottom: var(--iw-spazio-5); border-bottom: 1px solid var(--iw-bordo); }
.iw-elenco__titolo { font-size: var(--iw-titolo-3); margin-bottom: var(--iw-spazio-2); }
.iw-elenco__titolo a { color: var(--iw-testo); text-decoration: none; }
.iw-elenco__titolo a:hover { color: var(--iw-accento); }
.iw-elenco__estratto { color: var(--iw-testo-tenue); }

.iw-404 { max-width: 640px; }
.iw-404__azioni { display: flex; flex-wrap: wrap; align-items: center; gap: var(--iw-spazio-4); margin-top: var(--iw-spazio-5); }

/* -------------------------------------------------------------- pulsanti */

.button,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-height: 44px;
  padding: 0.75em 1.4em;
  border: 0;
  border-radius: var(--iw-raggio-piccolo);
  background: var(--iw-accento);
  color: var(--iw-accento-testo);
  font: 600 0.95rem/1.2 var(--iw-font-testo);
  letter-spacing: 0.01em;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--iw-transizione), color var(--iw-transizione);
}
.button:hover,
.wp-element-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
  background: var(--iw-accento-scuro);
  color: var(--iw-accento-testo);
}
/* il pulsante spento resta spento anche sotto il mouse: senza la riga
   «:hover» qui sotto vince il viola di WooCommerce (#7f54b3) */
.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button.disabled,
.woocommerce button.button.alt.disabled,
.woocommerce button.button:disabled[disabled],
.woocommerce a.button.disabled:hover,
.woocommerce button.button:disabled:hover,
.woocommerce button.button.disabled:hover,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button:disabled[disabled]:hover {
  background: color-mix(in srgb, var(--iw-testo) 11%, var(--iw-superficie));
  color: var(--iw-testo-tenue);
  opacity: 1;
}

.iw-link { color: var(--iw-testo); font-weight: 500; }

/* ----------------------------------------------------------------- campi */

input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="search"], input[type="number"], input[type="url"], select, textarea,
.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce-page form .form-row .input-text {
  width: 100%;
  min-height: 44px;
  padding: 0.65em 0.85em;
  border: 1px solid var(--iw-bordo-forte);
  border-radius: var(--iw-raggio-piccolo);
  background: var(--iw-superficie);
  color: var(--iw-testo);
  font: inherit;
  transition: border-color var(--iw-transizione), box-shadow var(--iw-transizione);
}
input:focus, select:focus, textarea:focus,
.woocommerce form .form-row .input-text:focus {
  border-color: var(--iw-accento);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--iw-accento) 22%, transparent);
  outline: none;
}
.woocommerce .quantity .qty { width: 5em; text-align: center; }

/* quantita con + e − (assets/js/tema.js): un solo controllo con bordo */
.woocommerce .quantity.iw-quantita {
  display: inline-flex;
  align-items: stretch;
  min-height: 44px;
  border: 1px solid var(--iw-bordo-forte);
  border-radius: var(--iw-raggio-piccolo);
  background: var(--iw-superficie);
  overflow: hidden;
}
.woocommerce .quantity.iw-quantita .qty {
  width: 3.2em;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-weight: 600;
  -moz-appearance: textfield;
  appearance: textfield;
}
.woocommerce .quantity.iw-quantita .qty::-webkit-outer-spin-button,
.woocommerce .quantity.iw-quantita .qty::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.woocommerce .quantity.iw-quantita .qty:focus { box-shadow: none; }
.woocommerce .quantity.iw-quantita:focus-within { border-color: var(--iw-accento); box-shadow: 0 0 0 3px color-mix(in srgb, var(--iw-accento) 22%, transparent); }
.iw-quantita__passo {
  flex: none;
  width: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--iw-testo);
  font: 500 1.2rem/1 var(--iw-font-testo);
  cursor: pointer;
}
.iw-quantita__passo:hover { background: var(--iw-velo); }

label { font-weight: 500; }

input[type="checkbox"], input[type="radio"] { accent-color: var(--iw-accento); }

/* --------------------------------------------------------------- testata */

.iw-testata {
  position: relative;
  top: 0;
  z-index: 50;
  background: var(--iw-superficie);
  border-bottom: 1px solid var(--iw-bordo);
}
.iw-testata-fissa .iw-testata { position: sticky; }
.admin-bar .iw-testata { top: 32px; }
@media (max-width: 782px) { .admin-bar .iw-testata { top: 46px; } }
@media (max-width: 600px) { .admin-bar .iw-testata { top: 0; } }
/* opzione «barra annunci ferma»: la barra resta in cima e la testata si ferma subito sotto.
   --iw-annunci-h la misura tema.js (la barra può andare a capo, o essere chiusa con la ×) */
/* body. davanti: la regola della × (.iw-annunci--chiudibile:not(...), più avanti) ha la stessa forza e metterebbe relative */
body.iw-annunci-fissa .iw-annunci { position: sticky; top: 0; z-index: 51; }
.iw-annunci-fissa .iw-testata { top: var(--iw-annunci-h, 0px); }
.admin-bar.iw-annunci-fissa .iw-annunci { top: 32px; }
.admin-bar.iw-annunci-fissa .iw-testata { top: calc(32px + var(--iw-annunci-h, 0px)); }
@media (max-width: 782px) {
  .admin-bar.iw-annunci-fissa .iw-annunci { top: 46px; }
  .admin-bar.iw-annunci-fissa .iw-testata { top: calc(46px + var(--iw-annunci-h, 0px)); }
}
@media (max-width: 600px) {
  .admin-bar.iw-annunci-fissa .iw-annunci { top: 0; }
  .admin-bar.iw-annunci-fissa .iw-testata { top: var(--iw-annunci-h, 0px); }
}

.iw-testata__riga {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: "logo menu azioni";
  align-items: center;
  /* anche lo stacco fra logo, menu e icone si stringe: sono 48 px che appena
     sopra la soglia del cassetto decidono se il menu sta in riga o va a capo */
  gap: clamp(var(--iw-spazio-3), 1.6vw, var(--iw-spazio-5));
  min-height: var(--iw-altezza-testata);
}
/* .iw-testata davanti: .iw-azione, scritta piu sotto, altrimenti lo rimette visibile */
.iw-testata .iw-testata__apri { display: none; grid-area: apri; }
.iw-menu .iw-menu__chiudi { display: none; }
.iw-testata__logo { grid-area: logo; min-width: 0; }
.iw-menu { grid-area: menu; min-width: 0; }
.iw-testata__azioni { grid-area: azioni; display: flex; align-items: center; justify-content: flex-end; gap: var(--iw-spazio-1); }

.iw-testata__nome {
  font: 700 1.25rem/1.1 var(--iw-font-titoli);
  letter-spacing: -0.02em;
  color: var(--iw-testo);
  text-decoration: none;
}
.iw-testata__nome:hover { color: var(--iw-testo); }
.iw-testata .custom-logo { display: block; width: auto; max-height: 48px; }

/* centrata: logo in mezzo, menu sotto su tutta la riga */
.iw-testata--centrata .iw-testata__riga {
  grid-template-columns: 1fr auto 1fr;
  grid-template-areas: "apri logo azioni" "menu menu menu";
  row-gap: 0;
  padding-top: var(--iw-spazio-3);
}
.iw-testata--centrata .iw-menu { border-top: 1px solid var(--iw-bordo); margin-top: var(--iw-spazio-3); }
.iw-testata--centrata .iw-testata__logo { text-align: center; }

.iw-menu__lista {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*
   * Lo spazio fra le voci si stringe con la finestra. Fisso a 24 px, appena
   * sopra la soglia del cassetto il menu non ci stava piu e andava a capo: la
   * testata passava da 72 a 97 px proprio nella fascia 900-1100. Il ritorno a
   * capo resta possibile (e la valvola di sicurezza di un menu lunghissimo),
   * ma smette di scattare con quattro voci corte.
   */
  gap: 0 clamp(var(--iw-spazio-2), 1.4vw, var(--iw-spazio-5));
  margin: 0;
  padding: 0;
  list-style: none;
}
.iw-menu .menu-item { position: relative; }
.iw-menu a {
  display: block;
  padding: var(--iw-spazio-3) var(--iw-spazio-1);
  color: var(--iw-testo);
  font-size: 0.95rem;
  font-weight: 500;
  text-decoration: none;
}
.iw-menu a:hover,
.iw-menu .current-menu-item > a,
.iw-menu .current-menu-ancestor > a { color: var(--iw-accento); }

.iw-menu .sub-menu {
  position: absolute;
  top: 100%;
  left: calc(-1 * var(--iw-spazio-3));
  z-index: 10;
  min-width: 220px;
  margin: 0;
  padding: var(--iw-spazio-2);
  list-style: none;
  background: var(--iw-superficie);
  border: 1px solid var(--iw-bordo);
  border-radius: var(--iw-raggio);
  box-shadow: var(--iw-ombra);
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity var(--iw-transizione), transform var(--iw-transizione), visibility var(--iw-transizione);
}
.iw-menu .sub-menu a { padding: var(--iw-spazio-2) var(--iw-spazio-3); border-radius: var(--iw-raggio-piccolo); }
.iw-menu .sub-menu a:hover { background: var(--iw-velo); }
.iw-menu .menu-item:hover > .sub-menu,
.iw-menu .menu-item:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }

.iw-azione {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--iw-testo);
  cursor: pointer;
  list-style: none;
  transition: background-color var(--iw-transizione);
}
.iw-azione::-webkit-details-marker { display: none; }
.iw-azione:hover { background: var(--iw-velo); color: var(--iw-testo); }
.iw-azione svg { width: 22px; height: 22px; }

.iw-carrello__numero {
  position: absolute;
  top: 3px;
  right: 1px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--iw-accento);
  color: var(--iw-accento-testo);
  font: 700 11px/18px var(--iw-font-testo);
  text-align: center;
}
.iw-carrello__numero[data-numero="0"] { display: none; }

.woocommerce-product-search { display: flex; gap: var(--iw-spazio-2); }
.woocommerce-product-search input[type="search"] { flex: 1; min-width: 0; }
.woocommerce-product-search button { flex: none; }

/* telefono: le due disposizioni diventano una */


/* ------------------------------------------------------- mini carrello */

.iw-carrellino { position: fixed; inset: 0; z-index: 100; visibility: hidden; }
.iw-carrellino--aperto { visibility: visible; }
.iw-carrellino-aperto { overflow: hidden; }
.iw-carrellino__velo { position: absolute; inset: 0; background: rgb(0 0 0 / 0.35); opacity: 0; transition: opacity 220ms ease; }
.iw-carrellino--aperto .iw-carrellino__velo { opacity: 1; }
.iw-carrellino__pannello {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  width: min(92vw, 420px);
  background: var(--iw-superficie);
  box-shadow: var(--iw-ombra);
  transform: translateX(105%);
  transition: transform 240ms ease;
}
.iw-carrellino--aperto .iw-carrellino__pannello { transform: none; }
.iw-carrellino__pannello:focus { outline: none; }
.iw-carrellino__testa {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  padding: var(--iw-spazio-2) var(--iw-spazio-3) var(--iw-spazio-2) var(--iw-spazio-5);
  border-bottom: 1px solid var(--iw-bordo);
}
.iw-carrellino__titolo { margin: 0; font-size: 1.1rem; font-family: var(--iw-font-titoli); font-weight: var(--iw-titoli-peso, 600); line-height: 1.15; letter-spacing: -0.02em; color: var(--iw-testo); }

.iw-carrellino .widget_shopping_cart_content { display: flex; flex: 1; flex-direction: column; min-height: 0; }
/* ul e li nei selettori: WooCommerce (.woocommerce ul.product_list_widget li img) pesa di piu delle sole classi */
.iw-carrellino ul.woocommerce-mini-cart {
  flex: 1;
  margin: 0;
  padding: 0 var(--iw-spazio-5);
  overflow-y: auto;
  list-style: none;
}
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  column-gap: var(--iw-spazio-3);
  padding: var(--iw-spazio-4) 32px var(--iw-spazio-4) 0;
  border-bottom: 1px solid var(--iw-bordo);
  font-size: 0.95rem;
}
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item > a:not(.remove) {
  display: contents;
  color: var(--iw-testo);
  font-weight: 500;
  text-decoration: none;
}
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item img {
  float: none;
  grid-row: 1 / span 3;
  width: 64px;
  height: 64px;
  margin: 0;
  border-radius: var(--iw-raggio-piccolo);
  object-fit: cover;
}
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item .variation { margin: var(--iw-spazio-1) 0 0; color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); }
.iw-carrellino .woocommerce-mini-cart-item .variation dt,
.iw-carrellino .woocommerce-mini-cart-item .variation dd { display: inline; margin: 0; }
.iw-carrellino .woocommerce-mini-cart-item .variation dd p { display: inline; margin: 0; }
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item .quantity { grid-column: 2; margin-top: var(--iw-spazio-1); color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); }
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item a.remove {
  position: absolute;
  top: var(--iw-spazio-4);
  right: 0;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: var(--iw-testo-tenue) !important; /* WooCommerce: a.remove rosso con !important */
  font-size: 1.3rem;
  line-height: 1;
  text-decoration: none;
}
.iw-carrellino ul.woocommerce-mini-cart li.woocommerce-mini-cart-item a.remove:hover { background: var(--iw-velo); color: var(--iw-testo) !important; }

.iw-carrellino .woocommerce-mini-cart__total {
  display: flex;
  flex: none;
  justify-content: space-between;
  margin: 0;
  padding: var(--iw-spazio-4) var(--iw-spazio-5) var(--iw-spazio-2);
  border-top: 1px solid var(--iw-bordo);
  font-size: 1rem;
}
.iw-carrellino .woocommerce-mini-cart__buttons {
  display: grid;
  flex: none;
  /* due colonne se il testo ci sta, altrimenti uno sotto l altro */
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
  gap: var(--iw-spazio-2);
  margin: 0;
  padding: var(--iw-spazio-2) var(--iw-spazio-5) calc(var(--iw-spazio-5) + env(safe-area-inset-bottom, 0px));
}
.iw-carrellino .woocommerce-mini-cart__buttons .button { width: 100%; margin: 0; white-space: nowrap; }
.iw-carrellino .woocommerce-mini-cart__buttons .button:not(.checkout) {
  border: 1px solid var(--iw-bordo-forte);
  background: transparent;
  color: var(--iw-testo);
}
.iw-carrellino .woocommerce-mini-cart__empty-message { padding: var(--iw-spazio-6) var(--iw-spazio-5); color: var(--iw-testo-tenue); text-align: center; }

/*
 * IL PIEDE DEL PANNELLO: TUTTO PARTE DA 24 PX.
 *
 * I pezzi di WooCommerce (subtotale, pulsanti) e il blocco del CAP hanno gia
 * la loro imbottitura; qui si mettono in riga gli altri due, e si da al piede
 * un passo verticale regolare.
 *
 * NIENTE REGOLA BUONA PER TUTTI. Ci avevo provato, con una riga che dava
 * l imbottitura a ogni figlio del pannello: ha scavalcato quella del riquadro
 * della consegna, che tiene l icona nello sfondo e usa i 38 px di sinistra per
 * farle spazio. Risultato: il camion sotto la scritta. Un blocco nuovo qui in
 * mezzo si allinea aggiungendo la sua riga sotto, non da solo: due righe in
 * piu valgono piu di una regola che ogni tanto rompe qualcosa.
 */
.iw-carrellino .woocommerce-mini-cart__total { padding-bottom: var(--iw-spazio-1); }
.iw-carrellino .iw-risparmio-mini { margin: 0 0 var(--iw-spazio-2); padding-inline: var(--iw-spazio-5); }
.iw-carrellino .iw-stima-spedizione { padding-bottom: var(--iw-spazio-2); }
.iw-carrellino .woocommerce-mini-cart__buttons { padding-top: var(--iw-spazio-2); padding-bottom: var(--iw-spazio-4); }
.iw-carrellino .iw-paga-mini {
  margin-top: 0;
  padding: var(--iw-spazio-3) var(--iw-spazio-5) calc(var(--iw-spazio-4) + env(safe-area-inset-bottom, 0px));
}
/*
 * Sul telefono il piede si prendeva 443 px su 844 — piu di meta schermo — e ai
 * prodotti ne restavano 255, due righe e mezzo: il cliente non vede quello che
 * sta comprando. I modi di pagare sono i 163 px piu grossi e sono anche l unica
 * cosa che rivede identica sulla scheda e alla cassa: qui non servono.
 *
 * Stessa soglia della finestra rapida: e lo stesso problema, l altezza che non
 * basta, non la larghezza.
 */
@media (max-width: 719px) {
  .iw-carrellino .iw-paga-mini { display: none; }
  /* i pulsanti diventano l ultimo blocco: lo spazio della barra gesti va
     rimesso qui, prima lo teneva la fila dei pagamenti */
  .iw-carrellino .woocommerce-mini-cart__buttons {
    padding-bottom: calc(var(--iw-spazio-4) + env(safe-area-inset-bottom, 0px));
  }
}

.iw-spedizione-gratis { flex: none; padding: var(--iw-spazio-3) var(--iw-spazio-5); background: var(--iw-fondo-tenue); font-size: var(--iw-testo-piccolo); }
.iw-spedizione-gratis[hidden] { display: none; }
.iw-spedizione-gratis__testo { margin: 0 0 var(--iw-spazio-2); }
.iw-spedizione-gratis__barra { height: 6px; overflow: hidden; border-radius: 3px; background: var(--iw-bordo); }
.iw-spedizione-gratis__barra span { display: block; height: 100%; border-radius: 3px; background: var(--iw-accento); transform-origin: left; transition: transform 300ms ease; }
.iw-spedizione-gratis--raggiunta .iw-spedizione-gratis__barra span { background: #1a7f37; }

/* − e + nel mini carrello: 32 px a testa, la cifra in mezzo non si muove */
/*
 * Il + sta al bordo destro, non appiccicato al prezzo: con uno sconto in mezzo
 * al testo («3 × 35,50 € 28,40 €») la riga si allarga e il + scivolava via —
 * 58 px piu a destra che nella riga accanto a prezzo pieno, 39 sul telefono.
 * Cosi i due pulsanti restano incolonnati riga dopo riga, sconto o no.
 */
.iw-qta { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--iw-spazio-2); }
.iw-qta .quantity { min-width: 5.5em; }
.iw-qta__meno, .iw-qta__piu {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--iw-bordo-forte);
  border-radius: 50%;
  background: var(--iw-superficie);
  color: var(--iw-testo);
  font: 500 1rem/1 var(--iw-font-testo);
  cursor: pointer;
}
.iw-qta__meno:hover, .iw-qta__piu:hover { border-color: var(--iw-testo); }
.iw-carrellino--attesa .widget_shopping_cart_content { opacity: 0.5; pointer-events: none; transition: opacity var(--iw-transizione); }

/* lo sconto dove si paga: prezzo pieno barrato e quanto si risparmia */
.iw-riga__pieno { margin-right: 6px; color: var(--iw-testo-tenue); font-weight: 400; text-decoration: line-through; }
.iw-riga__risparmio { display: block; margin-top: 2px; color: var(--iw-offerta); font-size: var(--iw-testo-piccolo); font-weight: 600; }
.woocommerce .iw-risparmio th, .woocommerce .iw-risparmio td { color: var(--iw-offerta); }
.iw-risparmio__voce { display: block; color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); font-weight: 400; }
.iw-risparmio-mini { margin: 0 0 var(--iw-spazio-3); color: var(--iw-offerta); font-size: var(--iw-testo-piccolo); }
.iw-risparmio-mini span { color: var(--iw-testo-tenue); }

/* ----------------------------------------------------------------- piede */

.iw-piede {
  margin-top: var(--iw-spazio-8);
  padding-block: var(--iw-spazio-7) var(--iw-spazio-5);
  background: var(--iw-superficie);
  border-top: 1px solid var(--iw-bordo);
  color: var(--iw-testo-tenue);
  font-size: var(--iw-testo-piccolo);
}
.iw-piede__griglia { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--iw-spazio-6); }
.iw-piede__nome { margin-bottom: var(--iw-spazio-2); color: var(--iw-testo); font: 600 1.05rem/1.3 var(--iw-font-titoli); }
.iw-piede__logo { margin: 0 0 var(--iw-spazio-3); }
.iw-piede__logo img { display: block; width: auto; max-width: 200px; max-height: 56px; height: auto; }
.iw-piede__menu ul { display: flex; flex-wrap: wrap; gap: var(--iw-spazio-2) var(--iw-spazio-5); margin: 0; padding: 0; list-style: none; }
.iw-piede a { color: var(--iw-testo-tenue); text-decoration: none; }
.iw-piede a:hover { color: var(--iw-testo); }
/* la linea sta sul paragrafo, non sul contenitore: cosi parte dal margine del testo */
.iw-piede__base { margin-top: var(--iw-spazio-6); }
.iw-piede__base p { margin: 0; padding-top: var(--iw-spazio-4); border-top: 1px solid var(--iw-bordo); }

/* ------------------------------------------------ WooCommerce, prima mano
   Il minimo per stare nel sistema grafico: catalogo, scheda, carrello e
   checkout vestiti davvero arrivano nelle fasi 2, 3 e 4. */

.iw-negozio { padding-block: var(--iw-spazio-6) var(--iw-spazio-7); }

.iw-briciole { margin-bottom: var(--iw-spazio-5); color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); }
.woocommerce .woocommerce-breadcrumb { margin-bottom: var(--iw-spazio-5); color: var(--iw-testo-tenue); }
.woocommerce .woocommerce-breadcrumb a { color: var(--iw-testo-tenue); }
.iw-briciole__separatore { margin-inline: var(--iw-spazio-2); opacity: 0.6; }

.woocommerce-message, .woocommerce-info, .woocommerce-error,
.woocommerce-noreviews, p.no-comments {
  border: 1px solid var(--iw-bordo);
  border-radius: var(--iw-raggio-piccolo);
  background: var(--iw-superficie);
  color: var(--iw-testo);
}
.woocommerce-error { border-color: #B42318; }
.woocommerce-message::before, .woocommerce-info::before { color: var(--iw-accento); }

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price { color: var(--iw-testo); }
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del { color: var(--iw-testo-tenue); }

.woocommerce span.onsale {
  min-width: 0;
  min-height: 0;
  padding: 0.35em 0.7em;
  border-radius: 999px;
  background: var(--iw-offerta);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
}

/* ------------------------------------------------------ griglia e carte
   Qui e non in negozio.css: le carte compaiono anche nei correlati, nel
   carrello e nelle pagine costruite con Elementor. */

.woocommerce ul.products,
.woocommerce-page ul.products {
  display: grid;
  grid-template-columns: repeat(var(--iw-colonne-telefono, 2), minmax(0, 1fr));
  gap: var(--iw-spazio-6) var(--iw-spazio-4);
  margin: 0;
  padding: 0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after { content: none; display: none; }
@media (min-width: 600px) {
  .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--iw-spazio-6) var(--iw-spazio-5); }
}
@media (min-width: 1280px) {
  .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(var(--iw-colonne, 4), minmax(0, 1fr)); }
}

/*
 * La classe «product» e ripetuta apposta. WooCommerce, quando il negozio ha
 * un numero di colonne impostato, scrive «.woocommerce ul.products.columns-3
 * li.product{width:30.75%}»: stesso peso di questa regola, e vince perche il
 * suo foglio arriva dopo. Con «li.product.product» il peso e maggiore e la
 * carta torna larga quanto la sua colonna della griglia.
 */
.woocommerce ul.products li.product.product,
.woocommerce-page ul.products li.product.product,
.woocommerce ul.products[class*="columns-"] li.product.product,
.woocommerce-page ul.products[class*="columns-"] li.product.product {
  position: relative;
  display: flex;
  flex-direction: column;
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  text-align: left;
}

.iw-carta__media {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: var(--iw-raggio);
  background: var(--iw-velo);
}
.woocommerce ul.products li.product .iw-carta__foto {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
  object-fit: cover;
  transition: opacity 240ms ease, transform 400ms ease;
}
.woocommerce ul.products li.product .iw-carta__foto--seconda { position: absolute; inset: 0; display: none; opacity: 0; }
@media (hover: hover) {
  .woocommerce ul.products li.product .iw-carta__foto--seconda { display: block; }
  .iw-carta:hover .iw-carta__foto--seconda { opacity: 1; }
  .iw-carta:hover .iw-carta__foto { transform: scale(1.03); }
}

.iw-carta__etichette {
  position: absolute;
  top: var(--iw-spazio-2);
  left: var(--iw-spazio-2);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--iw-spazio-1);
  pointer-events: none;
}
.iw-etichetta {
  display: inline-block;
  padding: 0.3em 0.65em;
  border-radius: 999px;
  background: var(--iw-superficie);
  color: var(--iw-testo);
  font: 600 0.75rem/1.2 var(--iw-font-testo);
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.08);
}
.iw-etichetta--offerta { background: var(--iw-offerta); color: #fff; }
.iw-etichetta--esaurito { background: var(--iw-testo); color: var(--iw-superficie); }

.iw-carta__corpo { display: flex; flex: 1; flex-direction: column; gap: var(--iw-spazio-1); padding-top: var(--iw-spazio-3); }

.woocommerce ul.products li.product .woocommerce-loop-product__title.iw-carta__titolo {
  margin: 0;
  padding: 0;
  color: var(--iw-testo);
  font: 500 0.95rem/1.35 var(--iw-font-testo);
  letter-spacing: 0;
}
/*
 * Due righe riservate al titolo, anche quando ne basta una. Stessa ragione
 * della riga tecnica e delle stelle: in una griglia, un titolo corto accanto a
 * uno lungo porta il prezzo venti pixel piu in alto e la riga si vede storta.
 */
.iw-carta__link {
  display: -webkit-box;
  min-height: 2.7em;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.iw-carta__link:hover { color: inherit; text-decoration: underline; }
/* tutta la carta e il link: il pulsante sta sopra (z-index) */
.iw-carta__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.iw-carta__link:focus-visible { outline: none; }
.iw-carta__link:focus-visible::after { outline: 2px solid var(--iw-accento); outline-offset: 4px; border-radius: var(--iw-raggio); }

.woocommerce ul.products li.product .price { margin: 0; color: var(--iw-testo); font-size: 0.95rem; font-weight: 600; }
.woocommerce ul.products li.product .price del { color: var(--iw-testo-tenue); font-weight: 400; opacity: 1; }
.woocommerce ul.products li.product .price ins { color: var(--iw-offerta); text-decoration: none; }
.iw-prezzo-da { color: var(--iw-testo-tenue); font-size: 0.85em; font-weight: 400; }
.iw-prezzo-formato { display: block; margin-top: 2px; color: var(--iw-testo-tenue); font-size: 0.8125rem; font-weight: 400; }
.woocommerce ul.products li.product .star-rating { margin: 0; font-size: 0.75rem; }

/* riga tecnica: una riga sola, sempre alta uguale anche quando e vuota */
.iw-carta__tecnica {
  margin: 0;
  overflow: hidden;
  color: var(--iw-testo-tenue);
  font-size: 0.8125rem;
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* l altezza della riga dei colori e riservata anche prima che arrivino le foto (CLS) */
.iw-carta__colori { display: flex; align-items: center; gap: 4px; min-height: 16px; margin-top: 2px; }
.iw-pallino { display: inline-block; width: 14px; height: 14px; border: 1px solid rgb(0 0 0 / 0.14); border-radius: 50%; }
.iw-carta__colori-altri { margin-left: 2px; color: var(--iw-testo-tenue); font-size: 0.75rem; }

/*
 * Mini-foto dei colori. Stanno sopra il velo che rende cliccabile tutta la
 * carta (iw-carta__link::after, z-index 1), se no il mouse non le trova mai.
 */
.iw-carta__colori--foto { position: relative; z-index: 2; gap: 6px; min-height: 34px; }
.iw-carta__colore {
  display: block;
  width: 32px;
  height: 32px;
  overflow: hidden;
  border-radius: var(--iw-raggio-piccolo);
  box-shadow: 0 0 0 1px var(--iw-bordo);
  transition: box-shadow var(--iw-transizione);
}
.iw-carta__colore:hover, .iw-carta__colore:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--iw-testo); }
.woocommerce ul.products li.product .iw-carta__colore img { display: block; width: 100%; height: 100%; margin: 0; border-radius: 0; object-fit: cover; }

.iw-carta__azioni { position: relative; z-index: 2; margin-top: var(--iw-spazio-3); }
/* WooCommerce rimette display:inline-block con un selettore piu pesante: qui si riprende il flex */
.woocommerce ul.products li.product .iw-carta__azioni .button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 0.55em 1em;
  font-size: 0.9rem;
}
/* "Scegli" e "Vedi" portano alla scheda: contorno, non pieno */
.woocommerce ul.products li.product .iw-carta__azioni .button:not(.add_to_cart_button),
.woocommerce ul.products li.product .iw-carta__azioni .button.product_type_variable {
  border: 1px solid var(--iw-bordo-forte);
  background: transparent;
  color: var(--iw-testo);
}
.woocommerce ul.products li.product .iw-carta__azioni .button:not(.add_to_cart_button):hover,
.woocommerce ul.products li.product .iw-carta__azioni .button.product_type_variable:hover {
  border-color: var(--iw-testo);
  background: transparent;
  color: var(--iw-testo);
}
.woocommerce ul.products li.product .iw-carta__azioni .added_to_cart {
  display: none;
  padding-top: var(--iw-spazio-2);
  color: var(--iw-testo);
  font-size: var(--iw-testo-piccolo);
  text-align: center;
}

.woocommerce .star-rating span::before { color: var(--iw-testo); }

.woocommerce table.shop_table { border-color: var(--iw-bordo); border-radius: var(--iw-raggio); background: var(--iw-superficie); }
.woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--iw-bordo); }

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
  background: var(--iw-superficie);
  border: 1px solid var(--iw-bordo);
  border-radius: var(--iw-raggio);
}
#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box { background: var(--iw-fondo-tenue); color: var(--iw-testo); }
#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--iw-fondo-tenue); }

/* ============================================================ gestore 0.2 */

.iw-pulsanti-maiuscolo .button,
.iw-pulsanti-maiuscolo .wp-element-button { text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.85rem; }

.iw-icona { width: 22px; height: 22px; flex: none; }

/* ---------------------------------------------------------- barra annunci */

.iw-annunci { background: var(--iw-accento); color: var(--iw-accento-testo); font-size: 0.8125rem; }
.iw-annunci--tenue { background: var(--iw-fondo-tenue); color: var(--iw-testo); border-bottom: 1px solid var(--iw-bordo); }
.iw-annunci__binario { display: grid; place-items: center; min-height: 38px; text-align: center; }
.iw-annunci__voce { grid-area: 1 / 1; margin: 0; padding: var(--iw-spazio-2) 0; font-weight: 500; letter-spacing: 0.01em; animation: iw-annuncio 400ms ease both; }
.iw-annunci__voce[hidden] { display: none; }
.iw-annunci a { color: inherit; text-underline-offset: 0.2em; }
@keyframes iw-annuncio { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* che scorre: due copie identiche di seguito, e il nastro torna al punto di
   partenza quando la prima e uscita. Il giro non ha buchi e non ha salti. */
.iw-annunci--scorre { position: relative; overflow: hidden; }
.iw-annunci--scorre .iw-annunci__nastro { display: flex; width: max-content; animation: iw-nastro var(--iw-annunci-giro, 40s) linear infinite; }
.iw-annunci--scorre .iw-annunci__binario { display: flex; gap: var(--iw-spazio-6, 3rem); align-items: center; padding-right: var(--iw-spazio-6, 3rem); min-height: 38px; }
.iw-annunci--scorre .iw-annunci__voce { grid-area: auto; white-space: nowrap; animation: none; }
.iw-annunci--scorre:hover .iw-annunci__nastro { animation-play-state: paused; }
@keyframes iw-nastro { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .iw-annunci--scorre .iw-annunci__nastro { animation: none; }
  .iw-annunci--scorre { overflow-x: auto; }
}

.iw-annunci__chiudi {
  position: absolute; top: 50%; right: max(12px, env(safe-area-inset-right, 0px)); transform: translateY(-50%);
  display: grid; place-items: center; width: 28px; height: 28px; padding: 0;
  border: 0; border-radius: 50%; background: none; color: inherit; cursor: pointer; opacity: 0.75;
}
.iw-annunci__chiudi:hover { opacity: 1; }
.iw-annunci__chiudi svg { width: 14px; height: 14px; }
.iw-annunci--chiudibile:not(.iw-annunci--scorre) { position: relative; }
.iw-annunci[hidden] { display: none; }

/* ------------------------------------------------------- riga di servizio */

.iw-servizio { background: var(--iw-fondo-tenue); border-bottom: 1px solid var(--iw-bordo); font-size: 0.8125rem; }
.iw-servizio__riga { display: flex; align-items: center; justify-content: space-between; gap: var(--iw-spazio-4, 1.5rem); min-height: 42px; flex-wrap: wrap; }
.iw-servizio__testo { margin: 0; }
.iw-servizio__lista { display: flex; align-items: center; gap: var(--iw-spazio-4, 1.5rem); margin: 0; padding: 0; list-style: none; }
.iw-servizio a { color: inherit; text-decoration: none; }
.iw-servizio a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
/* con il selettore della lingua dentro, la riga segue invece la soglia del menu (testata-piccola.css):
   c è quando il menu è in riga, e sotto la lingua si sceglie in fondo al cassetto. Mai due selettori, mai nessuno */
@media (max-width: 900px) { .iw-servizio:not(:has(.iw-lingue)) { display: none; } }
/* la lingua va a destra accanto al menu della riga (frase a sinistra), qualunque cosa ci sia */
.iw-servizio__riga:has(.iw-lingue) .iw-servizio__menu, .iw-servizio__testo + .iw-lingue, .iw-servizio .iw-lingue:first-child { margin-left: auto; }

/* --------------------------------------------------------------- ricerca */

/* la ricerca chiusa non occupa spazio: lasciandola nel flusso, sul telefono
   il suo pannello (largo quanto il contenitore che lo ancora) spingeva la
   pagina di lato e il sito scorreva in orizzontale */
.iw-cerca { position: static; }
details.iw-cerca:not([open]) > .iw-cerca__pannello { display: none; }
.iw-cerca__pannello {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  width: auto;
  padding: var(--iw-spazio-5) 0 var(--iw-spazio-6);
  background: var(--iw-superficie);
  border: 0;
  border-top: 1px solid var(--iw-bordo);
  border-radius: 0;
  box-shadow: 0 24px 40px -24px rgb(0 0 0 / 0.25);
}
.iw-cerca__interno { max-width: 880px; }
.iw-cerca__modulo { position: relative; display: flex; gap: var(--iw-spazio-2); }
.iw-cerca__modulo input[type="search"] { flex: 1; min-width: 0; min-height: 52px; padding-left: 48px; font-size: 1.05rem; border-radius: 999px; }
.iw-cerca__lente { position: absolute; top: 50%; left: 16px; width: 22px; height: 22px; color: var(--iw-testo-tenue); transform: translateY(-50%); pointer-events: none; }
.iw-cerca__invia { border-radius: 999px; min-height: 52px; padding-inline: 1.6em; }
.iw-cerca__risultati:empty { display: none; }
.iw-cerca__risultati { margin-top: var(--iw-spazio-5); }
.iw-cerca__titoletto { margin: 0 0 var(--iw-spazio-3); color: var(--iw-testo-tenue); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.iw-cerca__suggerite ul, .iw-cerca__categorie { display: flex; flex-wrap: wrap; gap: var(--iw-spazio-2); margin: 0; padding: 0; list-style: none; }
.iw-cerca__suggerite a, .iw-cerca__categorie a {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 var(--iw-spazio-4);
  border: 1px solid var(--iw-bordo); border-radius: 999px; color: var(--iw-testo); font-size: var(--iw-testo-piccolo); text-decoration: none;
}
.iw-cerca__suggerite a:hover, .iw-cerca__categorie a:hover { border-color: var(--iw-testo); color: var(--iw-testo); }
.iw-cerca__categorie span { color: var(--iw-testo-tenue); }
.iw-cerca__gruppo + .iw-cerca__gruppo { margin-top: var(--iw-spazio-5); }
.iw-cerca__prodotti { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--iw-spazio-2); margin: 0; padding: 0; list-style: none; }
.iw-cerca__prodotto { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: var(--iw-spazio-3); padding: var(--iw-spazio-2); border-radius: var(--iw-raggio-piccolo); color: var(--iw-testo); text-decoration: none; }
.iw-cerca__prodotto:hover, .iw-cerca__prodotto:focus-visible { background: var(--iw-velo); color: var(--iw-testo); }
.iw-cerca__prodotto img { width: 56px; height: 56px; border-radius: var(--iw-raggio-piccolo); object-fit: cover; background: var(--iw-velo); }
.iw-cerca__nome { display: block; overflow: hidden; font-size: 0.9rem; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; }
.iw-cerca__prezzo { display: block; font-size: 0.85rem; }
.iw-cerca__prezzo ins { color: var(--iw-offerta); text-decoration: none; }
.iw-cerca__prezzo del { color: var(--iw-testo-tenue); }
.iw-cerca__tutti { display: inline-flex; align-items: center; gap: var(--iw-spazio-2); margin-top: var(--iw-spazio-4); color: var(--iw-testo); font-weight: 600; }
.iw-cerca__tutti .iw-icona { width: 18px; height: 18px; }
.iw-cerca__nulla { margin: 0; color: var(--iw-testo-tenue); }
.iw-cerca--attesa .iw-cerca__risultati { opacity: 0.55; transition: opacity var(--iw-transizione); }
@media (max-width: 899px) {
  /* su telefono il pannello copre la pagina sotto la testata, e scorre da solo */
  .iw-cerca__pannello { height: calc(100dvh - var(--iw-altezza-testata) - var(--iw-annunci-h, 0px)); overflow-y: auto; padding-top: var(--iw-spazio-4); overscroll-behavior: contain; }
  .iw-cerca__invia { display: none; }
  .iw-cerca__prodotti { grid-template-columns: 1fr; }
}

/* ----------------------------------------------------------------- stelle */

.iw-valutazione { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.iw-stelle { position: relative; display: inline-block; line-height: 0; }
.iw-stelle__vuote, .iw-stelle__piene { display: flex; gap: 1px; white-space: nowrap; }
.iw-stelle svg { width: 15px; height: 15px; flex: none; }
.iw-stelle__vuote svg { fill: color-mix(in srgb, var(--iw-testo) 16%, transparent); }
.iw-stelle__piene { position: absolute; inset: 0 auto 0 0; overflow: hidden; }
.iw-stelle__piene svg { fill: var(--iw-testo); }
.iw-stelle__conta { color: var(--iw-testo-tenue); font-size: 0.8rem; }
.iw-stelle__link { color: inherit; text-decoration: none; }
.iw-stelle__link:hover .iw-stelle__conta { color: var(--iw-testo); text-decoration: underline; }
/* alta uguale anche senza recensioni: tiene in riga i prezzi delle carte vicine */
.iw-carta__stelle { min-height: 19px; }
.iw-carta .iw-stelle svg { width: 13px; height: 13px; }

/* ---------------------------------------------------------- punti di forza */

.iw-vantaggi { display: grid; margin: 0; padding: 0; list-style: none; }
.iw-vantaggi__voce { display: flex; align-items: flex-start; gap: var(--iw-spazio-3); margin: 0; }
.iw-vantaggi__voce strong { display: block; color: var(--iw-testo); font-weight: 600; line-height: 1.35; }
.iw-vantaggi__testo { display: block; color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); line-height: 1.45; }
.iw-vantaggi--fascia { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--iw-spazio-5) var(--iw-spazio-6); }
.iw-vantaggi--fascia .iw-icona { width: 28px; height: 28px; margin-top: 2px; }
.iw-vantaggi--scheda { gap: var(--iw-spazio-3); margin-top: var(--iw-spazio-5); padding-top: var(--iw-spazio-5); border-top: 1px solid var(--iw-bordo); }
.iw-vantaggi--scheda .iw-vantaggi__voce { align-items: center; font-size: 0.9rem; }
.iw-vantaggi--scheda .iw-icona { width: 20px; height: 20px; }
.iw-vantaggi--scheda strong { display: inline; font-weight: 500; }
.iw-vantaggi--scheda .iw-vantaggi__testo { display: inline; font-size: inherit; }
.iw-vantaggi--scheda .iw-vantaggi__testo::before { content: " · "; }

/* ------------------------------------------------------------------ piede */

.iw-piede { margin-top: var(--iw-spazio-8); padding-block: 0 var(--iw-spazio-5); background: var(--iw-fondo-tenue); border-top: 0; }
.iw-piede__vantaggi { padding-block: var(--iw-spazio-6); border-bottom: 1px solid var(--iw-bordo); background: var(--iw-superficie); }
.iw-piede__griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--iw-spazio-6); padding-top: var(--iw-spazio-7); }
.iw-piede__marchio { grid-column: span 2; max-width: 360px; }
@media (max-width: 599px) { .iw-piede__marchio { grid-column: auto; } }
.iw-piede__nome { font-size: 1.15rem; }
.iw-piede__titolo { margin: 0 0 var(--iw-spazio-3); color: var(--iw-testo); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.iw-piede__lista { display: grid; gap: var(--iw-spazio-2); margin: 0; padding: 0; list-style: none; }
.iw-piede__contatti li { display: flex; align-items: flex-start; gap: var(--iw-spazio-2); }
.iw-piede__contatti .iw-icona { width: 18px; height: 18px; margin-top: 2px; }
.iw-piede a { color: var(--iw-testo-tenue); }
.iw-piede a:hover { color: var(--iw-testo); text-decoration: underline; }
.iw-piede__base { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--iw-spazio-4); margin-top: var(--iw-spazio-7); padding-top: var(--iw-spazio-4); border-top: 1px solid var(--iw-bordo); }
.iw-piede__base p { margin: 0; padding: 0; border: 0; line-height: 1.9; }
/* un link legale non si spezza a meta («Condizioni di / vendita») */
.iw-piede__base p a { white-space: nowrap; }
.iw-social { display: flex; gap: var(--iw-spazio-1); margin: var(--iw-spazio-4) 0 0 calc(-1 * var(--iw-spazio-2)); padding: 0; list-style: none; }
.iw-social__link { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; }
.iw-social__link:hover { background: var(--iw-velo); }
.iw-social .iw-icona { width: 20px; height: 20px; }
.iw-pagamenti { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.iw-pagamenti__voce { display: grid; place-items: center; min-width: 48px; height: 28px; padding: 0 8px; border: 1px solid var(--iw-bordo); border-radius: 5px; background: var(--iw-superficie); color: var(--iw-testo); font: 700 0.6875rem/1 var(--iw-font-testo); letter-spacing: 0.02em; white-space: nowrap; }
.iw-pagamenti__voce--visa { font-style: italic; letter-spacing: 0.04em; }
.iw-pagamenti__voce--logo { width: 52px; min-width: 0; height: 32px; padding: 0; background: #fff; }
.iw-pagamenti__logo, .iw-pagamenti__logo svg { display: block; width: 44px; height: 18px; }

/* ------------------------------------------------------ carte: pulsante */

@media (hover: hover) and (min-width: 900px) {
  .iw-carta-pulsante--passaggio .iw-carta__azioni { opacity: 0; transform: translateY(6px); transition: opacity var(--iw-transizione), transform var(--iw-transizione); }
  .iw-carta-pulsante--passaggio .iw-carta:hover .iw-carta__azioni,
  .iw-carta-pulsante--passaggio .iw-carta:focus-within .iw-carta__azioni { opacity: 1; transform: none; }
}
.woocommerce ul.products li.product .iw-carta__corpo .price { font-size: 0.95rem; }
.iw-carta__media { background: var(--iw-fondo-tenue); }

/* ------------------------------------------------------- carte: a scatola */

/*
 * Foto a filo del riquadro e testo dentro un imbottitura: la carta smette di
 * galleggiare sul fondo della pagina e si legge come un oggetto solo.
 * I selettori portano dietro ul.products li.product.product perche i fogli di
 * WooCommerce, caricati prima, hanno lo stesso peso (vedi sopra). La doppia
 * classe basta da sola: ancorare al body.woocommerce lasciava fuori il
 * carrello e la home, dove quella classe non c e.
 */
body.iw-carta--scatola ul.products li.product.product {
  --iw-carta-raggio: 20px;
  overflow: hidden;
  border: 1px solid var(--iw-bordo);
  border-radius: var(--iw-carta-raggio);
  background: var(--iw-superficie);
  transition: border-color var(--iw-transizione), box-shadow var(--iw-transizione);
}
body.iw-carta--scatola .iw-carta__media { border-radius: 0; }
body.iw-carta--scatola .iw-carta__corpo { padding: var(--iw-spazio-4) 18px; }
body.iw-carta--scatola ul.products li.product.product .iw-carta__azioni { margin-top: 0; padding: 0 18px var(--iw-spazio-4); }
/* il contorno del fuoco sta dentro: con overflow:hidden fuori verrebbe tagliato */
body.iw-carta--scatola .iw-carta__link:focus-visible::after { outline-offset: -3px; border-radius: var(--iw-carta-raggio); }
@media (hover: hover) {
  body.iw-carta--scatola ul.products li.product.product:hover { border-color: var(--iw-bordo-forte); box-shadow: var(--iw-ombra); }
}

/* --------------------------------------------- carte: pulsante sopra la foto */

/*
 * La carta diventa una griglia e azioni e foto finiscono nella stessa cella:
 * il pulsante sta sopra la foto senza spostare una riga del modello, e gli
 * agganci di WooCommerce restano nell ordine di sempre.
 */
/* la colonna va fissata a minmax(0,1fr): lasciata su «auto» si allarga fino
   al pezzo piu largo della cella (il pulsante) e la foto smette di essere
   quadrata quanto le altre — i prezzi delle carte vicine non sono piu in riga */
/*
 * L ancora e «li.product», ripetuto, non «body.woocommerce»: la classe sul body
 * dipende dalla pagina, non dalla carta. Il carrello ha woocommerce-page ma non
 * woocommerce, la home di Elementor non ha ne l una ne l altra — e li le azioni
 * restavano fuori dalla griglia mentre foto e corpo ci entravano (quelli hanno
 * il selettore corto): il pulsante cadeva in una terza riga, +52 px sul
 * carrello e +84 in home rispetto alla stessa carta nel catalogo.
 *
 * Tre volte .product perche il peso va contato, non stimato: da battere c e
 * «.woocommerce ul.products[class*=columns-] li.product.product», che di classi
 * ne ha cinque. Con due .product se ne hanno quattro e WooCommerce rimette
 * display:flex — misurato, la griglia c era e non si applicava.
 */
body.iw-carta-pulsante--foto ul.products li.product.product.product { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
body.iw-carta-pulsante--foto .iw-carta__media { grid-area: 1 / 1; }
body.iw-carta-pulsante--foto .iw-carta__corpo { grid-area: 2 / 1; }
body.iw-carta-pulsante--foto ul.products li.product.product .iw-carta__azioni {
  grid-area: 1 / 1;
  align-self: end;
  justify-self: center;
  max-width: calc(100% - 2 * var(--iw-spazio-3));
  margin: 0 0 var(--iw-spazio-3);
  padding: 0;
}
body.iw-carta-pulsante--foto ul.products li.product.product .iw-carta__azioni .button {
  width: auto;
  padding-inline: var(--iw-spazio-5);
  border-radius: 999px;
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.08), 0 4px 14px rgb(0 0 0 / 0.14);
}
/* sopra la foto il contorno non si legge: il pulsante e sempre pieno */
body.iw-carta-pulsante--foto ul.products li.product.product .iw-carta__azioni .button:not(.add_to_cart_button),
body.iw-carta-pulsante--foto ul.products li.product.product .iw-carta__azioni .button.product_type_variable {
  border-color: transparent;
  background: var(--iw-accento);
  color: var(--iw-accento-testo);
}
body.iw-carta-pulsante--foto .iw-carta__azioni .added_to_cart { display: none; }
@media (hover: hover) and (min-width: 900px) {
  body.iw-carta-pulsante--foto .iw-carta__azioni { opacity: 0; transform: translateY(6px); transition: opacity var(--iw-transizione), transform var(--iw-transizione); }
  body.iw-carta-pulsante--foto .iw-carta:hover .iw-carta__azioni,
  body.iw-carta-pulsante--foto .iw-carta:focus-within .iw-carta__azioni { opacity: 1; transform: none; }
}
.iw-cerca__modulo input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

/* --------------------------------------- varianti (scheda e aggiunta rapida) */

.iw-scelta-attuale { color: var(--iw-testo-tenue); font-weight: 400; }
.woocommerce div.product form.cart .reset_variations { display: inline-block; margin-top: var(--iw-spazio-2); font-size: var(--iw-testo-piccolo); color: var(--iw-testo-tenue); }

.iw-scelte { display: none; flex-wrap: wrap; gap: var(--iw-spazio-2); }
/* con JavaScript: pulsanti al posto della tendina (che resta per WooCommerce) */
.iw-js .iw-scelte { display: flex; }
/* WooCommerce da alla tendina min-width:75%, che vince su width: va azzerato anche quello */
.iw-js .iw-scelte-contenitore select {
  position: absolute !important;
  width: 1px !important;
  min-width: 0 !important;
  max-width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
}

.iw-scelta {
  position: relative;
  min-width: 44px;
  min-height: 44px;
  padding: 0 var(--iw-spazio-4);
  border: 1px solid var(--iw-bordo-forte);
  border-radius: var(--iw-raggio-piccolo);
  background: var(--iw-superficie);
  color: var(--iw-testo);
  font: 500 0.9rem/1.2 var(--iw-font-testo);
  cursor: pointer;
  transition: border-color var(--iw-transizione), box-shadow var(--iw-transizione);
}
.iw-scelta:hover { border-color: var(--iw-testo); }
.iw-scelta[aria-pressed="true"] { border-color: var(--iw-testo); box-shadow: inset 0 0 0 1px var(--iw-testo); }
.iw-scelta[hidden] { display: none; }

.iw-scelta--colore { width: 44px; padding: 0; border-radius: 50%; }
.iw-scelta__campione { position: absolute; inset: 4px; border: 1px solid rgb(0 0 0 / 0.12); border-radius: 50%; }

/* esaurita: si vede ma barrata, e non si sceglie */
.iw-scelta--esaurita { color: var(--iw-testo-tenue); cursor: not-allowed; opacity: 0.55; }
.iw-scelta--esaurita::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 6px;
  right: 6px;
  height: 1px;
  background: currentColor;
  transform: rotate(-35deg);
}

/* ------------------------------------------------------- aggiunta rapida */

.iw-rapida {
  width: min(880px, calc(100vw - 2rem));
  max-height: min(92dvh, 760px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: var(--iw-raggio);
  background: var(--iw-superficie);
  color: var(--iw-testo);
  box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.35);
}
.iw-rapida::backdrop { background: rgb(0 0 0 / 0.45); }
.iw-rapida[open] { animation: iw-rapida 220ms ease both; }
@keyframes iw-rapida { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: none; } }
.iw-rapida-aperta { overflow: hidden; }
.iw-rapida__chiudi { position: absolute; top: var(--iw-spazio-2); right: var(--iw-spazio-2); z-index: 2; background: var(--iw-superficie); }
.iw-rapida__contenuto { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 720px) { .iw-rapida__contenuto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.iw-rapida__media { position: relative; min-height: 100%; background: var(--iw-fondo-tenue); }
.iw-rapida__foto { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }
@media (min-width: 720px) { .iw-rapida__foto { position: absolute; inset: 0; aspect-ratio: auto; } }
.iw-rapida .stock { margin: 0 0 var(--iw-spazio-3); color: var(--iw-testo); font-size: var(--iw-testo-piccolo); font-weight: 600; }
.iw-rapida .stock.out-of-stock { color: var(--iw-offerta); }
@media (max-width: 719px) { .iw-rapida__media { max-height: 38dvh; overflow: hidden; } .iw-rapida__foto { aspect-ratio: 4 / 3; } }
.iw-rapida__corpo { padding: var(--iw-spazio-6) var(--iw-spazio-5) var(--iw-spazio-5); }
.iw-rapida__titolo { margin: 0 var(--iw-spazio-6) var(--iw-spazio-2) 0; font-size: 1.5rem; }
.iw-rapida .iw-valutazione { margin-bottom: var(--iw-spazio-2); }
.iw-rapida__prezzo { margin: 0 0 var(--iw-spazio-4); font-size: 1.25rem; font-weight: 600; }
.iw-rapida__prezzo ins { color: var(--iw-offerta); text-decoration: none; }
.iw-rapida__prezzo del { color: var(--iw-testo-tenue); font-size: 0.8em; font-weight: 400; }
.iw-rapida form.cart .variations { width: 100%; margin-bottom: var(--iw-spazio-3); border: 0; }
.iw-rapida form.cart .variations tr { display: block; margin-bottom: var(--iw-spazio-4); }
.iw-rapida form.cart .variations th, .iw-rapida form.cart .variations td { display: block; padding: 0; text-align: left; }
.iw-rapida form.cart .variations th.label { margin-bottom: var(--iw-spazio-2); }
.iw-rapida form.cart .reset_variations { display: inline-block; margin-top: var(--iw-spazio-2); color: var(--iw-testo-tenue); font-size: var(--iw-testo-piccolo); }
.iw-rapida .single_variation_wrap .woocommerce-variation { margin-bottom: var(--iw-spazio-3); font-size: var(--iw-testo-piccolo); }
.iw-rapida .single_variation_wrap .woocommerce-variation-price { display: none; }
.iw-rapida .woocommerce-variation-add-to-cart,
.iw-rapida form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: var(--iw-spazio-3); }
.iw-rapida .single_add_to_cart_button { flex: 1 1 180px; min-height: 52px; }
.iw-rapida .single_add_to_cart_button.loading { opacity: 0.6; pointer-events: none; }
.iw-rapida .quantity { margin: 0; }
.iw-rapida__dettagli { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--iw-spazio-5); color: var(--iw-testo); font-size: var(--iw-testo-piccolo); font-weight: 600; }
.iw-rapida__dettagli .iw-icona { width: 16px; height: 16px; }
.iw-rapida__errore { margin: 0; padding: var(--iw-spazio-3) var(--iw-spazio-5); background: #FEF3F2; color: #B42318; font-size: var(--iw-testo-piccolo); }
/* consegna, whatsapp, punti di forza del plugin e del tema: nella finestra non servono */
.iw-rapida .iw-consegna, .iw-rapida .iw-whatsapp, .iw-rapida .iw-vantaggi { display: none; }
.woocommerce ul.products li.product .iw-carta__azioni .button.loading { opacity: 0.6; pointer-events: none; }

/* briciole su telefono: solo «‹ categoria madre» (woocommerce/global/breadcrumb.php) */
@media (max-width: 599px) {
  .iw-briciole:has(.iw-briciole__voce--madre) > :not(.iw-briciole__voce--madre) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  /* su telefono questa e la via per tornare indietro: deve prendersi col pollice */
  .iw-briciole__voce--madre { display: inline-flex; align-items: center; min-height: 44px; gap: 4px; color: var(--iw-testo); font-weight: 500; text-decoration: none; }
  .iw-briciole__voce--madre::before { content: "‹"; font-size: 1.3em; line-height: 1; }
}
.iw-404__cerca { margin: var(--iw-spazio-5) 0; }
@media (max-width: 899px) { .iw-404__cerca .iw-cerca__invia { display: inline-flex; } }

/* ------------------------------------------------------------ mega menu
   inc/menu.php: su ogni voce principale «Mega menu» in Aspetto > Menu. */

.iw-menu__etichetta { display: inline-block; margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: var(--iw-offerta); color: #fff; font-size: 0.6875rem; font-weight: 700; line-height: 1.2; letter-spacing: 0.04em; text-transform: uppercase; vertical-align: 2px; }
.iw-menu__sotto { display: none; }



/* telefono: sottomenu a fisarmonica */


/* bersagli al tocco: almeno 44 px di altezza anche per link che sembrano solo testo (WCAG 2.2) */
.iw-testata__nome { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 899px) {
  .iw-testata__nome { display: flex; }
}

/* menu con molti rami (8 o più): stringe invece di andare a capo */
.iw-menu--fitto .iw-menu__lista { gap: 0 var(--iw-spazio-3); }
.iw-menu--fitto a { padding-inline: calc(var(--iw-spazio-1) / 2); font-size: 0.9rem; }
@media (min-width: 1200px) { .iw-menu--fitto a { font-size: 0.92rem; } }

/* bersagli da toccare: i contatti del footer e i link della riga di servizio sono link in riga, alti 17 px; ne servono almeno 24 (WCAG 2.5.8) */
.iw-piede__contatti a, .iw-servizio a { display: inline-block; min-height: 24px; padding-block: 3px; }

/* ------------------------------------------------ footer sul telefono
 * Prima le colonne erano una sotto l altra e i contatti, la cosa che serve di più,
 * arrivavano per ultimi dopo una pagina intera. Ora: il marchio a tutta larghezza
 * (la targhetta delle recensioni su una riga), i contatti in un riquadro, poi i due
 * menu affiancati; garanzie su due colonne e loghi dei pagamenti in una riga. */
@media (max-width: 599px) {
  .iw-piede__griglia { grid-template-columns: 1fr 1fr; gap: var(--iw-spazio-6) var(--iw-spazio-4); padding-top: var(--iw-spazio-6); }
  .iw-piede__marchio { grid-column: 1 / -1; max-width: none; }
  .iw-piede__marchio .iw-google-targa { display: flex; width: fit-content; max-width: 100%; margin-top: var(--iw-spazio-3); padding-block: 6px; font-size: 0.8125rem; line-height: 1.3; white-space: nowrap; }
  .iw-piede__colonna { order: 2; }
  .iw-piede__colonna--contatti { grid-column: 1 / -1; order: 1; padding: var(--iw-spazio-4); border-radius: var(--iw-raggio); background: var(--iw-superficie); }
  .iw-piede__colonna--contatti .iw-piede__lista { gap: var(--iw-spazio-3); }
  .iw-piede__colonna--contatti a { color: var(--iw-testo); }
  .iw-piede__lista { gap: 0; }
  .iw-piede__lista:not(.iw-piede__contatti) a { display: block; padding-block: 8px; }
  .iw-piede__base { gap: var(--iw-spazio-3); margin-top: var(--iw-spazio-6); font-size: 0.8125rem; }
  .iw-piede__base p { line-height: 1.7; }
  .iw-pagamenti { gap: 5px; }
  .iw-pagamenti__voce--logo { flex: none; width: 38px; min-width: 0; height: 25px; }
  .iw-pagamenti__voce--logo svg, .iw-pagamenti__voce--logo img { max-width: 100%; max-height: 100%; }
  .iw-piede__vantaggi { padding-block: var(--iw-spazio-5); }
  .iw-vantaggi--fascia { grid-template-columns: 1fr 1fr; gap: var(--iw-spazio-4); }
  .iw-vantaggi--fascia .iw-vantaggi__voce { flex-direction: column; gap: var(--iw-spazio-2); }
  .iw-vantaggi--fascia .iw-icona { width: 24px; height: 24px; }
  .iw-vantaggi--fascia .iw-vantaggi__testo { font-size: 0.8125rem; }
}