/**
 * Variantes de boutons.
 *
 * Le jaune est la variante par défaut : il est décrit dans theme.json, pas ici.
 * Ce fichier ne porte que les quatre écarts à cette règle, enregistrés comme
 * styles de bloc dans functions.php.
 */

/* -------------------------------------------------------------------
 * Sauge — sur photo, ou en rappel discret dans le pied de page
 * ------------------------------------------------------------------- */

.wp-block-button.is-style-sauge > .wp-block-button__link {
	background-color: var( --wp--preset--color--sauge );
	color: var( --wp--preset--color--texte );
}

.wp-block-button.is-style-sauge > .wp-block-button__link:hover,
.wp-block-button.is-style-sauge > .wp-block-button__link:focus {
	background-color: #a7b57f;
}

/* -------------------------------------------------------------------
 * Vert foncé — l'option retenue dans les sélecteurs de la fiche d'abonnement
 * ------------------------------------------------------------------- */

.wp-block-button.is-style-vert-fonce > .wp-block-button__link {
	background-color: var( --wp--preset--color--vert-fonce );
	color: var( --wp--preset--color--blanc );
}

.wp-block-button.is-style-vert-fonce > .wp-block-button__link:hover,
.wp-block-button.is-style-vert-fonce > .wp-block-button__link:focus {
	background-color: #0f4126;
}

/* -------------------------------------------------------------------
 * Contour — le « S'abonner » de l'en-tête
 *
 * Il emprunte la couleur courante pour fonctionner aussi bien sur le fond
 * crème que sur la photo d'ouverture.
 * ------------------------------------------------------------------- */

.wp-block-button.is-style-contour > .wp-block-button__link {
	background-color: transparent;
	color: currentColor;
	border: 1.5px solid currentColor;
	box-shadow: none;
	padding: 0.7rem 1.9rem;
	font-weight: 700;
}

/*
 * Au survol, on remplit — sans toucher à la couleur du texte.
 *
 * Inverser les couleurs serait plus franc, mais impossible : WordPress écrit
 * ses classes de couleur (`has-blanc-color`) en `!important`. Le fond passait,
 * le texte non — le libellé disparaissait, blanc sur blanc.
 *
 * Un voile tiré de `currentColor` règle la question et sert les deux contextes
 * du même coup : blanchâtre sur la photo d'accueil, verdâtre sur le fond crème.
 * C'est déjà la logique de la bordure de cette variante.
 */
.wp-block-button.is-style-contour > .wp-block-button__link:hover,
.wp-block-button.is-style-contour > .wp-block-button__link:focus-visible {
	background-color: rgba( 127, 127, 127, 0.18 );
	background-color: color-mix( in srgb, currentColor 16%, transparent );
}

/* -------------------------------------------------------------------
 * Lien en Berkshire — « En savoir plus », « Vers le blog »
 *
 * Dans la maquette ce ne sont pas des boutons mais des mots soulignés, à la
 * taille d'un titre. Ils restent des boutons dans l'éditeur parce que c'est là
 * qu'on veut pouvoir les déplacer et leur donner une cible.
 * ------------------------------------------------------------------- */

.wp-block-button.is-style-lien-titre > .wp-block-button__link {
	background-color: transparent;
	box-shadow: none;
	padding: 0;
	border-radius: 0;
	color: var( --wp--preset--color--vert-fonce );
	font-family: var( --wp--preset--font-family--display );
	font-size: var( --wp--preset--font-size--x-large );
	font-weight: 400;
	line-height: 1.15;
	text-decoration: underline;
	text-underline-offset: 0.12em;
	text-decoration-thickness: 0.055em;
}

.wp-block-button.is-style-lien-titre > .wp-block-button__link:hover,
.wp-block-button.is-style-lien-titre > .wp-block-button__link:focus {
	background-color: transparent;
	text-decoration: none;
}