/**
 * Qlick&Care — Sélecteur de langue du header.
 * Cf. inc/lang-switcher.php ([qac_lang_switcher]) et assets/qac-lang.js.
 * Utilise les tokens Bricks (couleurs/rayon/ombre) avec repli en dur.
 */

.qac-lang {
	position: relative;
	display: inline-flex;
	flex: 0 0 auto;
	font-family: inherit;
	line-height: 1;
}

/* ── Bouton : icône planète + code langue + chevron ─────────────────── */
.qac-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 9px 13px;
	border: 1px solid var(--bricks-color-border, #cccccc);
	border-radius: var(--radius-pill, 9999px);
	background: var(--bricks-color-white, #ffffff);
	color: var(--bricks-color-secondary, #1e1c3a);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .2s ease, background-color .2s ease,
		box-shadow .2s ease, color .2s ease;
}

.qac-lang__toggle:hover {
	border-color: var(--bricks-color-secondary, #1e1c3a);
	background: var(--bricks-color-light, #f0f1f3);
}

.qac-lang__toggle:focus-visible {
	outline: none;
	border-color: var(--bricks-color-primary, #9e0000);
	box-shadow: 0 0 0 3px rgba(158, 0, 0, .18);
}

.qac-lang.is-open .qac-lang__toggle {
	border-color: var(--bricks-color-secondary, #1e1c3a);
	background: var(--bricks-color-light, #f0f1f3);
}

.qac-lang__globe {
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
}

.qac-lang__code {
	font-variant-numeric: tabular-nums;
	letter-spacing: .02em;
}

.qac-lang__chev {
	display: block;
	flex: 0 0 auto;
	opacity: .65;
	transition: transform .25s cubic-bezier(.16, 1, .3, 1);
}

.qac-lang.is-open .qac-lang__chev {
	transform: rotate(180deg);
}

/* ── Menu déroulant ─────────────────────────────────────────────────── */
.qac-lang__menu {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 1000;
	min-width: 210px;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: var(--bricks-color-surface, #fdfdfd);
	border: 1px solid var(--bricks-color-border, #e6e6ea);
	border-radius: var(--radius-lg, 16px);
	box-shadow: var(--shadow-modal, 0 24px 48px -12px rgba(16, 12, 40, .28));
	/* Animation d'apparition (propriétés compositeur uniquement). */
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transform-origin: top right;
	pointer-events: none;
	transition: opacity .2s ease,
		transform .22s cubic-bezier(.16, 1, .3, 1),
		visibility 0s linear .22s;
}

.qac-lang.is-open .qac-lang__menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
	transition: opacity .2s ease, transform .22s cubic-bezier(.16, 1, .3, 1);
}

/* Petit ergot pointant vers le bouton. */
.qac-lang__menu::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 20px;
	width: 12px;
	height: 12px;
	background: var(--bricks-color-surface, #fdfdfd);
	border-left: 1px solid var(--bricks-color-border, #e6e6ea);
	border-top: 1px solid var(--bricks-color-border, #e6e6ea);
	transform: rotate(45deg);
}

.qac-lang__menu li {
	margin: 0;
}

.qac-lang__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 10px 12px;
	border-radius: var(--radius-md, 12px);
	color: var(--bricks-color-secondary, #1e1c3a);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}

a.qac-lang__item:hover,
a.qac-lang__item:focus-visible {
	outline: none;
	background: var(--bricks-color-light, #f0f1f3);
	color: var(--bricks-color-primary, #9e0000);
}

.qac-lang__item.is-current {
	background: rgba(158, 0, 0, .06);
	color: var(--bricks-color-primary, #9e0000);
	font-weight: 700;
}

.qac-lang__check {
	font-size: 14px;
	line-height: 1;
}

.qac-lang__item.is-soon {
	color: var(--bricks-color-muted, #8a8a97);
	cursor: default;
}

.qac-lang__soon {
	padding: 3px 9px;
	border-radius: var(--radius-pill, 9999px);
	background: var(--bricks-color-light, #f0f1f3);
	color: var(--bricks-color-muted, #8a8a97);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
}

/* ── Responsive ─────────────────────────────────────────────────────── */
/* Bascule menu mobile du header Bricks (≤ 1279px). */
@media (max-width: 1279px) {
	.qac-lang__toggle {
		padding: 9px 11px;
	}
}

/* Écrans étroits : planète seule, chevron masqué, menu calé à droite. */
@media (max-width: 520px) {
	.qac-lang__code,
	.qac-lang__chev {
		display: none;
	}
	.qac-lang__toggle {
		gap: 0;
		padding: 9px;
	}
	.qac-lang__menu {
		min-width: 200px;
	}
}

/* Très petits écrans : jamais de débordement horizontal. */
@media (max-width: 360px) {
	.qac-lang__menu {
		min-width: 0;
		width: max-content;
		max-width: calc(100vw - 24px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.qac-lang__toggle,
	.qac-lang__chev,
	.qac-lang__menu,
	.qac-lang__item {
		transition: none !important;
	}
	.qac-lang.is-open .qac-lang__menu {
		transform: none;
	}
}
