/* =========================================================
   ST CATALOG VIEW — VERSIONE CORRETTA

   1. Griglia originale del tema
   2. Elenco esteso
   3. Elenco compatto, con informazioni ridotte al minimo
   ========================================================= */


/* =========================================================
   PULSANTI CAMBIO VISUALIZZAZIONE
   ========================================================= */

.st-catalog-view {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  margin-left: 15px;
}

.st-catalog-view__button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 8px;
  border: 1px solid #d6d6d6;
  border-radius: 5px;
  background: #fff;
  color: #777;
  font-size: 0;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    background-color 0.2s ease,
    transform 0.2s ease;
}

.st-catalog-view__button:hover,
.st-catalog-view__button:focus-visible {
  border-color: #0067c8;
  color: #0067c8;
  outline: none;
  transform: translateY(-1px);
}

.st-catalog-view__button.is-active {
  border-color: #0067c8;
  background: #0067c8;
  color: #fff;
}

/*
 * Scambia visivamente il secondo e il terzo pulsante.
 * In questo modo al centro compare l'elenco esteso e a destra
 * l'elenco compatto, senza modificare il JavaScript.
 */
.st-catalog-view__button:nth-child(2) {
  order: 3;
}

.st-catalog-view__button:nth-child(3) {
  order: 2;
}


/* =========================================================
   ICONE DEI PULSANTI
   ========================================================= */

.st-catalog-view__button i {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: currentColor !important;
  box-shadow: none !important;
  transform: none !important;
}

.st-catalog-view__grid-icon,
.st-catalog-view__compact-icon {
  display: grid;
  width: 21px;
  height: 21px;
  gap: 2px;
}

.st-catalog-view__grid-icon {
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
}

/* Icona compatta: più righe sottili */
.st-catalog-view__compact-icon {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(5, 1fr);
  height: 18px;
  gap: 2px;
}

.st-catalog-view__grid-icon i,
.st-catalog-view__compact-icon i {
  width: 100% !important;
  height: 100% !important;
  border-radius: 1px;
}

/* Icona elenco esteso: tre righe più spesse */
.st-catalog-view__list-icon {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 22px;
  height: 18px;
}

.st-catalog-view__list-icon i {
  width: 100% !important;
  height: 4px !important;
  border-radius: 1px;
}


/* =========================================================
   RESET GENERALE
   ========================================================= */

#js-product-list .products.st-catalog-view--grid,
#js-product-list .products.st-catalog-view--list,
#js-product-list .products.st-catalog-view--compact {
  width: 100%;
}

#js-product-list .products[class*="st-catalog-view--"] > article,
#js-product-list .products[class*="st-catalog-view--"] > .product-miniature,
#js-product-list .products[class*="st-catalog-view--"] > [class*="col-"] {
  min-width: 0 !important;
  box-sizing: border-box;
}


/* =========================================================
   VISUALIZZAZIONE 1 — GRIGLIA ORIGINALE DEL TEMA
   ========================================================= */

#js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact),
#js-product-list .products.st-catalog-view--grid {
  display: flex !important;
  flex-wrap: wrap !important;
}

#js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > article,
#js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > .product-miniature,
#js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > [class*="col-"],
#js-product-list .products.st-catalog-view--grid > article,
#js-product-list .products.st-catalog-view--grid > .product-miniature,
#js-product-list .products.st-catalog-view--grid > [class*="col-"] {
  display: block !important;
  float: none !important;
}

/* Griglia: 3 prodotti per riga su desktop invece dei 4 di default del tema */
@media (min-width: 992px) {
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > article,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > .product-miniature,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > [class*="col-"],
  #js-product-list .products.st-catalog-view--grid > article,
  #js-product-list .products.st-catalog-view--grid > .product-miniature,
  #js-product-list .products.st-catalog-view--grid > [class*="col-"] {
    flex-basis: 33.3333% !important;
    width: 33.3333% !important;
    max-width: 33.3333% !important;
  }
}


/* =========================================================
   DIMENSIONI DELLE DUE VISTE A ELENCO
   ========================================================= */

/* Elenco esteso */
#js-product-list .products.st-catalog-view--list {
  --thumb-w: 195px;
  --thumb-h: 175px;
  --card-min-h: 215px;
  --card-pad: 18px 20px;
  --main-gap: 26px;
  --actions-w: 285px;
  --title-size: 16px;
  --text-size: 14px;
  --price-size: 23px;
  --logo-w: 110px;
  --logo-h: 42px;
  --qty-h: 38px;
}

/* Elenco compatto: vera tabella, colonne fisse allineate su ogni riga */
#js-product-list .products.st-catalog-view--compact {
  --thumb-w: 60px;
  --thumb-h: 54px;
  --card-min-h: 68px;
  --card-pad: 8px 10px;
  --main-gap: 0px;
  --price-w: 130px;
  --avail-w: 105px;
  --actions-w: 115px;
  --title-size: 12px;
  --text-size: 11px;
  --price-size: 15px;
  --logo-w: 76px;
  --logo-h: 28px;
  --qty-h: 30px;
}


/* =========================================================
   CONTENITORE DEI PRODOTTI A ELENCO
   ========================================================= */

#js-product-list .products.st-catalog-view--list,
#js-product-list .products.st-catalog-view--compact {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  margin: 0 !important;
}

#js-product-list .products.st-catalog-view--list > article,
#js-product-list .products.st-catalog-view--list > .product-miniature,
#js-product-list .products.st-catalog-view--list > [class*="col-"],
#js-product-list .products.st-catalog-view--compact > article,
#js-product-list .products.st-catalog-view--compact > .product-miniature,
#js-product-list .products.st-catalog-view--compact > [class*="col-"] {
  display: block !important;
  float: none !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #e2e2e2;
}

#js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-container,
#js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-container {
  position: relative;
  display: grid !important;
  grid-template-columns:
    var(--thumb-w)
    minmax(0, 1fr)
    var(--actions-w);
  grid-template-rows: minmax(0, 1fr);
  column-gap: var(--main-gap);
  align-items: center;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: var(--card-min-h);
  margin: 0 !important;
  padding: var(--card-pad) !important;
  border: 0;
  background: #fff;
  box-shadow: none !important;
  overflow: hidden;
}
/* ===========================================
   VISTA COMPATTA - Informazioni ridotte al minimo
   =========================================== */

/* Niente etichette prodotto: la card non riserva più spazio in alto */
#js-product-list .products.st-catalog-view--compact .product-flags {
    display: none !important;
}

/* Niente link "Anteprima rapida" */
#js-product-list .products.st-catalog-view--compact .product-miniature .quick-view {
    display: none !important;
}

/* Niente descrizione breve: resta solo il titolo */
#js-product-list .products.st-catalog-view--compact .product-miniature .product-description-short {
    display: none !important;
}

/* Logo marca sostituito dal solo nome testuale */
#js-product-list .products.st-catalog-view--compact .product-miniature .product-manufacturer-logo {
    display: none !important;
}

/* Niente marca: la colonna dedicata è stata rimossa */
#js-product-list .products.st-catalog-view--compact .product-miniature .product-manufacturer-name {
    display: none !important;
}


/* =========================================================
   COLONNA SINISTRA — IMMAGINE E ANTEPRIMA
   ========================================================= */

#js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-top,
#js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-top {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  grid-column: 1;
  grid-row: 1;
  width: var(--thumb-w) !important;
  height: auto !important;
  min-height: var(--thumb-h);
  margin: 0 !important;
  padding: 0 !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-thumbnail,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-thumbnail {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: var(--thumb-w) !important;
  height: var(--thumb-h) !important;
  margin: 0 !important;
  padding: 5px;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-thumbnail picture,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-thumbnail picture {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-thumbnail img,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-thumbnail img {
  position: static !important;
  display: block;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 100% !important;
  margin: auto !important;
  object-fit: contain;
}

#js-product-list .products.st-catalog-view--list .product-miniature .highlighted-informations,
#js-product-list .products.st-catalog-view--compact .product-miniature .highlighted-informations {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: auto !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .quick-view {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  margin: 0 !important;
  font-size: 13px;
}


/* =========================================================
   COLONNA CENTRALE — INFORMAZIONI PRODOTTO
   ========================================================= */

#js-product-list .products.st-catalog-view--list .product-miniature > .thumbnail-container > .product-description,
#js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  grid-column: 2;
  grid-row: 1;
  width: 100% !important;
  min-width: 0;
  height: auto !important;
  min-height: 0;
  margin: 0 !important;
  padding: 4px 0 !important;
  text-align: left !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-manufacturer-logo,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-manufacturer-logo {
  width: 100%;
  margin: 0 0 5px !important;
  text-align: left !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-manufacturer-logo img,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-manufacturer-logo img {
  display: block;
  width: auto !important;
  max-width: var(--logo-w) !important;
  height: auto !important;
  max-height: var(--logo-h) !important;
  margin: 0 !important;
  object-fit: contain;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-extra-information,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-extra-information {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin: 0 0 4px !important;
  font-size: var(--text-size);
  line-height: 1.3;
  text-align: left !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-reference,
#js-product-list .products.st-catalog-view--list .product-miniature .product-manufacturer-name,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-reference,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-manufacturer-name {
  width: 100%;
  margin: 0 0 2px !important;
  text-align: left !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-title,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-title {
  width: 100%;
  margin: 5px 0 6px !important;
  text-align: left !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-title a,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-title a {
  display: block;
  overflow: visible;
  font-size: var(--title-size);
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
  white-space: normal;
}

#js-product-list .product-miniature .product-title .product-title-list-full {
  display: none;
}

/*
 * GeSmart UI - Vista lista: titolo prodotto completo su massimo 2 righe.
 * Griglia e vista compatta mantengono il titolo breve previsto dal layout.
 */
#js-product-list
.products.st-catalog-view--list
.product-miniature
.product-title
.product-title-default {
  display: none;
}

#js-product-list
.products.st-catalog-view--list
.product-miniature
.product-title
.product-title-list-full {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  text-overflow: ellipsis;
  white-space: normal;
}

/* Descrizione interna della card */
#js-product-list .products.st-catalog-view--list .product-miniature > .thumbnail-container > .product-description > .product-description,
#js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description > .product-description {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  font-size: var(--text-size);
  line-height: 1.35;
  text-align: left !important;
  white-space: normal;
  background: transparent !important;
}


/* =========================================================
   PREZZO — POSIZIONATO NELLA COLONNA DESTRA
   ========================================================= */

#js-product-list .products.st-catalog-view--list .product-miniature .product-price-and-shipping,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-price-and-shipping {
  position: absolute !important;
  top: 50%;
  right: var(--card-pad-right, 20px);
  width: var(--actions-w);
  margin: 0 !important;
  padding: 0 0 52px !important;
  text-align: center !important;
  transform: translateY(-50%) !important;
  background: transparent !important;
  box-shadow: none !important;
  z-index: 2;
  pointer-events: none;
}

#js-product-list .products.st-catalog-view--list .product-miniature .price,
#js-product-list .products.st-catalog-view--compact .product-miniature .price {
  font-size: var(--price-size);
  font-weight: 700;
  line-height: 1.2;
}


/* =========================================================
   DISPONIBILITÀ — IN ALTO A DESTRA
   ========================================================= */

#js-product-list .products.st-catalog-view--list .product-miniature .product-qty-container,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-qty-container {
  position: absolute !important;
  top: 12px;
  right: 20px;
  display: flex;
  justify-content: flex-end;
  width: var(--actions-w);
  margin: 0 !important;
  padding: 0 !important;
  z-index: 4;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-qty,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-qty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 5px 10px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

#js-product-list .products.st-catalog-view--compact .product-miniature .product-qty {
  padding: 4px 8px;
  font-size: 11px;
}



/* Nasconde la wishlist nelle viste elenco */
#js-product-list .products.st-catalog-view--list .wishlist-button-add,
#js-product-list .products.st-catalog-view--compact .wishlist-button-add {
    display: none !important;
}


/* =========================================================
   QUANTITÀ E PULSANTE AGGIUNGI — IN BASSO A DESTRA
   ========================================================= */

#js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart {
  position: static !important;
  display: flex !important;
  align-items: flex-end;
  justify-content: flex-end;
  align-self: end;
  grid-column: 3;
  grid-row: 1;
  width: 100% !important;
  max-width: var(--actions-w);
  margin: 0 !important;
  padding: 0 !important;
  z-index: 5;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart > .row,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart > .row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  justify-content: flex-end;
  gap: 8px;
  width: auto !important;
  max-width: 100%;
  margin: 0 !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart > .row > [class*="col-"],
#js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart > .row > [class*="col-"] {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-qty,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-qty {
  display: inline-flex !important;
  flex-wrap: nowrap;
  align-items: stretch;
  height: var(--qty-h);
}

#js-product-list .products.st-catalog-view--list .product-miniature .btn-touchspin,
#js-product-list .products.st-catalog-view--compact .product-miniature .btn-touchspin {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
  width: 34px !important;
  min-width: 34px !important;
  height: var(--qty-h) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
  background: #f5f5f5 !important;
  color: #333 !important;
  font-size: 16px;
  line-height: 1;
  box-shadow: none !important;
}

#js-product-list .products.st-catalog-view--list .product-miniature .js-miniature-qty-input,
#js-product-list .products.st-catalog-view--compact .product-miniature .js-miniature-qty-input {
  flex: 0 0 42px;
  width: 42px !important;
  min-width: 42px !important;
  height: var(--qty-h) !important;
  margin: 0 -1px !important;
  padding: 0 4px !important;
  border: 1px solid #bbb !important;
  border-radius: 0 !important;
  text-align: center !important;
  box-shadow: none !important;
  appearance: textfield;
}

#js-product-list .products.st-catalog-view--list .product-miniature .js-miniature-qty-input::-webkit-inner-spin-button,
#js-product-list .products.st-catalog-view--list .product-miniature .js-miniature-qty-input::-webkit-outer-spin-button,
#js-product-list .products.st-catalog-view--compact .product-miniature .js-miniature-qty-input::-webkit-inner-spin-button,
#js-product-list .products.st-catalog-view--compact .product-miniature .js-miniature-qty-input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}

#js-product-list .products.st-catalog-view--list .product-miniature .add-to-cart,
#js-product-list .products.st-catalog-view--compact .product-miniature .add-to-cart {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto !important;
  min-width: 118px;
  height: var(--qty-h) !important;
  margin: 0 !important;
  padding: 0 14px !important;
  white-space: nowrap;
}

#js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart > .row {
  gap: 5px;
}

#js-product-list .products.st-catalog-view--compact .product-miniature .btn-touchspin {
  flex-basis: 30px;
  width: 30px !important;
  min-width: 30px !important;
}

#js-product-list .products.st-catalog-view--compact .product-miniature .js-miniature-qty-input {
  flex-basis: 36px;
  width: 36px !important;
  min-width: 36px !important;
}

/* Solo icona, senza testo "Aggiungi" */
#js-product-list .products.st-catalog-view--compact .product-miniature .add-to-cart {
  position: relative;
  min-width: 0 !important;
  width: 38px !important;
  padding: 0 !important;
  gap: 0;
  font-size: 0;
}

/* Il testo nascosto (font-size:0) può comunque occupare qualche
   pixel residuo e spingere l'icona fuori centro: la posizioniamo
   quindi al centro assoluto del pulsante, ignorando quel residuo */
#js-product-list .products.st-catalog-view--compact .product-miniature .add-to-cart .material-icons {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 18px;
}


/* =========================================================
   VISTA COMPATTA — LAYOUT A TABELLA (da 768px in su)
   Ogni informazione occupa una colonna fissa allineata su tutte
   le righe, con separatori verticali, come le celle di una tabella.
   Sotto i 768px il modulo torna alla griglia nativa del tema
   (vedi blocco "MOBILE" in fondo al file) e questa sezione non si
   applica.
   ========================================================= */

@media (min-width: 768px) {
  /* 5 colonne: Foto | Titolo+Codice (2 righe) | Prezzo | Disponibilità | Quantità+Carrello */
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-container {
    grid-template-columns:
      var(--thumb-w)
      minmax(0, 1fr)
      var(--price-w)
      var(--avail-w)
      var(--actions-w) !important;
    grid-template-rows: auto auto !important;
    align-items: stretch !important;
    align-content: center !important;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-top {
    grid-row: 1 / span 2;
    min-width: 0;
    border-right: 1px solid #ececec;
  }

  /* .product-description e .product-extra-information avvolgevano
     titolo/codice/prezzo: li smontiamo per rendere ciascun elemento
     una cella indipendente della griglia, senza toccare il markup */
  #js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-extra-information {
    display: contents !important;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .product-title {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 4px 10px 0 !important;
    border-right: 1px solid #ececec;
    overflow: hidden;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .product-title a {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Codice prodotto, sotto il titolo */
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-reference {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 0 10px 4px !important;
    border-right: 1px solid #ececec;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #777;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .product-price-and-shipping {
    position: static !important;
    grid-column: 3;
    grid-row: 1 / span 2;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-width: 0;
    height: 100%;
    margin: 0 !important;
    padding: 0 8px !important;
    border-right: 1px solid #ececec;
    transform: none !important;
    pointer-events: auto;
    overflow: hidden;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .price,
  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__line,
  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__amount,
  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__label {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Solo il prezzo IVA esclusa: nascondiamo la seconda riga (IVA inclusa) */
  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__line--incl {
    display: none !important;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__line--excl {
    font-size: 1.15em;
  }

  /* Sostituiamo l'etichetta "IVA esclusa" con la dicitura "+ IVA" */
  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__line--excl .gesmart-dual-price__label {
    display: none !important;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .gesmart-dual-price__line--excl::after {
    content: "+ IVA";
    font-size: 0.6em;
    font-weight: 400;
    color: #777;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .product-qty-container {
    position: static !important;
    grid-column: 4;
    grid-row: 1 / span 2;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-width: 0;
    height: 100%;
    padding: 0 6px !important;
    border-right: 1px solid #ececec;
    overflow: hidden;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .product-qty {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    padding: 3px 6px;
  }

  /* Quantità e pulsante Aggiungi uniti in un'unica colonna:
     il form resta intatto (nessuno smontaggio), è la sua riga
     interna .row a mettere affiancati i due elementi */
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart {
    grid-column: 5 !important;
    grid-row: 1 / span 2;
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    height: 100%;
    margin: 0 !important;
    padding: 0 8px !important;
  }

  /* Solo il campo numerico: nascondiamo i pulsanti − e + */
  #js-product-list .products.st-catalog-view--compact .product-miniature .btn-touchspin {
    display: none !important;
  }

  #js-product-list .products.st-catalog-view--compact .product-miniature .js-miniature-qty-input {
    flex: 0 0 40px;
    width: 40px !important;
    min-width: 40px !important;
    margin: 0 !important;
  }
}


/* =========================================================
   ETICHETTE E PREFERITI
   ========================================================= */

/* Etichetta OFFERTA */
#js-product-list .product-miniature .gs-product-offer-badge {
  position: absolute;
  top: 45px;
  left: 15px;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 9px;
  background: #0069cd;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Nella vista compatta non mostriamo le etichette */
#js-product-list .products.st-catalog-view--compact .product-miniature .gs-product-offer-badge {
  display: none !important;
}


#js-product-list .products.st-catalog-view--list .product-miniature .product-flags,
#js-product-list .products.st-catalog-view--compact .product-miniature .product-flags {
  z-index: 6;
}

#js-product-list .products.st-catalog-view--list .product-miniature .wishlist-button-add,
#js-product-list .products.st-catalog-view--compact .product-miniature .wishlist-button-add {
  z-index: 7;
}

#js-product-list .products.st-catalog-view--list *,
#js-product-list .products.st-catalog-view--compact * {
  box-sizing: border-box;
  word-break: normal;
  overflow-wrap: break-word;
}


/* =========================================================
   TOOLBAR
   ========================================================= */

#js-product-list-top .row,
#js-product-list-top .sort-by-row {
  align-items: center;
}

#js-product-list-top .st-catalog-view {
  display: flex !important;
}

.st-catalog-view--fallback {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 5px 20px rgb(0 0 0 / 15%);
}


/* =========================================================
   FIX TOOLBAR ORDINAMENTO + PULSANTI VISUALIZZAZIONE
   ========================================================= */

#js-product-list-top .sort-by-row {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* La label "Ordina per:" e il dropdown usano classi Bootstrap che,
   sommate, superano le 12 colonne (col-md-5 + col-md-9 = 14/12):
   per questo su alcune pagine la label va a capo sopra al dropdown
   invece di restare sulla stessa riga. Le rendiamo flessibili. */
#js-product-list-top .sort-by-row .sort-by {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  margin-right: 8px;
  white-space: nowrap;
}

/* Il dropdown resta contenuto (non si espande a tutta larghezza):
   così i 3 pulsanti restano sulla stessa riga, affiancati a destra,
   invece di andare a capo sotto per mancanza di spazio */
#js-product-list-top .sort-by-row .products-sort-order {
  flex: 0 1 320px;
  min-width: 160px;
  max-width: 320px;
  margin-right: 12px;
}

/* I pulsanti restano ancorati a destra, dentro il flusso della riga.
   Non avendo classi col-* del tema, mancano del padding compensativo
   che Bootstrap applica alle colonne dentro un .row: lo aggiungiamo
   qui per riallineare il bordo destro al resto del contenitore. */
#js-product-list-top .sort-by-row .st-catalog-view {
  flex: 0 0 auto;
  margin-left: auto;
  padding-right: 15px;
  box-sizing: border-box;
}

@media (max-width: 767.98px) {
  /* Su desktop la riga è nowrap per tenere i pulsanti affiancati;
     su mobile invece serve tornare al wrap */
  #js-product-list-top .sort-by-row {
    flex-wrap: wrap;
  }

  /* Label e dropdown vanno a tutta larghezza su una riga */
  #js-product-list-top .sort-by-row .sort-by,
  #js-product-list-top .sort-by-row .products-sort-order {
    flex: 0 0 100%;
    max-width: 100%;
    margin-right: 0;
  }

  /* Su mobile teniamo solo la griglia predefinita di PrestaShop:
     i 3 pulsanti di cambio vista non servono e vengono nascosti */
  #js-product-list-top .sort-by-row .st-catalog-view {
    display: none !important;
  }
}


/* =========================================================
   VISTA GRIGLIA MOBILE — pulsante "Aggiungi" sotto al selettore qty
   ========================================================= */

@media (max-width: 767.98px) {
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) .product-miniature .product-miniature-add-to-cart .row,
  #js-product-list .products.st-catalog-view--grid .product-miniature .product-miniature-add-to-cart .row {
    display: flex !important;
    flex-direction: column !important;
    align-items: center;
    gap: 8px;
  }

  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) .product-miniature .product-miniature-add-to-cart .row > [class*="col-"],
  #js-product-list .products.st-catalog-view--grid .product-miniature .product-miniature-add-to-cart .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) .product-miniature .product-miniature-qty,
  #js-product-list .products.st-catalog-view--grid .product-miniature .product-miniature-qty {
    justify-content: center;
  }

  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) .product-miniature .add-to-cart,
  #js-product-list .products.st-catalog-view--grid .product-miniature .add-to-cart {
    width: 100% !important;
    justify-content: center;
  }
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1199.98px) {
  #js-product-list .products.st-catalog-view--list {
    --thumb-w: 170px;
    --thumb-h: 150px;
    --card-min-h: 195px;
    --actions-w: 270px;
    --main-gap: 20px;
  }

  #js-product-list .products.st-catalog-view--compact {
    --thumb-w: 52px;
    --thumb-h: 46px;
    --card-min-h: 60px;
    --price-w: 112px;
    --avail-w: 92px;
    --actions-w: 105px;
  }
}

@media (max-width: 991.98px) {
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > article,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > .product-miniature,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > [class*="col-"],
  #js-product-list .products.st-catalog-view--grid > article,
  #js-product-list .products.st-catalog-view--grid > .product-miniature,
  #js-product-list .products.st-catalog-view--grid > [class*="col-"] {
    flex-basis: 50% !important;
    width: 50% !important;
    max-width: 50% !important;
  }

  #js-product-list .products.st-catalog-view--list {
    --thumb-w: 145px;
    --thumb-h: 130px;
    --card-min-h: 180px;
    --actions-w: 255px;
    --main-gap: 16px;
  }

  #js-product-list .products.st-catalog-view--compact {
    --thumb-w: 46px;
    --thumb-h: 40px;
    --card-min-h: 56px;
    --price-w: 96px;
    --avail-w: 84px;
    --actions-w: 100px;
  }
}

@media (max-width: 767.98px) {
  .st-catalog-view {
    width: 100%;
    justify-content: flex-end;
    margin: 12px 0 0;
  }

  /* Da qui in giù passiamo da grid a flex-wrap con ordine esplicito:
     evita l'auto-placement imprevedibile che causava le sovrapposizioni */
  #js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-container,
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-container {
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: var(--main-gap);
    row-gap: 8px;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-top,
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-top {
    flex: 0 0 var(--thumb-w) !important;
    order: 1;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature > .thumbnail-container > .product-description,
  #js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description {
    flex: 1 1 0 !important;
    min-width: 0;
    order: 2;
  }

  /* Il prezzo torna nel flusso normale, sotto immagine + descrizione */
  #js-product-list .products.st-catalog-view--list .product-miniature .product-price-and-shipping,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-price-and-shipping {
    position: static !important;
    flex: 0 0 100% !important;
    order: 3;
    width: 100%;
    margin-top: 10px !important;
    padding: 0 !important;
    text-align: left !important;
    transform: none !important;
  }

  /* Pulsante aggiungi al carrello sempre in fondo, a tutta larghezza */
  #js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart {
    flex: 0 0 100% !important;
    order: 4;
    justify-content: flex-end;
    width: 100% !important;
    max-width: none;
    margin-top: 12px !important;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature .product-qty-container,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-qty-container {
    top: 8px;
    right: 10px;
    width: auto;
  }

  #js-product-list .products.st-catalog-view--list {
    --thumb-w: 125px;
    --thumb-h: 112px;
    --card-min-h: 0;
    --card-pad: 14px 12px;
    --main-gap: 14px;
  }

  #js-product-list .products.st-catalog-view--compact {
    --thumb-w: 66px;
    --thumb-h: 58px;
    --card-min-h: 0;
    --card-pad: 9px 8px;
    --main-gap: 9px;
  }
}

@media (max-width: 575.98px) {
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > article,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > .product-miniature,
  #js-product-list .products:not(.st-catalog-view--list):not(.st-catalog-view--compact) > [class*="col-"],
  #js-product-list .products.st-catalog-view--grid > article,
  #js-product-list .products.st-catalog-view--grid > .product-miniature,
  #js-product-list .products.st-catalog-view--grid > [class*="col-"] {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Sotto i 576px l'immagine occupa tutta la riga e la descrizione va sotto */
  #js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-top,
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-top {
    flex-basis: 100% !important;
    justify-content: center;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature > .thumbnail-container > .product-description,
  #js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description {
    flex-basis: 100% !important;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart > .row,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart > .row {
    flex-wrap: wrap !important;
  }

  #js-product-list .products.st-catalog-view--list {
    --thumb-w: 105px;
    --thumb-h: 95px;
  }

  #js-product-list .products.st-catalog-view--compact {
    --thumb-w: 58px;
    --thumb-h: 52px;
  }
}


/* =========================================================
   MOBILE — forza sempre la griglia originale di PrestaShop,
   ignora la vista memorizzata (list/compact). Questo blocco è
   volutamente l'ULTIMO del file: deve vincere sulle regole
   responsive di list/compact viste sopra.
   ========================================================= */

@media (max-width: 767.98px) {
  #js-product-list .products.st-catalog-view--list,
  #js-product-list .products.st-catalog-view--compact {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  #js-product-list .products.st-catalog-view--list > article,
  #js-product-list .products.st-catalog-view--list > .product-miniature,
  #js-product-list .products.st-catalog-view--list > [class*="col-"],
  #js-product-list .products.st-catalog-view--compact > article,
  #js-product-list .products.st-catalog-view--compact > .product-miniature,
  #js-product-list .products.st-catalog-view--compact > [class*="col-"] {
    display: block !important;
    float: none !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 0 !important;
  }

  /* Riportiamo il thumbnail-container al comportamento nativo del tema,
     annullando la griglia CSS custom usata per le viste list/compact */
  #js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-container,
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-container {
    display: block !important;
    grid-template-columns: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  #js-product-list .products.st-catalog-view--list .product-miniature .thumbnail-top,
  #js-product-list .products.st-catalog-view--compact .product-miniature .thumbnail-top,
  #js-product-list .products.st-catalog-view--list .product-miniature > .thumbnail-container > .product-description,
  #js-product-list .products.st-catalog-view--compact .product-miniature > .thumbnail-container > .product-description,
  #js-product-list .products.st-catalog-view--list .product-miniature .product-price-and-shipping,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-price-and-shipping,
  #js-product-list .products.st-catalog-view--list .product-miniature .product-miniature-add-to-cart,
  #js-product-list .products.st-catalog-view--compact .product-miniature .product-miniature-add-to-cart {
    position: static !important;
    display: block !important;
    flex: none !important;
    order: initial !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    text-align: left !important;
  }
}
/* =========================================================
   VISTA LISTA - FLAG "SOLO ONLINE"
   Il tema nativo usa top:25rem, adatto alla card verticale ma non
   alla vista lista orizzontale. Lo riportiamo sull'immagine prodotto,
   in basso a destra, senza interferire con quantità e carrello.
   ========================================================= */
@media (min-width: 768px) {
  #js-product-list .products.st-catalog-view--list .product-miniature .product-flags li.product-flag.online-only {
    position: absolute !important;
    top: calc(18px + var(--thumb-h) - 30px) !important;
    right: auto !important;
    bottom: auto !important;
    left: calc(20px + var(--thumb-w)) !important;
    margin: 0 !important;
    transform: translateX(-100%) !important;
    z-index: 8 !important;
    white-space: nowrap;
  }
}

/* =========================================================
   MOBILE GRIGLIA — rifinitura disponibilità / SOLO ONLINE
   - porta SOLO ONLINE dentro il bordo inferiore dell'immagine
   - compatta lo spazio tra disponibilità e dati prodotto
   - mantiene invariata la logica Smarty della disponibilità
   ========================================================= */
@media (max-width: 767.98px) {
  /* In mobile tutte le viste vengono ricondotte alla card a griglia.
     Il flag nativo usa un top pensato per la card desktop verticale:
     lo riportiamo sul bordo inferiore dell'immagine. */
  #js-product-list .product-miniature .product-flags li.product-flag.online-only {
    top: 11rem !important;
    right: 8px !important;
    bottom: auto !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 8 !important;
    white-space: nowrap;
  }

  /* Avvicina la disponibilità alla zona immagine senza farla collidere
     con Anteprima o con il flag SOLO ONLINE. */
  #js-product-list .product-miniature .product-qty-container {
    margin-top: -8px !important;
    margin-bottom: 0 !important;
  }

  #js-product-list .product-miniature .product-qty {
    margin-top: 4px;
    margin-bottom: 4px;
  }

  /* Riduce il vuoto tra badge disponibilità e blocco informativo. */
  #js-product-list .product-miniature > .thumbnail-container > .product-description {
    padding-top: 0 !important;
  }

  #js-product-list .product-miniature .product-manufacturer-logo {
    margin-top: 0 !important;
    margin-bottom: 4px !important;
  }
}

/* =========================================================
   MOBILE GRIGLIA — allineamento badge stato prodotto
   "Solo online" e "Solo su ordinazione" hanno la stessa
   larghezza e lo stesso bordo destro.
   Nota: questo blocco è volutamente aggiunto in coda, così
   preserva le rifiniture mobile già presenti nella base.
   ========================================================= */
@media (max-width: 767.98px) {
  /* Manteniamo il posizionamento a destra già previsto dalla base
     e uniformiamo soltanto la larghezza del flag SOLO ONLINE. */
  #js-product-list .product-miniature .product-flags li.product-flag.online-only {
    right: 8px !important;
    width: 178px !important;
    max-width: 178px !important;
    box-sizing: border-box !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
}

/* =========================================================
   VISTA COMPATTA — disponibilità completa
   Evita il taglio di "SOLO SU ORDINAZIONE" mantenendo il badge
   su una sola riga.
   ========================================================= */
@media (min-width: 768px) {

  #js-product-list .products.st-catalog-view--compact
  .product-miniature .product-qty {
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
    justify-content: center;
    text-align: center;
  }
}

/* =========================================================
   ST CATALOG VIEW - Fase 9 - rifinitura lista + compatta - 2026-09-03
   Solo viste desktop LIST e COMPACT.
   Non modifica la griglia, il mobile, il markup o la logica prodotto.

   Obiettivi:
   - lista: card leggermente piu compatta e blocchi verticali piu ordinati;
   - lista: disponibilita con larghezza uniforme nella colonna destra;
   - compatta: recuperare spazio per titolo/codice riducendo la colonna disponibilita;
   - compatta: micro-allineamento verticale delle due righe testo.
   ========================================================= */
@media (min-width: 768px) {

  /* -------------------------
     VISTA LISTA
     ------------------------- */
  #js-product-list .products.st-catalog-view--list {
    --thumb-w: 185px;
    --thumb-h: 160px;
    --card-min-h: 200px;
    --card-pad: 14px 18px;
    --main-gap: 22px;
    --actions-w: 275px;
  }

  #js-product-list .products.st-catalog-view--list > article,
  #js-product-list .products.st-catalog-view--list > .product-miniature,
  #js-product-list .products.st-catalog-view--list > [class*="col-"] {
    border-bottom-color: #eceff2 !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .highlighted-informations {
    margin-top: 4px !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .quick-view {
    gap: 3px;
    font-size: 12px;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-manufacturer-logo {
    margin-bottom: 3px !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-extra-information {
    margin-bottom: 2px !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-title {
    margin: 4px 0 5px !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-description-short {
    display: -webkit-box !important;
    margin: 0 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-height: 1.35 !important;
  }

  /* Colonna destra piu regolare: badge stato sempre centrato
     e con una larghezza coerente tra i prodotti. */
  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-qty-container {
    top: 10px !important;
    right: 18px !important;
  }

  #js-product-list .products.st-catalog-view--list
  .product-miniature .product-price-and-shipping {
    right: 18px !important;
  }

  /* -------------------------
     VISTA COMPATTA
     ------------------------- */

  #js-product-list .products.st-catalog-view--compact
  .product-miniature .product-title {
    padding: 5px 12px 1px !important;
  }

  #js-product-list .products.st-catalog-view--compact
  .product-miniature .product-reference {
    padding: 1px 12px 5px !important;
  }

  #js-product-list .products.st-catalog-view--compact
  .product-miniature .product-qty-container {
    padding: 0 7px !important;
  }

  #js-product-list .products.st-catalog-view--compact
  .product-miniature .product-qty {
    width: 100%;
    max-width: 100%;
    padding: 3px 5px;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
  }
}


/* =========================================================
   GESMART - BADGE LOGISTICI SOTTO PREZZO - UNIFORME
   ========================================================= */

/*
 * In lista e compatta il blocco prezzo può essere posizionato
 * dal layout della vista. I badge ne fanno ora parte e quindi
 * devono restare nel suo normale flusso interno.
 */
#js-product-list .products.st-catalog-view--list
.product-miniature .product-price-and-shipping
.product-qty-container.gs-availability-stack,

#js-product-list .products.st-catalog-view--compact
.product-miniature .product-price-and-shipping
.product-qty-container.gs-availability-stack {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 4px !important;
}


/* =========================================================
   GESMART - BADGE PREZZO / SCONTO / DISPONIBILITA / IN ARRIVO
   allineati in colonna e più compatti
   ========================================================= */

/* Nelle viste catalogo il blocco prezzo resta ordinato verticalmente */
#js-product-list .product-miniature .product-price-and-shipping {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Sconto più compatto */
#js-product-list .product-miniature .product-price-and-shipping .discount-product {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 100%;
  margin-top: 4px;
  margin-bottom: 0;
  padding: 3px 8px;
  font-size: 11px;
  line-height: 1.1;
  white-space: nowrap;
}

/* Disponibilità + In Arrivo sotto lo sconto, uno sotto l'altro */
#js-product-list .product-miniature .product-price-and-shipping .product-qty-container.gs-availability-stack {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
}


/* =========================================================
   GESMART - ALLINEAMENTO CARRELLO VISTA GRIGLIA
   Riserva sempre lo spazio per due badge logistici
   ========================================================= */

#js-product-list
.products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
.product-miniature
.product-price-and-shipping
.product-qty-container.gs-availability-stack {
    height: 50px !important;
    min-height: 50px !important;
    box-sizing: border-box !important;
    justify-content: flex-start !important;
}


/* =========================================================
   GESMART - RIFINITURA DIMENSIONE BADGE SCONTO
   ========================================================= */

#js-product-list .product-miniature .product-price-and-shipping .discount-product {
  padding: 4px 9px !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
  border-radius: 3px !important;
}


/* =========================================================
   GESMART - BADGE SCONTO UNIFORMATO AI BADGE LOGISTICI
   ========================================================= */

#js-product-list
.product-miniature
.product-price-and-shipping
.discount-product {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 4px 8px !important;
    min-height: 22px !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-sizing: border-box !important;
    white-space: nowrap !important;
}


/* =========================================================
   GESMART - VISTA COMPATTA: PREZZO + LOGISTICA UNIFORMI
   ========================================================= */

@media (min-width: 768px) {

    /*
     * Disponibilità/In Arrivo non occupano più una colonna autonoma:
     * ora sono dentro il blocco prezzo.
     */
    #js-product-list .products.st-catalog-view--compact {
        --price-w: 170px !important;
        --avail-w: 0px !important;
    }


    #js-product-list
    .products.st-catalog-view--compact
    .product-miniature
    .product-price-and-shipping {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;

        width: 170px !important;
        max-width: 170px !important;

        text-align: left !important;
    }


    /* Disponibilità + In Arrivo subito sotto Sconto */
    #js-product-list
    .products.st-catalog-view--compact
    .product-miniature
    .product-price-and-shipping
    .product-qty-container.gs-availability-stack {
        position: static !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;

        width: auto !important;
        height: auto !important;
        min-height: 0 !important;

        margin: 3px 0 0 !important;
        padding: 0 !important;

        gap: 3px !important;
    }
}


/* =========================================================
   GESMART - COMPACT FINAL
   Badge uniformi + azioni centrate verticalmente
   ========================================================= */

@media (min-width: 768px) {

    /* Centra verticalmente tutto il gruppo
       quantità + pulsante carrello */
    #js-product-list
    .products.st-catalog-view--compact
    .product-miniature
    .product-miniature-add-to-cart {
        align-self: center !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}


/* =========================================================
   GESMART - LARGHEZZA UNIFORME BADGE - GRID + LIST
   ========================================================= */

@media (min-width: 768px) {
}


/* =========================================================
   GESMART - GRID - GAP UNIFORME BADGE LOGISTICI
   ========================================================= */

@media (min-width: 768px) {

    #js-product-list
    .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
    .product-miniature
    .product-price-and-shipping
    .product-qty-container.gs-availability-stack {
        margin-top: 5px !important;
        gap: 5px !important;
    }

    #js-product-list
    .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
    .product-miniature
    .product-price-and-shipping
    .product-qty-container.gs-availability-stack
    .product-qty {
        margin: 0;
    }
}

/* =========================================================
   GESMART - CATEGORY GRID - FIX ALTEZZA DUAL PRICE
   Evita lo spazio verticale artificiale sopra il prezzo.
   Solo pagina categoria, vista griglia desktop.
   ========================================================= */
@media (min-width: 768px) {

  body#category
  #js-product-list
  .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
  .product-miniature
  .product-price-and-shipping > .price {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body#category
  #js-product-list
  .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
  .product-miniature
  .gesmart-dual-price--listing {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    justify-content: flex-start !important;
  }

}

/* =========================================================
   GESMART - CATEGORY GRID - STACK LOGISTICO ESPANDIBILE
   Mantiene 50px minimi per l'allineamento delle card,
   ma consente allo stack di crescere quando ci sono 3 o più badge.
   Solo categoria, vista griglia desktop.
   ========================================================= */
@media (min-width: 768px) {

  body#category
  #js-product-list
  .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
  .product-miniature
  .product-price-and-shipping
  .product-qty-container.gs-availability-stack {
    height: auto !important;
    min-height: 50px !important;
  }

}

/* =========================================================
   GESMART - CATEGORY GRID - GAP TITOLO DESCRIZIONE
   Titolo ad altezza dinamica fino a 3 righe.
   Riduce il vuoto prima della descrizione.
   Solo categoria, vista griglia desktop.
   ========================================================= */
@media (min-width: 768px) {

  body#category
  #js-product-list
  .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
  .product-miniature .product-title {
    height: auto !important;
    min-height: 0 !important;
    max-height: 3.96em !important;
    margin-bottom: 2px !important;
  }

  body#category
  #js-product-list
  .products:not(.st-catalog-view--list):not(.st-catalog-view--compact)
  .product-miniature .product-description-short {
    margin-top: 2px !important;
  }

}