/* ====================================================================
   Polo80 - Liste "Dati Aziendali" e "Orari di Apertura" (shortcode
   [ct_dati_aziendali_lista] / [ct_orari_lista], vedi inc/dati-aziendali.php),
   in sostituzione dei vecchi widget "Icon List" statici di Elementor nel
   footer e nella pagina Contatti. Stesso schema icona + testo di quei
   widget, ma qui il contenuto arriva dalla pagina Opzioni "Dati Aziendali
   & Orari" invece che scritto a mano nel markup.

   Due varianti di colore perché la stessa lista compare sia sul footer
   (sfondo verde scuro, testo crema) sia sulla pagina Contatti (sfondo
   chiaro, testo scuro): "chiaro"/"scuro" si riferiscono al colore del
   TESTO, non dello sfondo.
   ==================================================================== */

.pop-lista-dati {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pop-lista-dati__voce {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--e-global-typography-text-font-family), sans-serif;
	font-size: 15px;
	line-height: 1.4;
}

/* Icone come SVG incorporato (Icons_Manager di Elementor, vedi
   ct_render_icona_fa() in questo file). Elementor stessa NON ha una regola
   generica che dia una dimensione a ".e-font-icon-svg": ogni widget suo
   la imposta da sé, scoperto controllando le regole CSS effettivamente
   caricate — qui va quindi fatto a mano un'altezza fissa (la larghezza
   segue da sola in proporzione, "width:auto"): senza, l'SVG viene mostrato
   alla sua dimensione intrinseca del browser, enorme rispetto al testo.
   "fill: currentColor" la fa seguire il "color" della riga invece di
   restare nera di default. */
.pop-lista-dati__voce i,
.pop-lista-dati__voce svg {
	flex-shrink: 0;
	height: 16px;
	width: auto;
	text-align: center;
	fill: currentColor;
}

.pop-lista-dati--scuro {
	/* Regola di contrasto del sito: verde scuro su sfondo crema (questa
	   variante si usa sempre su sfondo chiaro, vedi commento in testa al file). */
	color: var(--e-global-color-secondary);
}
.pop-lista-dati--scuro .pop-lista-dati__voce i,
.pop-lista-dati--scuro .pop-lista-dati__voce svg {
	color: var(--e-global-color-secondary);
}
.pop-lista-dati--scuro .pop-lista-dati__voce a {
	color: inherit;
	text-decoration: underline;
}

.pop-lista-dati--chiaro {
	color: #F7F0DE;
}
.pop-lista-dati--chiaro .pop-lista-dati__voce i,
.pop-lista-dati--chiaro .pop-lista-dati__voce svg {
	color: #FFC100;
}
.pop-lista-dati--chiaro .pop-lista-dati__voce a {
	color: inherit;
	text-decoration: underline;
}

/* ---- Icone social [ct_social_icone] (vedi inc/contatti-style.php): stesso
   "chip" a contorno scelto per i pulsanti rapidi di Contatti (sfondo
   chiaro fisso, bordo e icona nel colore del brand) — usate sia nel footer
   (su sfondo scuro) sia nella pagina Contatti (su sfondo chiaro): lo sfondo
   chiaro del chip stesso garantisce lo stesso contrasto in entrambi i casi,
   senza bisogno di varianti diverse. In questo file (non in contatti.css)
   perché il footer, a differenza della sezione "Seguici" di Contatti,
   compare su ogni pagina del sito. ---- */
.pop-social-icone {
	display: flex;
	gap: 12px;
}

.pop-social-icona {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--e-global-color-panna-crema);
	border: 1.5px solid currentColor;
	border-radius: 12px;
	text-decoration: none;
}

.pop-social-icona svg {
	height: 20px;
	width: auto;
	fill: none;
	stroke: currentColor;
}

.pop-social-icona--facebook {
	color: #1877F2;
}
.pop-social-icona--instagram {
	color: #E4405F;
}
.pop-social-icona--whatsapp {
	color: #25D366;
}