/* ———————————————— */
/*  LAYOUT BOX + ALLINEAMENTO PREZZO  */
/* ———————————————— */

/* 1) Trasforma il box in flex column */
.pbp-other-area {
  display: flex !important;
  flex-direction: column !important;
}

/* 2) Spingi il blocco prezzo in fondo */
.pbp-price-area {
  margin-top: auto !important;
  text-align: center !important; /* già presente, lo ribadiamo */
}


/* ———————————————— */
/*  CONTENUTO PREZZO  */
/* ———————————————— */

/* 1) Centro il contenuto del prezzo */
.pbp-price-area {
  text-align: center !important;
}

/* 2) Faccio diventare il .price un flex container per poter gestire ordine e allineamento */
.pbp-price-area .price,
.pbp-price-area p.price {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.4em !important;
}

/* 3) Di default tutti gli importi diventano arancioni (nuovo prezzo + range) */
.pbp-price-area span.woocommerce-Price-amount,
.pbp-price-area span.amount {
  color: #F6A800 !important;
  font-size: 1.4em !important;
  font-weight: 500 !important;
}

/* 4) Poi ripristino in grigio chiaro SOLO gli importi dentro <del> (vecchio prezzo) */
.pbp-price-area del span.woocommerce-Price-amount,
.pbp-price-area del span.amount {
  color: #A2ACBD !important;
  text-decoration: line-through !important;
  font-size: 1.1em !important;
  font-weight: 500 !important;
  margin-left: 0.5em !important;
}

/* 5) Se hai ancora markup <ins>/<del>, li resetto anch’essi */
.pbp-price-area ins,
.pbp-price-area del {
  margin: 0 !important;
  padding: 0 !important;
}

/* 6) Infine, per essere sicuri che il nuovo prezzo (dentro ins) sia a sinistra, il vecchio a destra: */
.pbp-price-area .price ins { order: 1 !important; margin-right: 0.5em !important; }
.pbp-price-area .price del { order: 2 !important; }

/* Forza il colore della linea di del al grigio esatto */
.pbp-price-area del,
.pbp-price-area del span.woocommerce-Price-amount {
  /* imposta decorazione e colore insieme */
  text-decoration: line-through #A2ACBD !important;
  /* fallback per browser che supportano text-decoration-color */
  text-decoration-color: #A2ACBD !important;
}


/* ———————————————— */
/*  BADGE “OFFERTA!”   */
/* ———————————————— */

/* 1) Contesto di posizionamento per l’intero box */
.pbp-other-area {
  position: relative !important;
}

/* 2) Badge “OFFERTA!” in alto a sinistra del box */
.pbp-offer-badge {
  position: absolute !important;
  top: 2px !important;
  left: -1px !important;
  background: #28a745 !important;
  color:      #ffffff !important;
  font-family:"Open Sans", sans-serif !important;
  font-weight:700 !important;
  font-size:  1em !important;
  padding:    2px 6px !important;
  border-radius:4px !important;
  z-index:    10 !important;
  transform:  scale(0.9) !important;
}

/* 3) (Opzionale) un piccolo margine in più sul prezzo se invadente */
.pbp-price-area ins,
.pbp-price-area del {
  margin-top: 12px !important;
  display: inline-block !important;
}
