/**
 * Dahu Theme Annad 2026 — effets des boutons de blocs (4.44.0 ; effet « electricite » refait en
 * 4.46.0), chargés sur tout le site et dans l'éditeur (inc/blocks.php).
 *
 * 1. Ombre au survol et au focus clavier de tous les boutons du bloc Bouton (.wp-block-button__link :
 *    styles « Annad », pastilles produit des cartes d'avis, bouton du hero…). Le bouton monte d'un
 *    pixel (propriété translate, qui ne gêne aucun transform existant) : ni taille ni mise en page
 *    changées. Ombre double : une ombre portée sombre (visible sur fond clair) et un halo clair (visible
 *    sur fond sombre). Mouvement réduit : ombre sans déplacement ni transition.
 *    Les transitions des boutons qui en déclarent déjà une (front-page.css) sont reprises ici avec le
 *    même sélecteur : cette feuille est chargée après front-page.css (functions.php).
 *
 * 2. Effet « electricite » (4.46.0, d'après le code « Electric Border » fourni par Hugo) : contour
 *    électrique animé, à activer par la classe « electricite » (Gutenberg : bloc Bouton > Avancé >
 *    Classe(s) CSS additionnelle(s), posée sur .wp-block-button ; aussi sur le bloc Boutons, ou sur
 *    n'importe quel élément qui porte directement la classe).
 *    Le filtre SVG #annad-electricite (feTurbulence décalées par feOffset, feComposite, feBlend
 *    color-dodge, feDisplacementMap) est injecté une seule fois, seulement si la page contient
 *    .electricite, par assets/js/electricite.js, qui pose ensuite --annad-electricite-filtre sur
 *    <html> : sans le script, contour et lueur restent, statiques.
 *    Réglages (custom properties, à poser sur le bouton, son bloc ou une section) :
 *    --electricite-couleur   couleur de l'arc, de la lueur et du halo (défaut : vert Annad #D5EB17) ;
 *    --electricite-intensite taille de la lueur et du halo, 0 à 2 (défaut 1) ;
 *    --electricite-halo      opacité du halo de fond, 0 à 1 (défaut 0.35, 0.6 sur fond clair) ;
 *    --electricite-lueur     opacité de la lueur floue, 0 à 1 (défaut 0.7) ;
 *    --electricite-cerne     filtre ajouté autour de l'arc (défaut : rien sur fond sombre,
 *                            drop-shadow sombre de 1px sur fond clair) ;
 *    --electricite-epaisseur épaisseur de l'arc et de la lueur (défaut 2px).
 *    Prend ::before et ::after du lien : sur un bouton qui s'en sert déjà (puce verte du duo de
 *    l'accueil), l'effet les remplace.
 */

/* ---------- 1. Ombre au survol ---------- */

.wp-block-button__link {
	--annad-btn-ombre-duree: 150ms;
	--annad-btn-ombre-survol:
		0 0.5rem 1.125rem -0.375rem rgba(0, 0, 0, 0.5),
		0 0.125rem 0.25rem rgba(0, 0, 0, 0.22),
		0 0 1.25rem rgba(255, 255, 255, 0.26);
	transition:
		box-shadow var(--annad-btn-ombre-duree) ease-out,
		translate var(--annad-btn-ombre-duree) ease-out;
}

.wp-block-button__link:is(:hover, :focus-visible) {
	box-shadow: var(--annad-btn-ombre-survol);
	translate: 0 -1px;
}

.wp-block-button__link:active {
	translate: none;
}

/* Boutons qui ont déjà leur transition (front-page.css) : mêmes sélecteurs, propriétés ajoutées. */
.wp-block-button[class*="is-style-annad-"] .wp-block-button__link {
	transition:
		opacity var(--transition),
		box-shadow var(--annad-btn-ombre-duree) ease-out,
		translate var(--annad-btn-ombre-duree) ease-out;
}

.annad-hero .wp-block-button.annad-hero__cta .wp-block-button__link,
.annad-valeur .wp-block-button.is-style-annad-accent .wp-block-button__link {
	transition:
		background-size var(--annad-cta-fill, 250ms) var(--annad-ease),
		color var(--annad-cta-fill, 250ms) var(--annad-ease),
		box-shadow var(--annad-btn-ombre-duree) ease-out,
		translate var(--annad-btn-ombre-duree) ease-out;
}

.annad-revendeurs__cta .wp-block-button .wp-block-button__link {
	transition:
		background-color var(--annad-transition-base) var(--annad-ease),
		border-color var(--annad-transition-base) var(--annad-ease),
		color var(--annad-transition-base) var(--annad-ease),
		box-shadow var(--annad-btn-ombre-duree) ease-out,
		translate var(--annad-btn-ombre-duree) ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-button__link,
	.wp-block-button[class*="is-style-annad-"] .wp-block-button__link,
	.annad-hero .wp-block-button.annad-hero__cta .wp-block-button__link,
	.annad-valeur .wp-block-button.is-style-annad-accent .wp-block-button__link,
	.annad-revendeurs__cta .wp-block-button .wp-block-button__link {
		transition: none;
	}

	.wp-block-button__link:is(:hover, :focus-visible) {
		translate: none;
	}
}

/* ---------- 2. Effet « electricite » ---------- */

/* Calques de la référence « Electric Border », ramenés à un bouton sans balise ajoutée :
   - box-shadow du lien : bordure extérieure statique (border-outer, couleur à 50 %) et halo de fond
     flou (background-glow) ;
   - ::before : bordure filtrée (main-card), l'arc qui crépite ;
   - ::after : bordure floue 1px + lueur 4px (glow-layer-1 et 2), statique.
   Les calques « overlay » blancs de la référence ne sont pas repris (ils blanchissaient le fond).
   Pseudo-éléments à 3px hors du bouton, sous le texte (z-index -1 dans le contexte d'empilement du
   lien, isolation: isolate), au-dessus de son fond ; aucun effet sur la mise en page. */
.wp-block-button.electricite .wp-block-button__link,
.wp-block-buttons.electricite .wp-block-button__link,
.electricite:not(.wp-block-button, .wp-block-buttons) {
	--electricite-c: var(--electricite-couleur, #d5eb17);
	--electricite-i: var(--electricite-intensite, 1);

	position: relative;
	isolation: isolate;
}

.wp-block-button.electricite .wp-block-button__link::before,
.wp-block-buttons.electricite .wp-block-button__link::before,
.electricite:not(.wp-block-button, .wp-block-buttons)::before,
.wp-block-button.electricite .wp-block-button__link::after,
.wp-block-buttons.electricite .wp-block-button__link::after,
.electricite:not(.wp-block-button, .wp-block-buttons)::after {
	content: "";
	position: absolute;
	inset: -3px;
	z-index: -1;
	width: auto;
	height: auto;
	margin: 0;
	background: none;
	border: var(--electricite-epaisseur, 2px) solid var(--electricite-c);
	border-radius: inherit;
	pointer-events: none;
}

/* Arc : seul calque filtré. --annad-electricite-filtre (url du filtre SVG) n'existe qu'une fois le
   filtre injecté par electricite.js ; sinon opacity(1), neutre : bordure nette. */
.wp-block-button.electricite .wp-block-button__link::before,
.wp-block-buttons.electricite .wp-block-button__link::before,
.electricite:not(.wp-block-button, .wp-block-buttons)::before {
	filter: var(--annad-electricite-filtre, opacity(1)) var(--electricite-cerne, var(--annad-electricite-cerne, opacity(1)));
}

/* Lueur : flou 1px + halo 4px de la couleur, opacité réglable (--electricite-lueur). */
.wp-block-button.electricite .wp-block-button__link::after,
.wp-block-buttons.electricite .wp-block-button__link::after,
.electricite:not(.wp-block-button, .wp-block-buttons)::after {
	opacity: var(--electricite-lueur, 0.7);
	filter: blur(1px) drop-shadow(0 0 calc(4px * var(--electricite-i)) var(--electricite-c));
}

/* Bordure extérieure statique et halo de fond. color-mix() pour les teintes transparentes ; repli
   sans color-mix (Safari < 16.2) : halo de la couleur pleine, resserré, sans bordure extérieure.
   --electricite-halo : opacité du halo de fond (0,35 ; à monter sur fond clair). */
.wp-block-button.electricite .wp-block-button__link,
.wp-block-buttons.electricite .wp-block-button__link,
.electricite:not(.wp-block-button, .wp-block-buttons) {
	--electricite-ombre: 0 0 calc(0.75rem * var(--electricite-i)) -0.375rem var(--electricite-c);
	box-shadow: var(--electricite-ombre);
}

@supports (color: color-mix(in srgb, red 50%, transparent)) {
	.wp-block-button.electricite .wp-block-button__link,
	.wp-block-buttons.electricite .wp-block-button__link,
	.electricite:not(.wp-block-button, .wp-block-buttons) {
		--electricite-ombre:
			0 0 0 1px color-mix(in srgb, var(--electricite-c) 50%, transparent),
			0 0 calc(1.5rem * var(--electricite-i)) color-mix(in srgb, var(--electricite-c) calc(100% * var(--electricite-halo, var(--annad-electricite-halo, 0.35))), transparent);
	}
}

.wp-block-button.electricite .wp-block-button__link:is(:hover, :focus-visible),
.wp-block-buttons.electricite .wp-block-button__link:is(:hover, :focus-visible),
.electricite:not(.wp-block-button, .wp-block-buttons):is(:hover, :focus-visible) {
	box-shadow: var(--electricite-ombre), var(--annad-btn-ombre-survol, 0 0 0 transparent);
}

/* Fond clair (zones claires du thème, fonds clairs de la palette) : le vert y ressort peu. Défauts
   posés sur la section : halo plus opaque, fin cerne sombre autour de l'arc. --electricite-halo et
   --electricite-cerne posées par Hugo l'emportent (`opacity(1)` pour retirer le cerne : `none` n'est
   pas permis dans une liste de filtres). Un fond sombre de la palette dans une section claire revient
   aux défauts sombres. */
:is(.annad-light-page, .annad-light-zone, .has-surface-claire-background-color, .has-texte-clair-background-color, .has-blanc-background-color) {
	--annad-electricite-halo: 0.6;
	--annad-electricite-cerne: drop-shadow(0 0 1px rgba(0, 0, 0, 0.55));
}

:is(.has-fond-background-color, .has-fond-faq-background-color, .has-surface-background-color, .has-surface-2-background-color, .has-surface-3-background-color, .has-accent-background-color) {
	--annad-electricite-halo: 0.35;
	--annad-electricite-cerne: opacity(1);
}

/* Mouvement réduit : bordure et lueur seules, sans filtre (le script n'anime pas non plus). */
@media (prefers-reduced-motion: reduce) {
	.wp-block-button.electricite .wp-block-button__link::before,
	.wp-block-buttons.electricite .wp-block-button__link::before,
	.electricite:not(.wp-block-button, .wp-block-buttons)::before {
		filter: var(--electricite-cerne, var(--annad-electricite-cerne, opacity(1)));
	}
}
