/*
 * Thème CXP, direction « Carte » (docs/maquettes/b-carte.html).
 * Couleurs, polices et tailles : theme.json. Ce fichier ne porte que ce que theme.json ne sait pas dire.
 */

/* Accessibilité */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background: var(--wp--preset--color--blanc);
	clip-path: none;
	color: var(--wp--preset--color--encre);
	display: block;
	height: auto;
	left: 0.5rem;
	padding: 0.75rem 1rem;
	top: 0.5rem;
	width: auto;
	z-index: 100000;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--chartreuse-verte);
	outline-offset: 3px;
}

/* Sur les fonds sombres, le vert du contour n'est pas visible : jaune Chartreuse (6,6:1 sur #1d4433, 10,2:1 sur #1f1d1a) */
.cxp-section--editions :where(a, button, input, select, textarea, summary):focus-visible,
.cxp-pied :where(a, button, input, select, textarea, summary):focus-visible {
	outline-color: var(--wp--preset--color--chartreuse-jaune);
}

h1,
h2,
h3 {
	text-wrap: balance;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* En-tête : bande blanche, le logo JPG garde son fond blanc */
.cxp-entete {
	background: var(--wp--preset--color--blanc);
}

.cxp-entete__barre {
	gap: 1.5rem;
	min-height: 5rem;
}

.cxp-entete .custom-logo {
	display: block;
	height: 4.25rem;
	width: auto;
}

.cxp-entete .wp-block-navigation {
	margin-left: auto;
}

.cxp-entete .wp-block-navigation-item__content {
	border-bottom: 2px solid transparent;
	padding-block: 0.25rem;
	text-decoration: none;
}

.cxp-entete .wp-block-navigation-item__content:hover,
.cxp-entete .wp-block-navigation-item__content:focus-visible {
	border-bottom-color: var(--wp--preset--color--chartreuse-verte);
}

.cxp-entete .wp-block-navigation__responsive-container-open {
	border: 2px solid var(--wp--preset--color--encre);
	border-radius: 0.35rem;
	padding: 0.4rem 0.6rem;
}

.cxp-entete__inscription {
	display: none;
}

.cxp-entete__inscription .wp-element-button {
	background: var(--wp--preset--color--chartreuse-jaune);
	color: var(--wp--preset--color--encre);
}

@media (min-width: 782px) {
	.cxp-entete__inscription {
		display: block;
	}
}

/* Burger jusqu'à 782 px (le bloc Navigation bascule à 600 px) */
@media (min-width: 600px) and (max-width: 781.98px) {
	.cxp-entete .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.cxp-entete .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Bandeau : extrait de carte */
.cxp-bandeau {
	background:
		url(images/itineraire.svg) center 20% / cover no-repeat,
		url(images/courbes.svg) center 20% / cover no-repeat,
		var(--wp--preset--color--creme);
	border-block: 1px solid var(--wp--preset--color--courbe);
}

/* Écrans larges : les courbes couvrent toute la largeur, l'itinéraire et le parapente gardent leur taille de 1280 px. */
@media (min-width: 1400px) {
	.cxp-bandeau {
		background-size: 80rem auto, cover;
	}
}

.cxp-bandeau--page {
	padding-block: 2rem 2.5rem;
}

.cxp-bandeau__grille {
	display: grid;
	gap: 1.5rem;
	padding-block: 2.5rem 3rem;
}

.cxp-bandeau__titre {
	margin: 0;
}

.cxp-bandeau__accroche {
	font-size: 1.2rem;
	margin: 0.75rem 0 0;
	max-width: 30rem;
}

.cxp-bandeau__titre,
.cxp-bandeau__accroche,
.cxp-banner__title,
.cxp-banner__subtitle {
	text-shadow:
		0 0 3px var(--wp--preset--color--creme),
		0 0 8px var(--wp--preset--color--creme),
		0 0 14px var(--wp--preset--color--creme);
}

.cxp-cartouche {
	background: var(--wp--preset--color--blanc);
	border: 2px solid var(--wp--preset--color--encre);
	border-radius: 0.35rem;
	display: grid;
	gap: 0.35rem;
	max-width: 24rem;
	padding: 1rem 1.25rem;
}

.cxp-cartouche > * {
	margin: 0;
}

.cxp-cartouche .cxp-edition-meta__dates {
	font-family: var(--wp--preset--font-family--titre);
	font-size: 1.6rem;
	font-weight: 700;
	margin: 0;
}

.cxp-cartouche__lieu {
	color: var(--wp--preset--color--cmvd);
}

.cxp-cartouche .cxp-register-button {
	margin-top: 0.5rem;
}

@media (min-width: 900px) {
	.cxp-bandeau__grille {
		align-items: end;
		grid-template-columns: 1.2fr 1fr;
		padding-block: 4.5rem;
	}

	.cxp-cartouche {
		justify-self: end;
	}
}

/* Bandeau des pages (bloc cxp/banner et titres des modèles) */
.cxp-banner__title {
	font-size: clamp(2.2rem, 7vw, 4rem);
	margin: 0;
}

.cxp-banner__subtitle {
	font-size: 1.15rem;
	margin: 0.5rem 0 0;
}

.cxp-banner--epreuve {
	border-left: 0.75rem solid var(--cxp-epreuve, var(--wp--preset--color--cmvd));
	padding-left: 1.25rem;
}

/* Sections */
.cxp-section {
	padding-block: 3rem;
}

.cxp-section--editions {
	background: var(--wp--preset--color--chartreuse-verte-fonce);
	color: var(--wp--preset--color--blanc);
}

.cxp-section--editions h2,
.cxp-section--editions a {
	color: inherit;
}

/* Page d'une édition : affiche à gauche, dates, liens et texte à droite */
.cxp-edition__grille {
	display: grid;
	gap: 2rem;
}

.cxp-edition__affiche img {
	border-radius: 0.35rem;
	display: block;
	height: auto;
	width: 100%;
}

@media (min-width: 782px) {
	.cxp-edition__grille {
		align-items: start;
		grid-template-columns: 16rem 1fr;
	}
}

/* Épreuves : une légende de carte */
.cxp-epreuves__item {
	background: var(--wp--preset--color--blanc);
	border-left: 0.75rem solid var(--cxp-epreuve, var(--wp--preset--color--cmvd));
	border-radius: 0.35rem;
	border-top: 0;
	padding: 1.25rem 1.25rem 1.25rem 1.5rem;
}

.cxp-epreuves__name {
	align-items: center;
	display: flex;
	font-size: 1.9rem;
	gap: 0.6rem;
}

.cxp-epreuves__name::before {
	border-top: 0.35rem dashed var(--cxp-epreuve, var(--wp--preset--color--cmvd));
	content: "";
	flex: 0 0 2.5rem;
}

/* Affiches des éditions */
.cxp-edition-posters__image,
.cxp-edition-posters__placeholder {
	border-radius: 0.35rem;
}

.cxp-section--editions .cxp-edition-posters__placeholder {
	background: #2b5a45;
}

.cxp-edition-posters__year {
	font-family: var(--wp--preset--font-family--titre);
	font-size: 1.6rem;
}

/* Partenaires : tuiles blanches */
.cxp-partners__item {
	background: var(--wp--preset--color--blanc);
	border-radius: 0.35rem;
	padding: 0.5rem;
}

/* Encadrés des compositions */
.wp-block-group[class*="is-style-epreuve-"] {
	background: var(--wp--preset--color--blanc);
	border-left: 0.75rem solid var(--cxp-epreuve, var(--wp--preset--color--cmvd));
	border-radius: 0.35rem;
	padding: 1.25rem 1.5rem;
}

.cxp-info {
	background: var(--wp--preset--color--blanc);
	border: 2px solid var(--wp--preset--color--encre);
	border-radius: 0.35rem;
	padding: 1.25rem 1.5rem;
}

/* Pied de page */
.cxp-pied {
	background: var(--wp--preset--color--encre);
	color: var(--wp--preset--color--creme);
	font-size: var(--wp--preset--font-size--small);
	padding-block: 2.5rem;
}

.cxp-pied a,
.cxp-pied h2 {
	color: inherit;
}

.cxp-pied h2 {
	font-size: 1.3rem;
	margin: 0 0 0.25rem;
}

.cxp-pied p {
	margin: 0;
}

.cxp-pied__colonnes {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}

.cxp-pied__liens {
	font-weight: 400;
	gap: 0.25rem;
}

.cxp-pied__liens .wp-block-navigation-item__content {
	text-decoration: underline;
}

/* Affiches : deux par ligne sur mobile */
.cxp-edition-posters__list {
	grid-template-columns: repeat(auto-fill, minmax(min(9rem, 100%), 1fr));
}

@media (min-width: 782px) {
	.cxp-edition-posters__list {
		grid-template-columns: repeat(auto-fill, minmax(12rem, 12rem));
	}
}

/* Tableaux des compositions (programme, sommets) */
.cxp-programme table,
.cxp-sommets table {
	background: var(--wp--preset--color--blanc);
	border-collapse: collapse;
	width: 100%;
}

.cxp-programme :where(th, td),
.cxp-sommets :where(th, td) {
	border: 1px solid var(--wp--preset--color--courbe);
	padding: 0.5rem 0.75rem;
	text-align: left;
}

.cxp-programme th,
.cxp-sommets th {
	background: var(--wp--preset--color--chartreuse-verte-clair);
}