/*
 * Sélecteur d'adresse : recherche avec suggestions du registre fédéral, puis champs remplis.
 *
 * C'est le seul endroit du site où le visiteur tape autre chose que ses coordonnées, et tout le
 * reste en dépend : le trajet, donc les créneaux, donc le prix. Le champ de recherche est donc
 * le plus grand du formulaire. Les champs détaillés servent à se corriger, repliés dans le tunnel.
 *
 * La liste des suggestions sert aussi la vérification de zone de l'accueil et de la page Zone
 * (template-parts/zone-verif.php), d'où ses sélecteurs sur [data-adresse].
 */

.adresse { display: grid; gap: 22px; }

.adresse__recherche { display: grid; gap: 7px; }

.adresse__recherche label {
	font-size: 15px;
	color: var(--text);
}

.adresse__aide { font-size: 13.5px; line-height: 1.55; color: var(--text-3); }

.adresse__combo { position: relative; }

/* Ce qui retient la liste fermée : saisie trop vague, rien trouvé. Plus clair que l'aide. */
.adresse__statut { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--text-2); }

.adresse__combo input { min-height: 56px; font-size: 16px; }

[data-adresse] [role='listbox'] {
	position: absolute;
	z-index: 30;
	left: 0;
	right: 0;
	top: calc(100% + 6px);
	max-height: 320px;
	margin: 0;
	padding: 6px;
	overflow-y: auto;
	list-style: none;
	background: var(--surface);
	border: 1px solid var(--line-strong);
	border-radius: var(--r-md);
	box-shadow: 0 18px 40px rgba(2, 6, 12, 0.6);
}

[data-adresse] [role='option'] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-height: var(--tap);
	justify-content: center;
	padding: 9px 12px;
	border-radius: var(--r-sm);
	font-size: 15.5px;
	color: var(--text);
	cursor: pointer;
}

[data-adresse] [role='option']:hover,
[data-adresse] [role='option'][aria-selected='true'] {
	background: var(--surface-on);
}

.adresse__lieu { font-size: 13.5px; color: var(--text-3); }

/*
 * Vérification de zone : la liste passe au-dessus de ce qui suit le formulaire, même pendant son
 * apparition au défilement, qui en fait un contexte d'empilement.
 */
[data-apercu] { position: relative; z-index: 2; }

.adresse__champs { display: grid; gap: 14px; }
.adresse__champs[hidden] { display: none; }

.adresse__manuel { margin: -8px 0 0; font-size: 14.5px; }
.adresse__manuel[hidden] { display: none; }
.adresse__manuel button { background: none; border-top: 0; border-inline: 0; font: inherit; cursor: pointer; }

.adresse__champs legend {
	padding: 0;
	margin-bottom: 4px;
	font-size: 13.5px;
	color: var(--text-3);
}

.adresse__ligne {
	display: grid;
	grid-template-columns: 1fr 6rem;
	gap: 12px;
}

.adresse__ligne--npa { grid-template-columns: 7rem 1fr; }

.adresse__ligne p { display: grid; gap: 6px; margin: 0; }

/* Distance, frais et verdict renvoyés par le serveur. */
.adresse__resultat {
	padding: 18px 20px;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.adresse__resultat dl {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 10px 18px;
	margin: 0;
	font-size: 15px;
}

.adresse__resultat dt { color: var(--text-2); }

.adresse__resultat dd {
	margin: 0;
	text-align: right;
	color: var(--text);
	font-variant-numeric: tabular-nums;
}

.adresse__mesures {
	margin: 0;
	font-size: 12.5px;
	color: var(--text-3);
	font-variant-numeric: tabular-nums;
}

@media (max-width: 460px) {
	.adresse__ligne,
	.adresse__ligne--npa { grid-template-columns: 1fr; }
}
