/*
 * Habillage du rendu du module de réservations (calendrier + formulaire),
 * sur les pages qui portent le modèle « Réservation » — sujet 4, étape 3 ;
 * centrage, largeur des commandes, doublon de titre et texte
 * d'introduction corrigés à l'étape 3ter (sujets 1 à 3).
 *
 * Le thème passe par-dessus les styles du module, il ne les remplace pas :
 * les sélecteurs ci-dessous reprennent exactement les classes publiques du
 * module (assets/calendar.css et assets/form.css de aspacam-reservations),
 * à la même précision qu'elles, sans jamais dépendre de sa structure
 * interne. Si le module change un jour son balisage ou ses classes, ces
 * règles cessent simplement de s'appliquer : la page retombe sur
 * l'apparence du module seul, moins jolie, jamais cassée — rien ici ne
 * fixe une taille, une position ou un affichage dont l'absence rendrait la
 * page inutilisable.
 *
 * Neutralité de couleur, volontaire : le calendrier porte un langage de
 * couleurs qui a du sens (vert = libre, orange = en attente de validation,
 * bleu = en attente de paiement, rouge = réservé, gris barré =
 * indisponible — assets/calendar.css du module, jamais touché ici). Aucune
 * des trois couleurs de marque n'apparaît dans ce fichier, pour ne jamais
 * entrer en concurrence de sens avec cette palette. Les boutons reprennent
 * le blanc à bordure grise déjà en usage ailleurs sur le site
 * (.aspacam-button--outline), pas une couleur pleine.
 */

/*
 * Le module plafonne sa propre largeur (32rem, .aspacam-reservation,
 * form.css) mais ne se centre jamais lui-même dans la page : ni form.css ni
 * calendar.css ne posent de marge sur cette classe — mesuré, aucune des
 * deux feuilles ne contient de règle de ce genre. Sans cette ligne, le
 * module reste collé au bord gauche dès que la page dépasse ces 32rem.
 */
.aspacam-reservation {
	margin-inline: auto;
}

/*
 * Le nom de la ressource s'affiche deux fois quand une page n'en porte
 * qu'une seule (Camion, Gymnase) : le titre de la page, posé par le thème
 * (page-templates/reservation.php), puis un second titre plus petit posé
 * par le module (le <h2> qui nomme ce qu'on réserve, public/class-form.php).
 * Conséquence du dispositif, pas un défaut de l'un ou de l'autre — masqué
 * ici, côté thème, dans ce seul cas.
 *
 * Masqué par défaut, ce titre redevient visible dès que la page en porte
 * plusieurs (deuxième règle ci-dessous) : « Autre matériel » est destinée à
 * empiler plusieurs calendriers une fois d'autres ressources ouvertes
 * (SITE.md, « Module Réservations »), et ce titre est alors la seule chose
 * qui les distingue l'un de l'autre — le masquer partout rendrait cette
 * page illisible dès qu'elle porte plus d'une ressource.
 *
 * Sélecteur d'enfant direct, volontairement précis : seul ce <h2> répète le
 * titre de la page. L'écran de confirmation en porte un autre, un cran plus
 * profond (.aspacam-reservation .aspacam-form__confirmation h2, « Votre
 * demande a bien été enregistrée ») — un texte différent, la seule
 * information de cet écran, à ne surtout pas masquer avec la même règle.
 *
 * Si le module change un jour ce balisage, cette règle cesse simplement de
 * s'appliquer : le doublon revient sur les pages à une seule ressource,
 * désagréable mais lisible — jamais une page sans titre du tout, ce
 * qu'aurait produit la solution inverse (masquer le titre du thème).
 */
.aspacam-reservation > h2 {
	display: none;
}

/*
 * Condition sur le nombre de calendriers réellement présents dans la page,
 * pas sur son adresse ni sur son identité : une liste de pages ("masquer
 * sur camion et gymnase seulement") se serait figée aujourd'hui et aurait
 * demandé d'y penser le jour où une ressource s'ajoute à « Autre matériel »
 * — ici, rien à changer ce jour-là, la règle se recalcule d'elle-même sur
 * le contenu réel de la page.
 *
 * ":has()" cherche, à l'intérieur de .aspacam-content, un
 * ".aspacam-reservation" précédé d'un autre — donc au moins deux. Si oui,
 * la règle ci-dessus est annulée pour tous les titres de la page, premier
 * compris. Reproduit temporairement avec deux raccourcis sur une page
 * d'essai (voir le rapport de session) : les deux titres s'affichent bien
 * dans ce cas.
 *
 * Dégradation si ":has()" n'est pas reconnu (navigateur ancien) : cette
 * règle ne s'applique simplement pas, et l'on retombe sur la règle
 * précédente — les titres restent masqués même à plusieurs ressources,
 * moins lisible mais jamais cassé. Aucune des règles de ce fichier ne
 * dépend de ":has()" pour fonctionner, seule celle-ci en profite.
 */
.aspacam-content:has(.aspacam-reservation ~ .aspacam-reservation) .aspacam-reservation > h2 {
	display: block;
}

.aspacam-calendar__nav button,
.aspacam-calendar__nav select {
	border: 1px solid var(--aspacam-theme-color-border);
	border-radius: 8px;
	background-color: var(--aspacam-theme-color-background);
	font-family: inherit;
}

.aspacam-calendar__nav button:hover:not(:disabled),
.aspacam-calendar__nav button:focus:not(:disabled) {
	border-color: var(--aspacam-theme-color-text-muted);
}

.aspacam-form input[type='text'],
.aspacam-form input[type='email'],
.aspacam-form input[type='tel'],
.aspacam-form input[type='number'] {
	border: 1px solid var(--aspacam-theme-color-border);
	border-radius: 8px;
	font-family: inherit;
}

/*
 * Même couple blanc/bordure grise que les boutons du socle
 * (.aspacam-button--outline, base.css), pas la couleur pleine que le
 * module lui donne par défaut (un vert proche de celui du calendrier,
 * mesuré à l'écran — jamais destiné à porter un sens ici, seulement un
 * réglage par défaut du module).
 */
.aspacam-form__submit {
	border: 1px solid var(--aspacam-theme-color-border);
	border-radius: 8px;
	background-color: var(--aspacam-theme-color-background);
	color: var(--aspacam-theme-color-text);
	font-family: inherit;
}

.aspacam-form__submit:hover:not(:disabled),
.aspacam-form__submit:focus:not(:disabled) {
	border-color: var(--aspacam-theme-color-text-muted);
}

.aspacam-form__recap {
	border: 1px solid var(--aspacam-theme-color-border);
	border-radius: 8px;
	background-color: var(--aspacam-theme-color-background);
}

/*
 * Texte libre écrit dans l'éditeur avant le raccourci (sujet 3, étape
 * 3ter) : conditions d'emprunt, précautions d'usage. Sa typographie vient
 * déjà de base.css comme sur n'importe quelle page (police, taille,
 * couleur) — rien à ajouter pour ça. Ce qui manquait : une séparation
 * nette avec le calendrier, pour que la dernière ligne du texte ne se
 * confonde pas avec la première ligne du module.
 *
 * Ne s'applique que si un tel texte existe : le sélecteur exige un frère
 * précédent, donc ne change rien sur Camion et Gymnase tant que rien n'est
 * écrit au-dessus (état actuel des deux pages).
 */
.aspacam-content > :not(.aspacam-reservation) + .aspacam-reservation {
	margin-top: var(--aspacam-theme-space-lg);
	padding-top: var(--aspacam-theme-space-lg);
	border-top: 1px solid var(--aspacam-theme-color-border);
}

/*
 * Ce resserrement (espace, rembourrage, taille de police) ne dépend plus de
 * la largeur de la fenêtre — corrigé à l'étape 3ter. Il dépendait d'abord
 * d'une media query sous 560px, en pensant le problème comme un problème de
 * téléphone. Mesuré ensuite : la largeur du module ne dépasse jamais 32rem
 * (512px, .aspacam-reservation, form.css) quelle que soit la fenêtre, donc
 * il est aussi à l'étroit dans ces 512px en fenêtre large qu'en fenêtre
 * étroite. Limiter le resserrement aux petites fenêtres laissait les
 * grandes avec l'espacement large du module d'origine — cinq commandes de
 * navigation sur deux rangées de 600 à 1400px de fenêtre, alors qu'une
 * seule suffit avec ce resserrement, à ces largeurs comme à toutes les
 * autres où il tient. Rien n'est fixé en largeur ni en hauteur : un mot
 * plus long dans une future traduction repasserait simplement sur une
 * rangée de plus, sans jamais rien casser.
 *
 * Sous une largeur de module d'environ 410px (fenêtre de 320 à 440px
 * mesurée), les cinq commandes de navigation ne tiennent plus sur une
 * seule rangée même resserrées : deux menus déroulants dont les mois en
 * toutes lettres et trois boutons, tous des libellés du module. Aucun
 * moyen de descendre plus bas sans réduire la police sous le seuil de
 * confort ou tronquer un libellé, ce que le module ne permet pas de son
 * côté. Deux rangées restent alors la meilleure option : elles se
 * répartissent naturellement (3 puis 2 pour la navigation, 2 puis 3 pour
 * la légende), sans qu'il soit nécessaire de forcer la coupure.
 *
 * Vérifié à l'écran, sans débordement horizontal à aucune largeur testée
 * (320 à 1400px), y compris autour de 782px, où WordPress pose un
 * débordement masqué sur la page (lié à la barre d'admin responsive) qui
 * rendrait un contrôle débordant inatteignable, pas seulement mal cadré.
 */
.aspacam-calendar__nav {
	gap: 0.3em;
}

.aspacam-calendar__nav button,
.aspacam-calendar__nav select {
	padding: 0.3em 0.35em;
	font-size: 0.85em;
	min-height: 2.4em;
}

.aspacam-calendar__legend {
	gap: 0.25em 0.4em;
}

.aspacam-calendar__legend-item {
	padding: 0.15em 0.35em;
	font-size: 0.78em;
}