/*
 * La Galga Gris · lang-switcher.css
 * Refinamiento del dropdown del header + banner de sugerencia.
 * El switcher base vive en header.css; aquí amplíamos con item activo + ordenado.
 */

/* Item activo dentro del dropdown del header */
.lgg-header__lang-list li[aria-current="true"] a,
.lgg-header__lang-list a.is-current {
	background: var(--color-accent-soft);
	color: var(--color-accent-hover);
	font-weight: var(--fw-semibold);
}

.lgg-header__lang-list li {
	margin: 0;
}

/* Bandera/punto previo a cada idioma */
.lgg-header__lang-list a::before {
	content: "";
	display: inline-block;
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--color-ink-muted);
	margin-right: var(--sp-2);
	vertical-align: 1px;
}
.lgg-header__lang-list a.is-current::before { background: var(--color-accent); }

/* ── Banner sugerencia idioma ───────────────────────────────────── */
.lgg-lang-suggest {
	position: fixed;
	left: var(--sp-4);
	right: var(--sp-4);
	bottom: calc(var(--sp-4) + 80px); /* sobre la cookie banner */
	z-index: calc(var(--z-toast) - 1);
	max-width: 560px;
	margin-inline: auto;
	background: var(--color-ink-primary);
	color: var(--color-ink-inverse);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg);
	transform: translateY(120%);
	opacity: 0;
	transition: transform var(--dur-slow) var(--ease-emphasized),
				opacity var(--dur-base) var(--ease-standard);
}
.lgg-lang-suggest[data-show="true"] {
	transform: translateY(0);
	opacity: 1;
}
@media (prefers-reduced-motion: reduce) { .lgg-lang-suggest { transition: none; } }

.lgg-lang-suggest__inner {
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	padding: var(--sp-3) var(--sp-4);
	flex-wrap: wrap;
}
.lgg-lang-suggest__icon { color: var(--color-accent); flex: 0 0 auto; }
.lgg-lang-suggest__msg {
	font-size: var(--fz-small);
	flex: 1 1 auto;
	min-width: 12ch;
	color: color-mix(in srgb, var(--color-ink-inverse) 88%, transparent);
}
.lgg-lang-suggest .lgg-link-cta {
	color: var(--color-ink-inverse);
	border-color: var(--color-ink-inverse);
	font-size: var(--fz-small);
	white-space: nowrap;
}
.lgg-lang-suggest .lgg-link-cta:hover { color: var(--color-accent); border-color: var(--color-accent); }

.lgg-lang-suggest__close {
	width: 28px; height: 28px;
	border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent;
	color: color-mix(in srgb, var(--color-ink-inverse) 70%, transparent);
	border: 1px solid color-mix(in srgb, var(--color-ink-inverse) 25%, transparent);
	cursor: pointer;
	flex: 0 0 auto;
}
.lgg-lang-suggest__close:hover { color: var(--color-ink-inverse); border-color: var(--color-ink-inverse); }