/*
 * Gallia — Design system global : jetons de couleur canoniques, police
 * Roboto auto-hébergée, harmonisation de la hiérarchie typographique et
 * des composants répétés (boutons, cartes, badges, inputs) sur TOUT le
 * site. Seule source canonique des couleurs de marque — le reste du CSS
 * du projet consomme ces variables via var(--gallia-*), ne redéclare
 * jamais une valeur littérale concurrente.
 *
 * Portée délibérément prudente : ce fichier ne touche AUCUNE mise en page
 * (largeurs, grilles, positionnement) déjà fonctionnelle — uniquement
 * couleurs, police, rayons de bordure, tailles de texte, espacements des
 * composants. Voir gallia-*-style.php pour l'intégration ciblée de
 * bbPress/BuddyPress/LifterLMS/PMPro.
 */

/*
 * ---------- Police Roboto auto-hébergée (RGPD — voir gallia-brand.php) ----------
 *
 * 🔴 Écart réel corrigé (chantier "corrections fin", 2026-08-29) : les 3
 * fichiers STATIQUES ci-dessous (un par graisse, ~17 Ko chacun) rendaient
 * un poids 400 visiblement plus FIN que Skool à taille égale, malgré des
 * métriques CSS identiques (font-family/size/weight/color tous confirmés
 * identiques par ailleurs) — jamais expliqué par une différence de contenu
 * CSS. Cause trouvée par comparaison visuelle RÉELLE, fichier contre
 * fichier, même page de test, même taille : le fichier RÉELLEMENT chargé
 * par Skool (confirmé par l'onglet Réseau, URL exacte vérifiée) est une
 * POLICE VARIABLE (axe wght 100-900, 43 Ko), pas 3 instances statiques —
 * son interpolation interne au poids 400 rend visiblement plus gras que la
 * coupe statique 400 dédiée que ce projet auto-hébergeait jusqu'ici (même
 * version Roboto 3.015/2026 des deux côtés, confirmé par la table `name`
 * interne des fichiers — ce n'est PAS une différence de version, seulement
 * statique-vs-interpolé). Remplacé par LE MÊME fichier variable que Skool
 * (même URL source fonts.gstatic.com, auto-hébergé selon la même méthode
 * RGPD qu'avant — voir gallia-brand.php) : 1 seul fichier couvre désormais
 * les 3 graisses 400/500/700 déjà utilisées partout sur ce site (aucune
 * autre règle CSS à changer, un navigateur choisit automatiquement le bon
 * point de l'axe selon le `font-weight` demandé, standard CSS Fonts
 * Module 4). `format('woff2')` (pas `'woff2-variations'`) : reprend
 * exactement le hint utilisé par Google lui-même dans sa propre réponse
 * CSS, la compatibilité la plus large possible.
 */

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('fonts/roboto-variable.woff2') format('woff2');
}

/* ---------- Jetons de marque (source canonique unique) ---------- */

:root {
	/* Couleurs. Le jaune est réservé aux éléments d'accent/action (boutons
	   CTA, éléments actifs, liens de nav actifs) — JAMAIS un fond général
	   ni du texte courant (voir gallia-*-style.php, respecté partout). */
	--gallia-black: #0F0F0F;
	--gallia-white: #FFFFFF;
	--gallia-yellow: #F8D481;
	/*
	 * Chantier "refonte exhaustive page créateur façon Skool" (2026-08-22),
	 * point 6 : valeur EXACTE mesurée via getComputedStyle() sur le bouton
	 * CTA réel de skool.com/aivideobootcamp au survol (règle CSS
	 * `.eJkdnq:hover { background-color: rgb(241, 208, 124); }` lue
	 * directement dans sa feuille de style, pas estimée) — remplace
	 * l'ancienne valeur #F2C561 (posée sans mesure de référence à l'époque).
	 */
	--gallia-yellow-hover: #F1D07C;
	--gallia-border: #E4E4E4;
	--gallia-text-muted: #555555;

	/* Chantier 2026-08-21 (session suivante) : fond de page gris très clair
	   VS blocs de contenu en blanc pur — remplace les lignes de séparation
	   retirées cette session par un contraste de couleur de fond, comme sur
	   Skool. Valeur EXACTE relevée par inspection technique réelle de
	   skool.com (Inspecter → styles calculés du <body> de la page d'accueil
	   découverte, getComputedStyle().backgroundColor), pas devinée :
	   rgb(248, 247, 245) = #F8F7F5. Les cartes blanches de Skool inspectées
	   au même moment : #FFFFFF, bordure 1px solid rgb(228,228,228) = #E4E4E4
	   (valeur reprise ci-dessus pour --gallia-border), border-radius 10px
	   (repris ci-dessous pour --gallia-radius-card, était 12px avant cette
	   session). */
	--gallia-page-bg: #F8F7F5;

	/* Typographie */
	--gallia-font: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

	/* Composants répétés — mêmes rayons/ombres partout (boutons, cartes,
	   badges, inputs).
	   Chantier "corrections visuelles complémentaires façon Skool"
	   (2026-08-22, session suivante), Partie 2 — CHANGEMENT DE DÉCISION
	   assumé par rapport aux chantiers précédents : la forme pilule (999px)
	   des boutons jaunes est remplacée par la forme rectangulaire mesurée
	   sur skool.com/aivideobootcamp (`.eJkdnq { border-radius: 4px; }`,
	   règle CSS lue directement, reconfirmée par une 2e inspection le même
	   jour). Le nom de la variable reste `--gallia-radius-pill` (même
	   convention que `--gallia-yellow-hover`, dont le NOM est resté malgré
	   un changement de valeur) — seule sa valeur change, une seule fois ici,
	   ce qui propage automatiquement à TOUS les boutons jaunes du site
	   (.gallia-btn et ses dérivés, PMPro/BuddyPress/bbPress/LifterLMS,
	   .gallia-accent-btn, .gallia-ca-submit) sans avoir à toucher chaque
	   fichier individuellement — voir rapport de chantier pour la liste
	   complète vérifiée. Les avatars/badges circulaires (999px) sont
	   TOUJOURS codés en dur séparément (jamais via cette variable) :
	   volontairement non concernés par ce changement. */
	--gallia-radius-pill: 4px;
	--gallia-radius-card: 10px;
	--gallia-radius-input: 8px;
	--gallia-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06);
	--gallia-shadow-elevated: 0 10px 40px rgba(0, 0, 0, 0.15);
}

/* ---------- Typographie globale ---------- */

body,
input,
textarea,
select,
button,
.gallia-brand-font {
	font-family: var(--gallia-font);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--gallia-font);
	font-weight: 700;
	color: var(--gallia-black);
}

h1 { font-size: 2rem; line-height: 1.25; }
h2 { font-size: 1.5rem; line-height: 1.3; }
h3 { font-size: 1.15rem; line-height: 1.35; }
h4, h5, h6 { font-size: 1rem; line-height: 1.4; }

body {
	color: var(--gallia-black);
	/*
	 * 🔴 !important nécessaire (confirmé réellement via getComputedStyle(),
	 * pas supposé) : Astra imprime son propre `body { background-color:
	 * #fff }` en <style> inline dans <head>, APRÈS cette feuille dans
	 * l'ordre du DOM — même spécificité (1 sélecteur d'élément), donc
	 * l'ordre de chargement tranche en faveur d'Astra sans !important.
	 * Même famille de piège déjà documentée plusieurs fois sur ce projet
	 * (.gallia-btn contre .ast-single-post .entry-content a, .site-branding
	 * contre .ast-logo-title-inline .ast-site-identity).
	 */
	background: var(--gallia-page-bg) !important;
}

a {
	color: var(--gallia-black);
}

/* Liens de navigation actifs : seul cas légitime de texte en jaune (élément
   interactif mis en avant, pas du texte courant). */
.gallia-global-header nav a.current,
.gallia-global-header nav a[aria-current="page"],
.gallia-left-sidebar a.is-active,
.gallia-left-sidebar a[aria-current="page"] {
	color: var(--gallia-black);
	font-weight: 700;
}

/* ---------- Boutons/inputs génériques (formulaires natifs WP/thème) ---------- */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea,
select {
	border-radius: var(--gallia-radius-input);
	border: 1px solid var(--gallia-border);
	font-family: var(--gallia-font);
}

/* Boutons génériques du thème/plugins natifs non déjà couverts par les
   classes .gallia-btn (widget d'abonnement) — accent jaune cohérent,
   jamais appliqué à un fond de page ou à du texte courant. */
.gallia-accent-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1.1rem;
	border-radius: var(--gallia-radius-pill);
	font-weight: 700;
	font-family: var(--gallia-font);
	background: var(--gallia-yellow);
	color: var(--gallia-black);
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: background-color 0.15s ease-in-out;
}

.gallia-accent-btn:hover {
	background: var(--gallia-yellow-hover);
}

/*
 * 🔴 Bug réel systémique trouvé et corrigé (chantier "corrections
 * complémentaires façon Skool", 2026-08-22, session suivante) : Astra
 * imprime une règle globale `button:focus { background:
 * var(--ast-global-color-1); }` (bleu, rgb(4,92,180)) qui s'applique à TOUT
 * <button> du site n'ayant pas son propre `:focus` explicite. Découvert 2
 * fois indépendamment le même jour (bouton "S'abonner gratuitement" ET
 * l'onglet "Classement", corrigés localement dans leurs fichiers
 * respectifs) — plutôt que de continuer à corriger fichier par fichier à
 * chaque nouvelle découverte, filet de sécurité GÉNÉRIQUE ici : neutralise
 * la règle Astra pour TOUT bouton `.gallia-*` du site (spécificité
 * volontairement basse — un composant qui veut son propre traitement de
 * focus, comme .gallia-btn-cta:focus ci-dessus, garde la main car sa règle
 * est plus spécifique). Repéré par un clic Playwright réel suivi d'une
 * inspection immédiate, jamais en lisant seulement le code.
 */
/*
 * 🔴 Correctif du correctif, trouvé en testant réellement (pas en relisant
 * le code) : `button[class*="gallia-"]:focus` avait, sans que ce soit
 * l'intention, une spécificité PLUS ÉLEVÉE qu'un simple `.gallia-xxx:focus`
 * (un sélecteur d'attribut compte comme une classe, combiné à l'élément
 * `button` ça dépasse une classe seule) — ça a cassé le focus de
 * .gallia-sidebar-login-btn (fond voulu #f0f0f0, devenu transparent malgré
 * sa propre règle :focus). `:where()` neutralise la spécificité du
 * sélecteur d'attribut, pour que ce filet de sécurité reste bien LE MOINS
 * spécifique de tous — n'importe quel composant garde la main avec une
 * simple classe, comme prévu à l'origine.
 */
button:where([class*="gallia-"]):focus {
	background-color: unset;
}

/*
 * 🔴 SUITE DU MÊME PIÈGE, MESURÉE LE 01/09/2026 — la COULEUR DU TEXTE.
 *
 * Le filet ci-dessus neutralisait le FOND imposé par Astra au focus. Il ne
 * disait rien de la COULEUR, et Astra en impose une au SURVOL :
 *
 *     button:focus, .menu-toggle:hover, button:hover, .ast-button:hover, …
 *     { color: rgb(255,255,255); background: var(--ast-global-color-1); }
 *
 * imprimée en <style> dans le <head>. Relevé réel du 01/09/2026 :
 *
 *   BOUTON « S'abonner gratuitement » (page créateur)
 *     repos  : rgb(15,15,15) sur fond rgb(248,212,129)
 *     survol : rgb(255,255,255) sur fond rgb(241,208,124)  ← BLANC SUR JAUNE
 *
 * Autrement dit, le bouton le plus important du site était quasi illisible au
 * survol, et personne ne l'avait vu. Les <a> voisins, eux, se comportaient
 * correctement : L'ASYMÉTRIE ENTRE <button> ET <a> EST LE SIGNAL de ce piège.
 *
 * ⚠️ CE N'EST PAS UN PROBLÈME DE SPÉCIFICITÉ INSURMONTABLE. Un bloc <style>
 * dans le <head> reste une feuille ordinaire : la spécificité s'y applique
 * normalement. `button:hover` pèse (0,1,1) ; une simple classe + pseudo-classe
 * pèse (0,2,0) et gagne. Si Astra l'emportait jusqu'ici, c'est UNIQUEMENT
 * parce qu'aucune de nos règles ne déclarait de `color` au survol : rien ne
 * s'y opposait. Aucun !important n'est donc nécessaire, et il n'y en a pas.
 *
 * VALEUR RETENUE : var(--gallia-black), c'est-à-dire EXACTEMENT la couleur
 * déjà appliquée au repos. Le survol ne change plus que le fond, jamais la
 * lisibilité. Choix délibéré plutôt que le bleu des liens : sur le jaune de
 * marque, le noir offre nettement plus de contraste, et il reste dans la
 * palette du projet — le bleu n'en fait pas partie.
 *
 * `:where()` maintient la spécificité au plus bas, comme le filet ci-dessus :
 * tout composant qui veut son propre traitement garde la main avec une simple
 * classe.
 */
button:where([class*="gallia-"]):hover,
button:where([class*="gallia-"]):focus,
button:where([class*="gallia-"]):active {
	color: var(--gallia-black);
}

/* ---------- Cartes génériques ---------- */

.gallia-card {
	background: var(--gallia-white);
	border: 1px solid var(--gallia-border);
	border-radius: var(--gallia-radius-card);
	box-shadow: var(--gallia-shadow-card);
}

/*
 * ---------- Épuration des lignes superflues (Partie C, reprise 2026-08-21) ----------
 *
 * 🔴 Bug réel du chantier précédent (signalé par capture d'écran, confirmé
 * en inspectant le DOM RENDU réellement, pas seulement le code) : la règle
 * `#masthead { border-bottom: none }` posée alors ne suffisait pas — la
 * ligne visible sous "Radio Jhesus Maria / Politique de cookies / Réseau
 * départemental" ne vient PAS de #masthead lui-même mais d'un enfant
 * interne à lui, `.ast-primary-header-bar` (règle Astra propre à cet
 * élément, jamais couverte par la règle précédente). Confirmé par
 * `getComputedStyle()` réel sur la page : #masthead lui-même n'a plus de
 * bordure (correctif précédent fonctionnait pour LUI), mais
 * `.ast-primary-header-bar` (son enfant direct) a la sienne, indépendante.
 *
 * De même, la ligne sous le bandeau "Gallia" tout en haut n'a JAMAIS été
 * traitée la fois précédente : elle vient de `.gallia-global-header`
 * elle-même (voir gallia-global-header/header.css — bordure retirée dans
 * ce même chantier). Elle n'a plus lieu d'être : le contraste de fond
 * (bandeau blanc sur page grise, voir --gallia-page-bg) fait maintenant ce
 * travail de séparation visuelle, sans trait.
 */
#masthead,
#masthead .ast-primary-header-bar {
	border-bottom: none !important;
	box-shadow: none !important;
}

/*
 * ---------- Flèche "retour en haut" native Astra retirée (chantier "lot de
 * corrections... fidélité Skool", 2026-08-29), point 8 ----------
 * `#ast-scroll-top` (`.ast-scroll-top-icon.ast-scroll-to-top-right`) —
 * fonctionnalité native du thème Astra (option "Scroll to Top" du
 * Customizer), pas un composant Gallia : confirmé en inspectant le DOM en
 * direct (élément position:fixed, classes/id Astra reconnues, absent de
 * tout fichier de ce projet). Masquée en CSS ici plutôt que désactivée
 * depuis le Customizer Astra (wp-admin, hors de portée de ce chantier
 * mené uniquement via SSH sur les fichiers) — même résultat visuel, sans
 * dépendre d'un réglage wp-admin qu'une future mise à jour du thème
 * pourrait réinitialiser silencieusement.
 */
#ast-scroll-top {
	display: none !important;
}