/* ==========================================================================
   CAS Jaman — reliquat CSS
   --------------------------------------------------------------------------
   Chargée côté public ET dans l'éditeur (voir functions.php).

   Règle de conduite : si une chose peut être exprimée dans theme.json ou dans
   les réglages d'un bloc, elle ne va PAS ici. Ce fichier ne doit contenir que
   ce que l'éditeur de site ne sait pas produire. Plus il reste court, plus le
   thème reste modifiable sans toucher au code.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. Accessibilité — visibilité du focus clavier
   Le focus par défaut de WordPress disparaît sur les fonds sombres du hero.
   -------------------------------------------------------------------------- */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Sur fond sombre (hero, bandeaux photo), l'accent terre manque de contraste. */
.has-overlay-background-color :where(a, button):focus-visible,
.wp-block-cover :where(a, button):focus-visible {
	outline-color: #FFFFFF;
}


/* --------------------------------------------------------------------------
   2. Navigation par ancres
   La page « La section » regroupe histoire, comité, groupes et local sous des
   ancres. Sans scroll-margin, l'en-tête collant recouvre le titre visé.
   -------------------------------------------------------------------------- */

:target {
	scroll-margin-top: 6rem;
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}


/* --------------------------------------------------------------------------
   3. Confort de lecture
   -------------------------------------------------------------------------- */

:where(h1, h2, h3, .wp-block-post-title) {
	text-wrap: balance;
}

:where(p, li) {
	text-wrap: pretty;
}

/* Les liens soulignés dans le corps de texte : on éloigne le trait du texte
   pour ne pas hacher les jambages (« g », « p », « q » — fréquents en français). */
:where(.entry-content, .wp-block-post-content) a:where(:not(.wp-element-button)) {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
}


/* --------------------------------------------------------------------------
   4. Cartes — récits, cabanes, sorties
   Le survol est le seul indice que la carte entière est cliquable.
   -------------------------------------------------------------------------- */

.jaman-carte {
	transition: transform 180ms ease, box-shadow 180ms ease;
}

.jaman-carte:hover,
.jaman-carte:focus-within {
	transform: translateY(-3px);
	box-shadow: var(--wp--preset--shadow--relief);
}

.jaman-carte img {
	transition: transform 320ms ease;
}

.jaman-carte:hover img {
	transform: scale(1.03);
}

/* Recadrage de l'image sans débordement au survol. */
.jaman-carte .wp-block-post-featured-image,
.jaman-carte figure {
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.jaman-carte,
	.jaman-carte img {
		transition: none;
	}

	.jaman-carte:hover,
	.jaman-carte:focus-within,
	.jaman-carte:hover img {
		transform: none;
	}
}


/* --------------------------------------------------------------------------
   5. En-tête posé sur le hero
   Le bloc En-tête est imbriqué DANS le bloc Bannière de la page d'accueil —
   pas superposé en CSS. Il ne reste qu'à forcer le blanc sur la navigation,
   que les réglages de bloc n'appliquent pas au sous-menu déroulant.
   -------------------------------------------------------------------------- */

.jaman-entete-hero :where(.wp-block-navigation__submenu-container) {
	color: var(--wp--preset--color--contrast);
	background-color: var(--wp--preset--color--base);
}

/* Le bloc-marque a un fond transparent et une encre à mi-luminance (131/255) :
   lisible sur blanc, limite sur une photo sombre. Une ombre portée le décolle
   du fond. Un vrai logo blanc pour fonds sombres resterait préférable. */
.jaman-entete-hero .wp-block-site-logo img {
	filter: drop-shadow(0 2px 10px rgba(0, 0, 0, .55));
}

/* Le libellé « Espace membres » passait à la ligne dans l'en-tête. */
:where(.jaman-entete, .jaman-entete-hero) .wp-block-button__link {
	white-space: nowrap;
}


/* --------------------------------------------------------------------------
   5 bis. Bannière d'accueil sans photo
   La bannière utilise l'image mise en avant de la page. Tant qu'aucune photo
   n'est définie, le voile à 50 % s'applique sur du vide et donne un gris terne.
   Cette couleur de fond sert de repli ; dès qu'une photo est là, elle la
   recouvre entièrement et cette règle devient invisible.
   -------------------------------------------------------------------------- */

.jaman-hero {
	background-color: var(--wp--preset--color--contrast);
}


/* --------------------------------------------------------------------------
   6. Espace membres
   Un liseré discret rappelle en permanence qu'on est en zone réservée, pour
   éviter qu'un document interne soit pris pour une page publique.
   -------------------------------------------------------------------------- */

.jaman-zone-membres {
	border-top: 3px solid var(--wp--preset--color--primary);
}