/**
 * Styles du bloc "avosz/registration-form", repris à l'identique de
 * l'ancien style.scss (bloc compilé), simplement aplati en CSS pur : aucune
 * étape de build n'est plus nécessaire (voir core/block.php).
 */
.avosz-registration-form__notice {
	margin: 0 0 1.5em;
	padding: 1em 1.25em;
	border-radius: 4px;
	border: 1px solid transparent;
}

.avosz-registration-form__notice p,
.avosz-registration-form__notice li {
	margin: 0;
}

.avosz-registration-form__notice ul {
	margin: 0;
	padding-left: 1.2em;
}

.avosz-registration-form__notice--success {
	background: #edfaef;
	border-color: #46b450;
	color: #1e5631;
}

.avosz-registration-form__notice--error {
	background: #fbeaea;
	border-color: #d63638;
	color: #7a1315;
}

/* Mode nuit des encarts de retour (succès/erreur) : les couleurs
   ci-dessus sont pensées pour un fond clair (voir captures d'écran ayant
   motivé ce correctif - un encart "mode jour" posé tel quel sur le fond
   quasi-noir du mode nuit). Pas de teinte sémantique success/error dans
   la palette du thème (voir avosz-theme/theme.json : seulement
   background/foreground/primary/secondary/contrast), donc des valeurs
   dédiées plutôt que des variables --wp--preset--color--*. */
html[data-theme="dark"] .avosz-registration-form__notice--success {
	background: #16321f;
	border-color: #2f7d3c;
	color: #8fd19e;
}

html[data-theme="dark"] .avosz-registration-form__notice--error {
	background: #3a1416;
	border-color: #b23a3c;
	color: #ff9b9b;
}

.avosz-registration-form__form {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	max-width: 640px;
}

.avosz-registration-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.4em;
}

.avosz-registration-form__field label:not(.avosz-registration-form__radio),
.avosz-registration-form__field legend {
	font-weight: 600;
}

.avosz-registration-form__field input[type="text"],
.avosz-registration-form__field input[type="tel"],
.avosz-registration-form__field input[type="email"],
.avosz-registration-form__field input[type="date"],
.avosz-registration-form__field input[type="number"],
.avosz-registration-form__field textarea {
	width: 100%;
	max-width: 100%;
	padding: 0.6em 0.75em;
	border: 1px solid #949494;
	border-radius: 4px;
	font-size: 1em;
	box-sizing: border-box;
}

.avosz-registration-form__field input[type="text"]:focus,
.avosz-registration-form__field input[type="tel"]:focus,
.avosz-registration-form__field input[type="email"]:focus,
.avosz-registration-form__field input[type="date"]:focus,
.avosz-registration-form__field input[type="number"]:focus,
.avosz-registration-form__field textarea:focus {
	outline: 2px solid #007cba;
	outline-offset: -1px;
}

.avosz-registration-form__field textarea {
	resize: vertical;
}

/* Sans cette règle, l'attribut HTML `hidden` posé sur les fieldsets de durée
   (voir render-form.php et registration-form.js) serait sans effet : une
   règle d'auteur qui fixe `display` prend toujours le dessus sur le
   comportement par défaut du navigateur pour `[hidden]` (display: none),
   quelle que soit la spécificité. On restaure donc explicitement ce
   comportement ici. */
.avosz-registration-form__field[hidden] {
	display: none;
}

.avosz-registration-form__required {
	color: #d63638;
}

.avosz-registration-form__uppercase {
	text-transform: uppercase;
}

/* Ce sont des <div> (et non des <p>) dans render-form.php, précisément
   pour éviter tout conflit avec des styles génériques de thème qui
   ciblent les paragraphes (ex. ".entry-content p { margin-bottom: 1.5em }") :
   un <div> n'a pas de marge par défaut et n'est quasiment jamais ciblé par
   ce type de règle. Un simple "margin: 0" suffit donc ici, sans avoir
   besoin de renforcer la spécificité ni de !important. */
.avosz-registration-form__duree-fixe {
	margin: 0;
	font-size: 1.05em;
	font-weight: 600;
}

.avosz-registration-form__hint {
	margin: 0;
	font-size: 0.85em;
	color: #666;
}

fieldset.avosz-registration-form__field {
	border: none;
	padding: 0;
	margin: 0;
}

fieldset.avosz-registration-form__field legend {
	padding: 0;
	margin-bottom: 0.4em;
}

.avosz-registration-form__radio {
	display: flex;
	align-items: center;
	gap: 0.5em;
	font-weight: 400;
}

/* Honeypot anti-bot : masqué visuellement mais toujours présent dans le
   flux du document (pas de display:none ni de visibility:hidden), qui sont
   des signaux que certains bots savent détecter pour ignorer le champ.
   Positionné hors de l'écran à la place. */
.avosz-registration-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.avosz-registration-form__submit button {
	align-self: flex-start;
	padding: 0.7em 1.6em;
	border: none;
	border-radius: 4px;
	/* Mêmes couleurs que les autres boutons du site (voir
	   avosz-theme/patterns/login-button.php et
	   avosz-theme/patterns/hero.php : backgroundColor "primary" +
	   textColor "background"). Ce sont des variables CSS, donc leur
	   bascule en mode nuit (voir html[data-theme="dark"] dans
	   avosz-theme/style.css) s'applique automatiquement ici aussi, sans
	   règle supplémentaire à écrire dans ce fichier. */
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	font-size: 1em;
	cursor: pointer;
}

.avosz-registration-form__submit button:hover {
	opacity: 0.85;
}

/* Flatpickr affiche par défaut les jours du mois précédent/suivant
   (classes .prevMonthDay / .nextMonthDay, ex. le 1er du mois suivant en fin
   de grille) avec la même couleur grisée et le même curseur que les jours
   réellement désactivés (.flatpickr-disabled), alors qu'ils restent bien
   sélectionnables. On ne corrige donc que les jours adjacents qui ne sont
   PAS aussi désactivés par nos propres règles (minDate, disable) : ceux-là
   gardent volontairement leur apparence grisée. */
.flatpickr-day.nextMonthDay:not(.flatpickr-disabled):not(.notAllowed),
.flatpickr-day.prevMonthDay:not(.flatpickr-disabled):not(.notAllowed) {
	color: #393939;
	cursor: pointer;
}

.flatpickr-day.nextMonthDay:not(.flatpickr-disabled):not(.notAllowed):hover,
.flatpickr-day.nextMonthDay:not(.flatpickr-disabled):not(.notAllowed):focus,
.flatpickr-day.prevMonthDay:not(.flatpickr-disabled):not(.notAllowed):hover,
.flatpickr-day.prevMonthDay:not(.flatpickr-disabled):not(.notAllowed):focus {
	background: #e6e6e6;
	border-color: #e6e6e6;
}

/* Mode nuit pour le calendrier/sélecteur d'heure Flatpickr.
   Sélecteurs volontairement globaux, PAS nichés sous
   .wp-block-avosz-registration-form : par défaut, Flatpickr ajoute sa
   popup (calendrier ou panneau d'heure) directement en enfant de <body>,
   en dehors du bloc (voir registration-form.js, aucune option "appendTo"
   ne change ce comportement). Un sélecteur nichable sous le bloc ne la
   matcherait jamais - même piège que celui déjà rencontré avec
   .avosz-no-decoration sur ce projet. */
html[data-theme="dark"] .flatpickr-calendar {
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
	box-shadow:
		1px 0 0 var(--avosz-table-border-color),
		-1px 0 0 var(--avosz-table-border-color),
		0 1px 0 var(--avosz-table-border-color),
		0 -1px 0 var(--avosz-table-border-color),
		0 3px 13px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .flatpickr-calendar.arrowTop:before {
	border-bottom-color: var(--avosz-table-border-color);
}

html[data-theme="dark"] .flatpickr-calendar.arrowTop:after {
	border-bottom-color: var(--wp--preset--color--background);
}

html[data-theme="dark"] .flatpickr-calendar.arrowBottom:before {
	border-top-color: var(--avosz-table-border-color);
}

html[data-theme="dark"] .flatpickr-calendar.arrowBottom:after {
	border-top-color: var(--wp--preset--color--background);
}

/* En-tête mois/année : .flatpickr-month porte la couleur ET le fill des
   icônes flèches précédent/suivant (dont les <svg> utilisent fill: inherit
   côté flatpickr.css) ; la plupart des éléments enfants (cur-month,
   cur-year, le <select> du mois) utilisent déjà color: inherit et
   suivent donc automatiquement, sans réglage supplémentaire. */
html[data-theme="dark"] .flatpickr-months .flatpickr-month,
html[data-theme="dark"] .flatpickr-months .flatpickr-prev-month svg,
html[data-theme="dark"] .flatpickr-months .flatpickr-next-month svg {
	color: var(--wp--preset--color--foreground);
	fill: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .flatpickr-current-month span.cur-month:hover,
html[data-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months:hover,
html[data-theme="dark"] .flatpickr-months .flatpickr-prev-month:hover,
html[data-theme="dark"] .flatpickr-months .flatpickr-next-month:hover {
	background: var(--wp--preset--color--secondary);
}

html[data-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
	background-color: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
}

/* Jours de la semaine (lun, mar...) */
html[data-theme="dark"] span.flatpickr-weekday {
	color: var(--wp--preset--color--foreground);
	opacity: 0.7;
}

/* Jours du mois */
html[data-theme="dark"] .flatpickr-day {
	color: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .flatpickr-day:hover,
html[data-theme="dark"] .flatpickr-day:focus,
html[data-theme="dark"] .flatpickr-day.prevMonthDay:hover,
html[data-theme="dark"] .flatpickr-day.nextMonthDay:hover {
	background: var(--wp--preset--color--secondary);
	border-color: var(--wp--preset--color--secondary);
}

html[data-theme="dark"] .flatpickr-day.today {
	border-color: var(--wp--preset--color--primary);
}

html[data-theme="dark"] .flatpickr-day.today:hover,
html[data-theme="dark"] .flatpickr-day.today:focus {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
}

/* Jour sélectionné : même paire fond/texte que les boutons du thème
   (background primary + texte background, cf. theme.json styles.button),
   pour rester lisible aussi bien en mode jour qu'en mode nuit. */
html[data-theme="dark"] .flatpickr-day.selected,
html[data-theme="dark"] .flatpickr-day.selected:hover,
html[data-theme="dark"] .flatpickr-day.selected:focus {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
}

/* Jours désactivés (dates indisponibles, jeudis, jours d'un autre mois) :
   on garde la même couleur de base, juste estompée par opacité plutôt que
   par une valeur de gris fixe qui ne s'adapterait pas au mode nuit. */
html[data-theme="dark"] .flatpickr-day.flatpickr-disabled,
html[data-theme="dark"] .flatpickr-day.flatpickr-disabled:hover,
html[data-theme="dark"] .flatpickr-day.prevMonthDay,
html[data-theme="dark"] .flatpickr-day.nextMonthDay,
html[data-theme="dark"] .flatpickr-day.notAllowed {
	color: var(--wp--preset--color--foreground);
	opacity: 0.3;
}

html[data-theme="dark"] .flatpickr-day.flatpickr-disabled,
html[data-theme="dark"] .flatpickr-day.flatpickr-disabled:hover {
	opacity: 0.15;
}

/* Panneau "Heure du premier rendez-vous" (mode noCalendar : seuls les
   champs heure/minute et leurs flèches sont visibles). */
html[data-theme="dark"] .flatpickr-time input,
html[data-theme="dark"] .flatpickr-time .flatpickr-time-separator,
html[data-theme="dark"] .flatpickr-time .flatpickr-am-pm {
	color: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .flatpickr-time input:hover,
html[data-theme="dark"] .flatpickr-time .flatpickr-am-pm:hover,
html[data-theme="dark"] .flatpickr-time input:focus,
html[data-theme="dark"] .flatpickr-time .flatpickr-am-pm:focus {
	background: var(--wp--preset--color--secondary);
}

/* Flèches +/- des champs numériques (année du calendrier, heure/minute) :
   simples triangles CSS (bordures), pas des <svg>. */
html[data-theme="dark"] .numInputWrapper span.arrowUp:after {
	border-bottom-color: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .numInputWrapper span.arrowDown:after {
	border-top-color: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .numInputWrapper span svg path {
	fill: var(--wp--preset--color--foreground);
}

html[data-theme="dark"] .numInputWrapper span:hover,
html[data-theme="dark"] .numInputWrapper:hover {
	background: var(--wp--preset--color--secondary);
}

/* Masque les flèches natives d'incrémentation/décrémentation du champ
   "Nombre de packs de 4 cours" (<input type="number">, voir templates/render-form.php) :
   sous Safari, ces flèches provoquent un décalage visuel disgracieux au clic
   (une icône de contact/Autofill vient aussi se superposer dessus). Firefox
   et Chrome affichent ces flèches proprement, mais les masquer partout reste
   la façon la plus fiable d'obtenir un rendu identique sur les trois
   navigateurs - la valeur reste modifiable au clavier (flèches haut/bas,
   molette de la souris) exactement comme avant. Même correctif appliqué côté
   écrans d'administration, voir admin/profile_fields_admin.php et
   modules/esignature/admin/contract_conditions_admin.php. */
.avosz-hide-number-spinner::-webkit-outer-spin-button,
.avosz-hide-number-spinner::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.avosz-hide-number-spinner {
	-moz-appearance: textfield;
}