/* Etichette prodotto — stesso stile per le etichette del modulo e per i flag del tema
   (Nuovo, -10%, In saldo, Solo online, Pack, Esaurito).
   I colori delle etichette del modulo arrivano dal back office (style#productlabels-css). */

/* Etichette allineate in alto a destra */
.product-flags {
  justify-content: flex-end;
}

.product-flags .product-flag {
  display: inline-block;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  margin: 0 .25rem .35rem 0;
  padding: .35rem .7rem;
  border: 0;
  border-radius: 3px;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .03em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
  pointer-events: none;
}

/* Il tema avvolge il testo in uno <span> con stile proprio: lo neutralizzo,
   così forma e colore li dà solo l'etichetta esterna. */
.product-flags .product-flag * {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}
.product-flags .product-flag::before,
.product-flags .product-flag::after,
.product-flags .product-flag *::before,
.product-flags .product-flag *::after {
  display: none !important;
}

/* Colori dei flag del tema — modificali qui */
.product-flags .product-flag.discount,
.product-flags .product-flag.discount-percentage,
.product-flags .product-flag.discount-amount { background: #d0021b !important; color: #fff !important; }
.product-flags .product-flag.on-sale        { background: #d0021b !important; color: #fff !important; }
.product-flags .product-flag.new            { background: #0088cc !important; color: #fff !important; }
.product-flags .product-flag.online-only    { background: #6c757d !important; color: #fff !important; }
.product-flags .product-flag.pack           { background: #2e7d32 !important; color: #fff !important; }
.product-flags .product-flag.out_of_stock   { background: #343a40 !important; color: #fff !important; }

@media (max-width: 575px) {
  .product-flags .product-flag { font-size: .65rem; padding: .3rem .55rem; }
}