/* =========================================================================
   VertrauenHilfe — Sprachumschaltung
   ====================================================================== */

/* --------------------------------------------------------- Umschalter */
.vh-sprache{position:relative;display:inline-flex}

.vh-sprache__knopf{
	display:inline-flex;align-items:center;gap:.4rem;
	background:transparent;border:1px solid rgba(255,255,255,.28);
	color:inherit;font:inherit;font-size:.82rem;font-weight:600;
	padding:.28rem .55rem;border-radius:3px;cursor:pointer;
	line-height:1.2;transition:background .15s,border-color .15s;
}
.vh-sprache__knopf:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.5)}
.vh-sprache__knopf:focus-visible{outline:2px solid #fff;outline-offset:2px}
.vh-sprache__globus{flex:none;opacity:.85}
.vh-sprache__pfeil{flex:none;opacity:.75;transition:transform .18s}
.vh-sprache.is-offen .vh-sprache__pfeil{transform:rotate(180deg)}
.vh-sprache__aktuell{letter-spacing:.03em}

.vh-sprache__liste{
	position:absolute;top:calc(100% + .5rem);right:0;z-index:200;
	min-width:210px;margin:0;padding:.3rem;list-style:none;
	background:#fff;border:1px solid var(--vh-line,#d3d9e4);
	border-radius:4px;box-shadow:0 14px 34px rgba(10,31,63,.18);
	max-width:none;
}
.vh-sprache__liste::before{
	content:"";position:absolute;top:-5px;right:14px;width:9px;height:9px;
	background:#fff;border-left:1px solid var(--vh-line,#d3d9e4);
	border-top:1px solid var(--vh-line,#d3d9e4);transform:rotate(45deg);
}
.vh-sprache__liste li{margin:0}

.vh-sprache__eintrag{
	display:flex;align-items:center;gap:.6rem;width:100%;
	background:none;border:0;cursor:pointer;font:inherit;
	padding:.5rem .6rem;border-radius:3px;text-align:left;
	color:var(--vh-ink,#22314c);font-size:.9rem;
}
.vh-sprache__eintrag:hover{background:var(--vh-mist,#eef1f6)}
.vh-sprache__eintrag:focus-visible{outline:2px solid var(--vh-steel,#4f7bae);outline-offset:-2px}
.vh-sprache__eintrag.is-aktiv{background:var(--vh-mist,#eef1f6);font-weight:600}
.vh-sprache__eintrag.is-aktiv .vh-sprache__kurz{background:var(--vh-navy,#16305c);color:#fff;border-color:var(--vh-navy,#16305c)}

.vh-sprache__kurz{
	flex:none;display:inline-flex;align-items:center;justify-content:center;
	min-width:30px;padding:.15rem .3rem;font-size:.7rem;font-weight:700;
	letter-spacing:.04em;color:var(--vh-navy,#16305c);
	border:1px solid var(--vh-line,#d3d9e4);border-radius:2px;background:#fff;
}
.vh-sprache__name{flex:1}
.vh-sprache__original{
	flex:none;font-size:.68rem;color:#7a869c;text-transform:uppercase;
	letter-spacing:.06em;
}

/* ----------------------------------------------------- Hinweisband */
.vh-sprache-hinweis{
	background:#fdf6e3;border-top:1px solid #e8d9ac;
	padding:.7rem 0;font-size:.86rem;color:#6b5416;
}
.vh-sprache-hinweis p{margin:0;max-width:none;display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;line-height:1.5}
.vh-sprache-hinweis strong{color:#5a4310}
.vh-sprache__zurueck{
	background:none;border:0;padding:0;font:inherit;font-weight:600;
	color:#8a5a00;text-decoration:underline;text-underline-offset:2px;cursor:pointer;
}
.vh-sprache__zurueck:hover{color:#5a4310}

/* ---------------------------------------------------------- Mobil */
@media (max-width:640px){
	/* Die Namen bleiben lesbar — nur der Zusatz „Original" weicht. */
	.vh-sprache__liste{min-width:190px}
	.vh-sprache__original{display:none}
	.vh-sprache__knopf{padding:.3rem .5rem}
	.vh-sprache-hinweis{font-size:.82rem}
	.vh-sprache-hinweis p{align-items:flex-start}
}
