/* ============================================================
   Icone prodotto: badge icona + etichetta per ogni valore
   selezionato nel campo ACF Checkbox "icone_testo"
   ============================================================ */

.clr-icone-prodotto {
	display: flex;
	flex-wrap: nowrap;
	gap: 24px;
	justify-content: center;
	margin: 24px 0;
	overflow-x: auto;
	overflow-y: hidden;
}

.clr-icona-singola {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	width: 150px;
	min-width: 0;
	text-align: center;
}

.clr-icona-singola img {
	width: 70px;
	height: 70px;
	object-fit: contain;
	margin-bottom: 8px;
}

.clr-icona-singola span {
	font-family: "Outfit", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 100%;
	letter-spacing: 0.05em;
	color: rgba(7, 7, 7, 1);
	max-width: 100%;
	overflow-wrap: break-word;
	word-break: break-word;
	text-transform: uppercase;
}

/* Loghi tecnologie: SVG orizzontali, non quadrati come le altre icone.
   Selettore sulla classe diretta (non piu' legato al div genitore
   .clr-icone-tecnologia) cosi' funziona anche dentro la riga unica
   combinata [icone_riga_unica] */
.clr-icona-singola.clr-icona-tecnologia {
	width: auto;
	height: 58px;
	padding-top: 30px;
}

.clr-icona-singola.clr-icona-tecnologia img {
	width: auto;
	height: 56px;
	max-width: 220px;
	margin-bottom: 0;
}

/* Icona formulazione: singola icona inline, es. dentro un badge/pill */
.clr-icona-formulazione {
	display: inline-block;
	width: 24px;
	height: 24px;
	object-fit: contain;
	vertical-align: middle;
}