/* ---------------------------------------------------------------------------
 * Blocco "etichetta + valore" dello shortcode [ak_dato].
 *
 * Riproduce la tipografia che prima era impostata a mano sui due widget
 * Elementor: l'etichetta col primary font e accent 4, il valore con lo stile
 * h4 e accent 6. Le variabili --e-global-* sono quelle del tema VamTam, quindi
 * se si cambiano i colori o i font globali questo blocco segue da solo.
 * ------------------------------------------------------------------------- */

.ak-dato {
	--ak-dato-gap: 4px;      /* stacco fra etichetta e valore */
	--ak-dato-spazio: 18px;  /* stacco dal blocco successivo */

	margin-bottom: var(--ak-dato-spazio);
}

.ak-dato .ak-dato__etichetta {
	display: block;
	margin-bottom: var(--ak-dato-gap);
	font-family: var(--e-global-typography-vamtam_primary_font-font-family), Sans-serif;
	font-size: var(--e-global-typography-vamtam_primary_font-font-size);
	font-weight: var(--e-global-typography-vamtam_primary_font-font-weight);
	font-style: var(--e-global-typography-vamtam_primary_font-font-style);
	line-height: var(--e-global-typography-vamtam_primary_font-line-height);
	letter-spacing: var(--e-global-typography-vamtam_primary_font-letter-spacing);
	word-spacing: var(--e-global-typography-vamtam_primary_font-word-spacing);
	text-transform: var(--e-global-typography-vamtam_primary_font-text-transform);
	text-decoration: var(--e-global-typography-vamtam_primary_font-text-decoration);
	color: var(--e-global-color-vamtam_accent_4);
}

/* Doppia classe: serve per battere gli stili che il tema mette sugli h4. */
.ak-dato .ak-dato__valore {
	margin: 0;
	font-family: var(--e-global-typography-vamtam_h4-font-family), Sans-serif;
	font-size: var(--e-global-typography-vamtam_h4-font-size);
	font-weight: var(--e-global-typography-vamtam_h4-font-weight);
	font-style: var(--e-global-typography-vamtam_h4-font-style);
	line-height: var(--e-global-typography-vamtam_h4-line-height);
	letter-spacing: var(--e-global-typography-vamtam_h4-letter-spacing);
	word-spacing: var(--e-global-typography-vamtam_h4-word-spacing);
	text-transform: var(--e-global-typography-vamtam_h4-text-transform);
	color: var(--e-global-color-vamtam_accent_6);
}

/* Varianti da richiamare con l'attributo classe="" dello shortcode, es.
 * [ak_dato etichetta="Cliente:" campo="rlz_cliente" classe="ak-bold"].
 * La doppia classe serve a battere il font-weight che arriva dallo stile h4. */
.ak-dato.ak-bold .ak-dato__valore {
	font-weight: 700;
}

/* I link dentro al valore (termini con pagina collegata) restano del colore
 * del dato: il tema colorerebbe gli <a> di suo. */
.ak-dato .ak-dato__valore a,
.ak-dato .ak-dato__valore a:link,
.ak-dato .ak-dato__valore a:visited {
	color: inherit;
	text-decoration: none;
}

.ak-dato .ak-dato__valore a:hover {
	text-decoration: underline;
}

/* Immagini e gallerie passate come valore non sfondano il contenitore. */
.ak-dato .ak-dato__valore img {
	max-width: 100%;
	height: auto;
}