/* =========================================================
   WooCommerce notices — banner condivisi (success / info / error)
   Sostituiscono lo stile WC default (border verde a sinistra,
   sfondo cream, bottone "Visualizza carrello" pillola grigia)
   con il sistema Manzo: bordo tinta, sfondo paper, codice
   prodotto in mono virgolettato, CTA secondaria piatta.
   Caricato su ogni contesto WC perché le notice possono
   apparire ovunque (shop archive, single product, cart,
   checkout, account, post-add-to-cart redirect).
   ========================================================= */

.woocommerce-notices-wrapper,
.woocommerce > .woocommerce-notices-wrapper {
  margin: 0 auto var(--s-4);
}

/* Riazzera lo stile WC default: niente border-left grosso, niente sfondo verde,
   niente padding asimmetrico, niente list-style. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--s-3);
  margin: 0 0 var(--s-3);
  padding: var(--s-3) var(--s-4) var(--s-3) var(--s-5);
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--r-2);
  list-style: none;
  font: 500 var(--t-sm)/1.5 var(--ff-ui);
  color: var(--ink-1);
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  /* WC mette un'icona ::before posizionata; la nascondiamo e usiamo un dot di
     stato a sinistra del padding tramite background-image inline su un span. */
  display: none;
}

/* Status dot — barra verticale 3px a sinistra, full-height, tinta per stato. */
.woocommerce-message { box-shadow: inset 3px 0 0 var(--success); }
.woocommerce-info    { box-shadow: inset 3px 0 0 var(--accent); }
.woocommerce-error   { box-shadow: inset 3px 0 0 var(--brand); }

/* Error list — WC error wrapper è <ul>, ogni <li> è un messaggio. */
ul.woocommerce-error {
  flex-direction: column;
  align-items: stretch;
}
ul.woocommerce-error li {
  list-style: none;
  padding: 0;
}
ul.woocommerce-error li + li {
  margin-top: var(--s-2);
  padding-top: var(--s-2);
  border-top: 1px solid var(--border);
}

/* Codice prodotto / nome citato dentro al messaggio (WC mette "Nome" tra
   virgolette curly). Lo lasciamo inline ma in peso più scuro. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  color: var(--ink-1);
}
.woocommerce-message strong,
.woocommerce-info strong,
.woocommerce-error strong {
  font-weight: 600;
}

/* CTA dentro la notice ("Visualizza carrello", "Annulla", "Riprova") — WC le
   renderizza come .button. Le rendiamo secondary ghost piatte. */
.woocommerce-message .button,
.woocommerce-message a.button,
.woocommerce-message .restore-item,
.woocommerce-info .button,
.woocommerce-info a.button,
.woocommerce-error .button,
.woocommerce-error a.button {
  margin-left: auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 14px;
  background: transparent;
  color: var(--ink-1);
  border: 1px solid var(--ctl-border);
  border-radius: var(--r-2);
  font: 600 var(--t-sm)/1 var(--ff-ui);
  letter-spacing: 0;
  text-decoration: none;
  transition: background var(--d-1) var(--ease), color var(--d-1) var(--ease), border-color var(--d-1) var(--ease);
  cursor: pointer;
  box-shadow: none;
}
.woocommerce-message .button:hover,
.woocommerce-message a.button:hover,
.woocommerce-message .restore-item:hover,
.woocommerce-info .button:hover,
.woocommerce-info a.button:hover,
.woocommerce-error .button:hover,
.woocommerce-error a.button:hover {
  background: var(--ink-1);
  color: var(--paper);
  border-color: var(--ink-1);
}
.woocommerce-message .button:focus-visible,
.woocommerce-info .button:focus-visible,
.woocommerce-error .button:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

/* Su contenitori esistenti (shop, single product) WC mostra le notice in cima
   al main; assicuriamo che siano dentro al .mz-container quando WC non le
   wrappa. */
.woocommerce-notices-wrapper:empty { display: none; }

/* Mobile: niente CTA che esce dal viewport; va a capo. */
@media (max-width: 560px) {
  .woocommerce-message,
  .woocommerce-info,
  .woocommerce-error {
    flex-wrap: wrap;
  }
  .woocommerce-message .button,
  .woocommerce-info .button,
  .woocommerce-error .button {
    margin-left: 0;
    width: 100%;
  }
}