/*
 * Maison Joaya — Address autocomplete dropdown styles.
 *
 * Enqueued sur checkout + myaccount uniquement. Utilise les tokens du design
 * système (assets/css/tokens.css). Pas d'override visuel des champs WC, juste
 * la dropdown de suggestions ancrée sous le champ.
 *
 * BEM-like — prefix `.mj-address-autocomplete-*`.
 *
 * @version 1.0.0
 */

.mj-address-autocomplete-wrapper {
	position: relative;
	display: block;
	width: 100%;
}

.mj-address-autocomplete-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
	background: var(--mj-bg-elevated, #ffffff);
	border: 1px solid var(--mj-border-default, #c2bcb0);
	border-radius: var(--mj-radius-md, 0.5rem);
	box-shadow: var(--mj-shadow-md, 0 4px 12px rgba(25, 19, 14, 0.08));
	max-height: 280px;
	overflow-y: auto;
	z-index: var(--mj-z-overlay, 1000);
	font-family: var(--mj-font-sans, "Manrope", system-ui, sans-serif);
}

.mj-address-autocomplete-dropdown[hidden] {
	display: none;
}

.mj-address-autocomplete-item {
	display: block;
	padding: 0.75rem 1rem;
	color: var(--mj-text-primary, #15130e);
	font-size: var(--mj-text-sm, 0.875rem);
	line-height: var(--mj-lh-snug, 1.35);
	cursor: pointer;
	border-bottom: 1px solid var(--mj-border-subtle, #e0dcd2);
	transition: background-color var(--mj-duration-fast, 160ms) var(--mj-ease-standard, ease);
	user-select: none;
}

.mj-address-autocomplete-item:last-child {
	border-bottom: none;
}

.mj-address-autocomplete-item:hover,
.mj-address-autocomplete-item.is-active,
.mj-address-autocomplete-item[aria-selected="true"] {
	background-color: var(--joaya-sage-50, #f4f6f2);
	color: var(--mj-accent-primary, #3d4f38);
}

.mj-address-autocomplete-item:focus {
	outline: 2px solid var(--mj-focus-ring, #3d4f38);
	outline-offset: -2px;
}

/* Live region pour annonce screen-reader, invisible visuellement. */
.mj-address-autocomplete-live {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Mobile : dropdown moins haute pour ne pas masquer le clavier virtuel. */
@media (max-width: 768px) {
	.mj-address-autocomplete-dropdown {
		max-height: 200px;
		font-size: var(--mj-text-base, 1rem);
	}

	.mj-address-autocomplete-item {
		padding: 0.875rem 1rem;
	}
}

/* Respecte les préférences utilisateur de motion réduite. */
@media (prefers-reduced-motion: reduce) {
	.mj-address-autocomplete-item {
		transition: none;
	}
}