/*
 * Gli stili del bottone di core che il tema aggiunge.
 *
 * Finora il bottone chiaro su fondo scuro — l'invito secondario, quello che sta
 * accanto o sotto all'azione principale — lo si otteneva scegliendo a mano un
 * colore di fondo e uno di testo dentro a ogni pattern. Fatto nove volte, è
 * andato alla deriva: quattro tinte diverse (`cream`, `paper`, `sand-light`,
 * `white`) per la stessa identica cosa, e nessun posto in cui cambiarla tutta
 * insieme.
 *
 * Qui diventa uno stile del blocco — `register_block_style()`, vedi
 * `register_button_styles()` in functions.php — quindi si sceglie dal pannello
 * «Stili» dell'editor come si sceglie «Contorno», e la tinta la decide questo
 * file per tutte le sezioni in una volta.
 *
 * La specificità: `.wp-block-button.is-style-secondary .wp-block-button__link`
 * pesa quanto le classi di preset che core scrive sull'ancora
 * (`.has-cream-background-color`), e vince perché arriva dopo. Non serve
 * `!important` — quello nei fogli di sezione c'è perché lì si scavalca una
 * regola con la stessa specificità dichiarata più avanti nella cascata.
 */

.wp-block-button.is-style-secondary .wp-block-button__link {
	padding: 14px 28px;
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	background-color: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--burgundy);
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

/* Stessa convenzione del bottone principale: al passaggio cambia la tinta e
   basta. Il bottone non si muove — nessuno spostamento, nessun ingrandimento —
   perché a un elemento che si sposta sotto al puntatore si finisce per dare la
   caccia, e su un contatto la traslazione non si vede proprio. */
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--cream-dark);
	color: var(--wp--preset--color--burgundy);
}

@media ( prefers-reduced-motion: reduce ) {

	.wp-block-button.is-style-secondary .wp-block-button__link {
		transition: none;
	}
}

/*
 * Il bottone bianco, ovunque sia — quello del piè di pagina è il capostipite.
 *
 * Non è il secondario: il secondario è la pillola color crema su fondo scuro,
 * mentre questo è bianco pieno e resta una cosa sua. Gli manca però la risposta
 * al passaggio, perché su bianco una tinta più calda non si distingue: qui
 * scende su un grigio chiaro, che è l'unico neutro della tavolozza e si stacca
 * dal bianco a colpo d'occhio.
 *
 * `!important` perché le classi di preset di core lo portano — `.has-white-
 * background-color` dichiara il proprio fondo con `!important` — e senza non ci
 * sarebbe modo di scavalcarlo al passaggio.
 *
 * La forma — pillola e respiro interno — sta qui e non più negli attributi del
 * blocco. Era scritta a mano in due posti, il piè di pagina e «Caffè sospeso»,
 * con gli stessi quattro numeri copiati: valori così, inchiodati dentro al
 * contenuto salvato, non seguono un cambio di scala e vanno corretti a mano
 * pagina per pagina. Sono gli stessi del bottone secondario, che è l'altra
 * pillola del tema.
 */
.wp-block-button__link.has-white-background-color {
	padding: 14px 28px;
	border-radius: var(--wp--custom--radius--pill);
	transition: background-color 0.2s ease;
}

.wp-block-button__link.has-white-background-color:hover,
.wp-block-button__link.has-white-background-color:focus-visible {
	background-color: var(--wp--preset--color--gray-line) !important;
}

@media ( prefers-reduced-motion: reduce ) {

	.wp-block-button__link.has-white-background-color {
		transition: none;
	}
}

/*
 * Il passaggio dei bottoni che il colore se lo scelgono da sé.
 *
 * Chi imposta il fondo come attributo del blocco si porta dietro la classe di
 * preset di core, e quella dichiara il colore con `!important`. Il `:hover` di
 * `styles.elements.button` in theme.json esce invece dentro a
 * `:root :where(…)`, che di peso non ne ha nessuno: quei bottoni al passaggio
 * non cambiavano niente. Ogni sezione se n'era accorta per conto suo e si era
 * scritta la sua regola con `!important` — nove volte, con nove colori decisi
 * ognuno per conto proprio, e qualcuna se n'era dimenticata (il bottone di
 * «Trova un Caffè Napoli» non rispondeva affatto).
 *
 * Qui la coppia fondo → fondo-al-passaggio si dichiara una volta per ogni tinta
 * che il tema usa davvero sui bottoni. Vale ovunque, anche per un bottone
 * inserito a mano domani dalla bacheca.
 */
.wp-block-button__link.has-rosso-background-color,
.wp-block-button__link.has-burgundy-background-color {
	transition: background-color 0.2s ease;
}

.wp-block-button__link.has-rosso-background-color:hover,
.wp-block-button__link.has-rosso-background-color:focus-visible {
	background-color: var(--wp--preset--color--rosso-dark) !important;
}

.wp-block-button__link.has-burgundy-background-color:hover,
.wp-block-button__link.has-burgundy-background-color:focus-visible {
	background-color: var(--wp--preset--color--burgundy-dark) !important;
}

@media ( prefers-reduced-motion: reduce ) {

	.wp-block-button__link.has-rosso-background-color,
	.wp-block-button__link.has-burgundy-background-color {
		transition: none;
	}
}