/*
 * PriceTag (PriceTag.jsx dell'oracolo). Uso reale: il blocco
 * woocommerce/product-price — verificato sul markup live prima di scrivere
 * CSS. WooCommerce renderizza <del>originale</del> <ins>attuale</ins> (in
 * quest'ordine nel DOM); l'oracolo mostra invece prezzo attuale, poi
 * originale barrato, poi il badge sconto. Riordinati via flex `order`
 * invece di riscrivere il markup: nessuna necessità di toccare il DOM.
 *
 * Il badge sconto (percentuale) NON esiste nel markup nativo di WooCommerce
 * — iniettato via PHP (functions.php, filtro su render_block del blocco)
 * solo quando il prodotto è in sconto, percentuale calcolata dal prezzo
 * pieno/scontato reali del prodotto.
 *
 * Tre taglie (sm/md/lg) come TRE Stili distinti registrati su
 * woocommerce/product-price via register_block_style() (functions.php) —
 * scelta singola nel picker "Stili" dell'editor, non una classe a memoria
 * in "Classi CSS aggiuntive". Ogni .is-style-fm-price-* è autosufficiente
 * (porta sia il trattamento flex/order di base sia la propria taglia):
 * non esiste più una classe .fm-price separata da combinare con .is-size-*.
 *
 * ATTENZIONE — WooCommerce avvolge in <ins>/<del> SOLO quando il prodotto
 * è in sconto con prezzo singolo. Un prodotto SENZA sconto (o un prodotto
 * variabile con range non scontato) rende invece uno o due
 * <span class="woocommerce-Price-amount"> nudi, senza alcun wrapper —
 * verificato sul markup live del catalogo (/negozio/). Corrisponde al caso
 * "no sale" dell'oracolo (PriceTag senza `original`): stesso trattamento
 * del "now"/ins, applicato allo span nudo figlio diretto del contenitore.
 */

/*
 * Le tre classi atterrano sul wrapper ESTERNO del blocco
 * (.wp-block-woocommerce-product-price — è lì che WordPress applica lo
 * stile selezionato), non sul div interno .wc-block-components-product-price
 * che contiene davvero prezzo/badge — verificato sul markup live: sono due
 * div annidati distinti. Selettore discendente, non composto.
 */
.is-style-fm-price-sm .wc-block-components-product-price,
.is-style-fm-price-md .wc-block-components-product-price,
.is-style-fm-price-lg .wc-block-components-product-price {
	display: flex;
	align-items: baseline;
	gap: var(--wp--custom--price-gap);
	flex-wrap: wrap;
}

/* align="right" in PriceTag.jsx; il blocco WooCommerce supporta anche "center"
   (usato nel catalogo) — nessuno dei due funziona più via text-align una volta
   che il contenitore è flex, va tradotto in justify-content. */
.is-style-fm-price-sm.has-text-align-center .wc-block-components-product-price,
.is-style-fm-price-md.has-text-align-center .wc-block-components-product-price,
.is-style-fm-price-lg.has-text-align-center .wc-block-components-product-price {
	justify-content: center;
}
.is-style-fm-price-sm.has-text-align-right .wc-block-components-product-price,
.is-style-fm-price-md.has-text-align-right .wc-block-components-product-price,
.is-style-fm-price-lg.has-text-align-right .wc-block-components-product-price {
	justify-content: flex-end;
}

.is-style-fm-price-sm ins,
.is-style-fm-price-sm del,
.is-style-fm-price-md ins,
.is-style-fm-price-md del,
.is-style-fm-price-lg ins,
.is-style-fm-price-lg del {
	text-decoration: none;
}

.is-style-fm-price-sm ins .woocommerce-Price-amount,
.is-style-fm-price-md ins .woocommerce-Price-amount,
.is-style-fm-price-lg ins .woocommerce-Price-amount,
.is-style-fm-price-sm .wc-block-components-product-price > .woocommerce-Price-amount,
.is-style-fm-price-md .wc-block-components-product-price > .woocommerce-Price-amount,
.is-style-fm-price-lg .wc-block-components-product-price > .woocommerce-Price-amount {
	order: 1;
	font-family: var(--wp--preset--font-family--mono);
	font-weight: var(--wp--custom--fw--bold);
	color: var(--wp--custom--text-strong);
	letter-spacing: -0.02em;
	line-height: 1;
}

.is-style-fm-price-sm del,
.is-style-fm-price-md del,
.is-style-fm-price-lg del {
	order: 2;
}
.is-style-fm-price-sm del .woocommerce-Price-amount,
.is-style-fm-price-md del .woocommerce-Price-amount,
.is-style-fm-price-lg del .woocommerce-Price-amount {
	font-family: var(--wp--preset--font-family--mono);
	color: var(--wp--custom--text-muted);
	text-decoration: line-through;
	text-decoration-color: var(--wp--preset--color--flash-pink);
	line-height: 1;
}

.is-style-fm-price-sm .fm-price-discount,
.is-style-fm-price-md .fm-price-discount,
.is-style-fm-price-lg .fm-price-discount {
	order: 3;
	font-family: var(--wp--preset--font-family--spec);
	font-size: var(--wp--preset--font-size--xxs);
	font-weight: var(--wp--custom--fw--bold);
	color: var(--wp--custom--on-accent);
	background: var(--wp--preset--gradient--flash);
	padding: var(--wp--custom--badge-padding--sm--y) var(--wp--custom--badge-padding--sm--x);
	border-radius: var(--wp--custom--radius--pill);
	letter-spacing: 0.04em;
	line-height: 1.4;
}

/* Taglie — now/was insieme, come size in PriceTag.jsx. La stessa taglia "now"
   vale anche per lo span nudo (nessuno sconto, vedi nota in testa al file). */
.is-style-fm-price-sm ins .woocommerce-Price-amount,
.is-style-fm-price-sm .wc-block-components-product-price > .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--lg); }
.is-style-fm-price-sm del .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--xs); }

.is-style-fm-price-md ins .woocommerce-Price-amount,
.is-style-fm-price-md .wc-block-components-product-price > .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--xxl); }
.is-style-fm-price-md del .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--sm); }

.is-style-fm-price-lg ins .woocommerce-Price-amount,
.is-style-fm-price-lg .wc-block-components-product-price > .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--xxxl); }
.is-style-fm-price-lg del .woocommerce-Price-amount { font-size: var(--wp--preset--font-size--md); }
