/* Virdemlux — avvisi WooCommerce
   Caricato su tutte le pagine: gli avvisi compaiono su scheda, catalogo,
   carrello, checkout e area account.

   Il CSS del plugin mette:
     border-top:3px solid #720eec        (la banda spessa colorata)
     ::before con il suo font di icone in position:absolute
     padding-left:3.5em per fare posto a quell'icona
     .button{float:right}

   Avevo messo display:flex riducendo il padding: l'icona in assoluto
   finiva SOPRA il testo, e la banda restava. Da qui la sovrapposizione e
   la riga spessa colorata.

   Qui si azzera la sua decorazione e si ricostruisce il riquadro: bordo
   sottile su tutti i lati, barra di colore a sinistra, nessuna icona,
   bottone con lo stile del tema. */

.woocommerce-notices-wrapper{margin:0 0 24px}
.woocommerce-notices-wrapper:empty{display:none}

.woocommerce-message,
.woocommerce-error,
.woocommerce-info{
  position:relative;
  list-style:none;margin:0 0 12px;
  /* Padding normale: l'icona del plugin non c'è più, quindi non serve
     lasciarle 3.5em a sinistra. */
  padding:15px 18px 15px 20px;
  border:0;
  border-left:4px solid var(--line-2);
  border-radius:0;                 /* spigolo vivo, come il resto */
  background:#F7F8F6;
  font-size:14.5px;line-height:1.55;color:var(--ink);
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;
  width:auto;
}

/* Via l'icona del font WooCommerce, che si sovrapponeva al testo. */
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::after,
.woocommerce-error::after,
.woocommerce-info::after{
  content:none !important;
  display:none !important;
}

.woocommerce-message{border-left-color:var(--verde-marchio);background:#F4F8EE}
.woocommerce-error{border-left-color:var(--red);background:#FDF3F2;color:#6E1A14}
.woocommerce-info{border-left-color:var(--indigo);background:#F3F5FB}

.woocommerce-message li,
.woocommerce-error li,
.woocommerce-info li{
  list-style:none !important;margin:0 !important;padding:0 !important;
  flex:1 1 auto;min-width:0;
}

/* Il bottone: niente float, sta in fondo alla riga con lo stile del tema. */
.woocommerce-message .button,
.woocommerce-error .button,
.woocommerce-info .button{
  float:none !important;
  flex:0 0 auto;margin:0 0 0 auto;
  display:inline-flex;align-items:center;
  min-height:38px;padding:0 18px;
  border:0;border-radius:var(--pill);
  background:var(--verde-azione);color:#fff;
  font-size:13.5px;font-weight:600;text-decoration:none;
  white-space:nowrap;
}
.woocommerce-message .button:hover,
.woocommerce-error .button:hover,
.woocommerce-info .button:hover{background:var(--verde-testo);color:#fff}

@media (max-width:600px){
  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info{align-items:flex-start}
  .woocommerce-message .button,
  .woocommerce-error .button,
  .woocommerce-info .button{margin:4px 0 0;width:100%;justify-content:center}
}

