/* ============================================================================
   sprache.css — der Schalter im Fuß und die Maske gegen den Sprachblitz.
   Gehört zu sprache.js, wird auf allen sechs Seiten geladen.
   ========================================================================== */

/* Steht Deutsch im Speicher, setzt das Snippet im Kopf der Seite dieses
   Attribut. Der Body bleibt unsichtbar, bis sprache.js getauscht hat —
   sonst steht für einen Wimpernschlag Englisch da und springt dann um.
   Das Snippet nimmt die Maske notfalls selbst wieder ab, damit eine nicht
   geladene Datei nicht die ganze Seite verschluckt. */
html[data-spr-warten] body{visibility:hidden}

.sprachwahl{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--body,inherit);
}
.sprachwahl button{
  appearance:none;background:none;border:0;padding:2px 1px;
  font:inherit;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dim,rgba(238,243,246,.38));
  cursor:pointer;
  transition:color .3s var(--ease,ease);
}
.sprachwahl button:hover{color:var(--ink,#EEF3F6)}
.sprachwahl button.an{
  color:var(--accent,#8FBEDA);
  /* Die laufende Sprache ist markiert, nicht nur heller: ein Farbunterschied
     allein trägt die Aussage nicht, wenn jemand Farben schlecht trennt. */
  border-bottom:1px solid currentColor;
}
.sprachwahl-trenner{
  width:1px;height:11px;
  background:var(--line,rgba(238,243,246,.13));
}

/* Auf den schmalen Fußzeilen rutscht der Schalter unter die Rechtslinks,
   statt sie zu drängeln. */
@media(max-width:900px){
  .sprachwahl{margin-top:2px}
}