/**
 * Aggiornamento live ZeroSbatti — evidenza visiva sul PREZZO (non sull'intera riga).
 *
 * Direzione visiva:
 *  - lo SFONDO della riga resta invariato;
 *  - il PREZZO diventa verde per un breve istante (importo + simbolo valuta);
 *  - NESSUN alone (box-shadow) e NESSUN bordo/arrotondamento attorno all'importo;
 *  - al termine si ripristina ESATTAMENTE l'aspetto originale.
 *
 * Durata: 1410ms (la classe è rimossa dal JS via timeout, non da animationend).
 */

:root {
	/* Verde con contrasto sufficiente per il prezzo. */
	--zb-accent: #1f8a4c;
	/* Durata totale dell'effetto. */
	--zb-row-anim: 1410ms;
}

/* Prezzo evidenziato: SOLO cambio di colore in verde, temporaneo. NESSUN alone
   (box-shadow) e NESSUN bordo/arrotondamento attorno all'importo. Al termine il
   JS rimuove la classe e il prezzo torna esattamente all'aspetto originale. */
.sm-product.zb-row-updated .sm-product__price {
	color: var(--zb-accent);
	transition: color 150ms ease-out;
}

/* Importo e simbolo valuta seguono il colore verde durante l'effetto. */
.sm-product.zb-row-updated .sm-product__price .woocommerce-Price-amount,
.sm-product.zb-row-updated .sm-product__price .woocommerce-Price-currencySymbol {
	color: var(--zb-accent);
	transition: color 150ms ease-out;
}

/* prefers-reduced-motion: nessuna transizione, solo il colore statico. */
@media (prefers-reduced-motion: reduce) {
	.sm-product.zb-row-updated .sm-product__price,
	.sm-product.zb-row-updated .sm-product__price .woocommerce-Price-amount,
	.sm-product.zb-row-updated .sm-product__price .woocommerce-Price-currencySymbol {
		transition: none;
	}
}

/* ------------------------------------------------------------------
   Transizione STRUTTURALE discreta (aggiunta/rimozione voci via menu-live).
   Volutamente diversa dall'alone verde del prezzo: una comparsa morbida della
   riga, senza suggerire un cambiamento economico. Nessuno zoom, nessun bordo.
   ------------------------------------------------------------------ */
@keyframes zb-row-appear {
	0% { opacity: 0; transform: translateY(-4px); }
	100% { opacity: 1; transform: translateY(0); }
}
.sm-product.zb-row-appeared {
	animation: zb-row-appear 600ms ease-out both;
}
@media (prefers-reduced-motion: reduce) {
	.sm-product.zb-row-appeared {
		animation: none;
	}
}