/**
 * Étiquette « Économisez X € » sur la fiche produit d'applique-tendance.com.
 *
 * Charte relevée sur le site : jaune #fec000 (pastilles de badge), bleu marine
 * #0b1c36 (bouton d'achat), anthracite #1e1e1e (textes), gris clair #f5f5f5,
 * police Inter. Les badges du site sont des pastilles (rayon 20 px) en
 * capitales et graisse 700 : l'étiquette reprend ce vocabulaire, en gris clair
 * et texte marine pour ne pas entrer en concurrence avec le badge de remise
 * jaune affiché juste à côté du prix.
 */

.glow-promo-saving--single {
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border-radius: 20px;
	background-color: #f5f5f5;
	color: #0b1c36;
	font-family: Inter, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.4;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Prix unique (produit simple, ou variable dont toutes les variations sont au
   même prix) : l'étiquette est dans `p.price`, qui est en float sur ce thème.
   Elle prend sa propre ligne, calée au bord gauche du prix. */
.woocommerce div.product p.price .glow-promo-saving--single {
	display: flex;
	width: fit-content;
	margin-top: 10px;
}

/* Prix d'une variation : l'étiquette suit le prix sur la même ligne, et passe
   dessous si la colonne est trop étroite. */
.woocommerce div.product .woocommerce-variation-price {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 12px;
	row-gap: 6px;
}

@media (max-width: 480px) {

	.glow-promo-saving--single {
		padding: 4px 10px;
		font-size: 10px;
	}
}