/**
 * Le formulaire d'inscription, en pied de page.
 *
 * Pleine largeur, sur une ligne quand la place le permet : prénom, nom, adresse, bouton. Les
 * cases passent en dessous — elles sont cinq, et les mettre sur la même ligne rendrait chaque
 * colonne illisible.
 */

.evg-nl {
	width: 100%;
	max-width: 100%;
	margin: 0;
}

.evg-nl-titre {
	margin: 0 0 .2em;
	font-size: 1.25em;
	font-weight: 700;
	line-height: 1.2;
}

.evg-nl-intro {
	margin: 0 0 1.1em;
	font-size: .95em;
	opacity: .8;
}

/* --- La ligne de saisie --- */

/* Une seule hauteur pour les champs, la langue et le bouton : ils sont alignés par le bas
   sur la même ligne, et un bouton plus bas que les champs se voyait (relevé le 16/10/2026). */
.evg-nl { --evg-nl-h: 2.9rem; }

.evg-nl-ligne {
	display: flex;
	flex-wrap: wrap;
	gap: .7rem;
	align-items: flex-end;
	width: 100%;
}

.evg-nl-champ {
	display: flex;
	flex: 1 1 11rem;
	flex-direction: column;
	gap: .28em;
	min-width: 0;   /* sans quoi un champ flexible refuse de rétrécir */
}

.evg-nl-champ--large { flex: 2 1 16rem; }
.evg-nl-champ--langue { flex: 0 1 9.5rem; }

.evg-nl-label {
	font-size: .74em;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	opacity: .75;
}

.evg-nl input[type="text"],
.evg-nl input[type="email"],
.evg-nl .evg-nl-select {
	box-sizing: border-box;
	width: 100%;
	height: var(--evg-nl-h);
	padding: 0 .8em;
	font: inherit;
	font-size: .95em;
	color: inherit;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 0;
}

/* La liste de langue. Le thème cache toutes les listes natives (visibility: hidden, avec
   !important) pour les remplacer par les siennes : on rend la nôtre visible, et on lui donne
   la flèche et le fond des champs voisins. */
.evg-nl .evg-nl-select {
	visibility: visible !important;
	padding-right: 2.2em;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23ffffff' stroke-width='1.6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .85em center;
	background-size: 12px 8px;
}
.evg-nl .evg-nl-select option { color: #111; background: #fff; }

.evg-nl input[type="text"]:focus,
.evg-nl input[type="email"]:focus,
.evg-nl .evg-nl-select:focus {
	background-color: rgba(255, 255, 255, .14);
	border-color: #866D4B;
	outline: none;
}

/* --- Le bouton, dans le doré du festival --- */

.evg-nl-bouton {
	flex: 0 0 auto;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: var(--evg-nl-h);
	padding: 0 1.9em;
	font: inherit;
	font-size: .78em;
	font-weight: 500;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #FCFCFC;
	cursor: pointer;
	background: #866D4B;
	border: 1px solid #866D4B;
	border-radius: 0;
	transition: background-color .3s ease, color .3s ease;
}

.evg-nl-bouton:hover:not(:disabled),
.evg-nl-bouton:focus-visible:not(:disabled) {
	color: #866D4B;
	background: transparent;
}

.evg-nl-bouton:disabled { cursor: default; opacity: .6; }

/* --- Les cases --- */

.evg-nl-listes {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem 1.4rem;
	align-items: center;
	margin: 1rem 0 0;
	padding: 0;
	border: 0;
}

.evg-nl-listes legend {
	float: left;          /* une légende ne participe pas au flux flexible ; on la sort */
	width: 100%;
	margin-bottom: .5em;
	padding: 0;
}

.evg-nl-case {
	display: inline-flex;
	gap: .45em;
	align-items: center;
	font-size: .92em;
	cursor: pointer;
}

.evg-nl-case input { accent-color: #866D4B; }

/* --- Mentions et réponse --- */

.evg-nl-rgpd {
	margin: .9rem 0 0;
	font-size: .78em;
	line-height: 1.45;
	opacity: .62;
}

.evg-nl-message {
	min-height: 1.3em;
	margin: .6rem 0 0;
	font-size: .9em;
	font-weight: 600;
}

.evg-nl-message--ok     { color: #7FB08C; }
.evg-nl-message--erreur { color: #E08363; }

/* Le pot de miel : hors écran plutôt que `display:none`, que certains robots repèrent. */
.evg-nl-pot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 640px) {
	.evg-nl-ligne { gap: .6rem; }
	.evg-nl-champ,
	.evg-nl-champ--large { flex: 1 1 100%; }
	.evg-nl-bouton { width: 100%; }
}

/* Les hauteurs, imposées : le thème fixe celle des listes et le remplissage des boutons avec
   !important (mesuré le 16/10/2026 : champs 49 px, langue 44 px, bouton 57 px). Portée limitée
   à ce formulaire. */
.evg-nl .evg-nl-ligne input[type="text"],
.evg-nl .evg-nl-ligne input[type="email"],
.evg-nl .evg-nl-ligne .evg-nl-select,
.evg-nl .evg-nl-ligne .evg-nl-bouton {
	height: 48px !important;
	min-height: 48px !important;
	max-height: 48px !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	line-height: normal !important;
}
.evg-nl .evg-nl-ligne input[type="text"],
.evg-nl .evg-nl-ligne input[type="email"],
.evg-nl .evg-nl-ligne .evg-nl-select { padding-top: 0 !important; padding-bottom: 0 !important; font-size: 15px !important; }
.evg-nl .evg-nl-ligne .evg-nl-select { padding-left: .8em !important; padding-right: 2.2em !important; }
.evg-nl .evg-nl-ligne .evg-nl-bouton { padding: 0 1.9em !important; }

/* Le pied de page centre son texte : un libellé de case sur plusieurs lignes se retrouvait
   centré, loin de sa case (mobile). Il reste collé à elle, aligné à gauche. */
/* La case est centrée sur la PREMIÈRE ligne du texte : ligne de 1.5em, case de 16 px, donc un
   retrait de (1.5em - 16px) / 2. Le thème remet les marges des champs à zéro avec !important. */
.evg-nl-case { text-align: left; align-items: flex-start; }
.evg-nl-case span { line-height: 1.5; }
.evg-nl .evg-nl-listes .evg-nl-case input[type="checkbox"] {
	flex: none;
	width: 16px !important;
	height: 16px !important;
	font-size: inherit !important;
	margin: calc((1.5em - 16px) / 2) 0 0 !important;
}

/* La flèche de la liste de langue est celle du thème : il enveloppe chaque liste dans un
   .select_container et dessine la flèche en ::after, collée au bord droit (right: 0). On la
   rentre de 14 px (demande d'Olivier, 16/10/2026). */
.evg-nl .select_container::after { right: 14px !important; }
.evg-nl .select_container::before { right: 16px !important; }

/* Bordure dorée de 1 px, imposée (le thème la remet à 0) et présente en permanence : au
   survol, le fond devient transparent et le contour garde la forme du bouton (16/10/2026). */
.evg-nl .evg-nl-ligne .evg-nl-bouton { border: 1px solid #866D4B !important; }