/*
 * Barrierefreiheit – Korrekturen gemäß Prüfbericht 046-26-W-gmmoen (19.02.2026)
 * Angebot AG2649. Wird nach main.min.css geladen und überschreibt dessen Regeln.
 */

/* ------------------------------------------------------------------
 * Hilfsklasse: nur für Screenreader sichtbar
 * ------------------------------------------------------------------ */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ------------------------------------------------------------------
 * 4.3 Kontrast (Minimum)
 * Weiße Schrift auf Grau/Grün/Magenta lag unter 4,5:1. Die Markenfarbe
 * bleibt als Unterstrich erhalten, Flächen hinter weißer Schrift werden
 * abgedunkelt.
 *   Grau    #9c9d9f -> #6b6c6e (5,3:1), Hover #555658 (7,4:1)
 *   Grün    #1fa22f -> #137a20 (5,5:1), Hover #0e6619 (7,2:1)
 *   Magenta #e52f87 -> #bf196a (5,9:1), Hover #a3155a (7,5:1)
 * ------------------------------------------------------------------ */

/* Desktop-Hauptnavigation: Hover/Fokus-Fläche des Hauptpunkts + Untermenü */
.header .nav .mainnavi ul li.color-grey:hover a,
.header .nav .mainnavi ul li.color-grey:focus-within a,
.header .nav .mainnavi ul li.color-grey ul.sub-menu { background: #6b6c6e; color: #fff; }
.header .nav .mainnavi ul li.color-grey ul.sub-menu li a:hover,
.header .nav .mainnavi ul li.color-grey ul.sub-menu li a:focus { background: #555658; }

.header .nav .mainnavi ul li.color-green:hover a,
.header .nav .mainnavi ul li.color-green:focus-within a,
.header .nav .mainnavi ul li.color-green ul.sub-menu { background: #137a20; color: #fff; }
.header .nav .mainnavi ul li.color-green ul.sub-menu li a:hover,
.header .nav .mainnavi ul li.color-green ul.sub-menu li a:focus { background: #0e6619; }

.header .nav .mainnavi ul li.color-magenta:hover a,
.header .nav .mainnavi ul li.color-magenta:focus-within a,
.header .nav .mainnavi ul li.color-magenta ul.sub-menu { background: #bf196a; color: #fff; }
.header .nav .mainnavi ul li.color-magenta ul.sub-menu li a:hover,
.header .nav .mainnavi ul li.color-magenta ul.sub-menu li a:focus { background: #a3155a; }

/* Übrige Farben: gleiches Verhalten bei Tastaturfokus wie bei Hover */
.header .nav .mainnavi ul li.color-orange:focus-within a  { background: #f7a515; }
.header .nav .mainnavi ul li.color-yellow:focus-within a  { background: #ffdc00; }
.header .nav .mainnavi ul li.color-red:focus-within a     { background: #e2001b; color: #fff; }
.header .nav .mainnavi ul li.color-blue:focus-within a    { background: #005fa8; color: #fff; }
.header .nav .mainnavi ul li.color-orange ul.sub-menu li a:focus  { background: #de8d00; }
.header .nav .mainnavi ul li.color-yellow ul.sub-menu li a:focus  { background: #ebca09; }
.header .nav .mainnavi ul li.color-red ul.sub-menu li a:focus     { background: #bc0016; }
.header .nav .mainnavi ul li.color-blue ul.sub-menu li a:focus    { background: #004d87; }

/* Mobile Navigation */
.nav-mobile-menuarea ul li.color-grey    { background: #6b6c6e; }
.nav-mobile-menuarea ul li.color-green   { background: #137a20; }
.nav-mobile-menuarea ul li.color-magenta { background: #bf196a; }

/* Metanavigation (Suche, Kontakt, Virtuelles Rathaus): #848484 -> #666 (5,7:1) */
.header .nav .metanavi ul li a,
.header .nav .metanavi ul li .a11y-linkbutton { color: #666; }
.header .nav .metanavi ul li a:hover,
.header .nav .metanavi ul li .a11y-linkbutton:hover { color: #333; }

/* Sektionsfarben für Links/Überschriften auf weißem bzw. hellgrauem Grund */
.color-orange a, .color-orange h1 { color: #9a5700; }   /* vorher #de8d00, 2,7:1 */
.color-yellow a, .color-yellow h1 { color: #6e5c00; }   /* vorher #ebca09, 1,6:1 */
.color-green a,  .color-green h1  { color: #0e6619; }   /* vorher #11891f, 4,5:1 (grenzwertig) */
.color-grey a,   .color-grey h1,
.color-service a, .color-service h1 { color: #666; }    /* vorher #848484, 3,7:1 */
.color-orange a:hover, .color-yellow a:hover, .color-green a:hover,
.color-grey a:hover, .color-service a:hover { color: #333; }

.bcolor-orange a:hover  { color: #9a5700; }
.bcolor-yellow a:hover  { color: #6e5c00; }
.bcolor-green a:hover   { color: #0e6619; }
.bcolor-grey a:hover,
.bcolor-service a:hover { color: #666; }

/* Navigation im Header behält ihre eigenen Textfarben */
.header .nav .mainnavi ul li a { color: #333; }
.header .nav .mainnavi ul li.color-red:hover a,
.header .nav .mainnavi ul li.color-magenta:hover a,
.header .nav .mainnavi ul li.color-blue:hover a,
.header .nav .mainnavi ul li.color-green:hover a,
.header .nav .mainnavi ul li.color-grey:hover a,
.header .nav .mainnavi ul li.color-red:focus-within a,
.header .nav .mainnavi ul li.color-magenta:focus-within a,
.header .nav .mainnavi ul li.color-blue:focus-within a,
.header .nav .mainnavi ul li.color-green:focus-within a,
.header .nav .mainnavi ul li.color-grey:focus-within a,
.header .nav .mainnavi ul li.color-red ul.sub-menu li a,
.header .nav .mainnavi ul li.color-magenta ul.sub-menu li a,
.header .nav .mainnavi ul li.color-blue ul.sub-menu li a,
.header .nav .mainnavi ul li.color-green ul.sub-menu li a,
.header .nav .mainnavi ul li.color-grey ul.sub-menu li a { color: #fff; }

/* ------------------------------------------------------------------
 * 4.5 / 4.8 Untermenüs der Desktop-Navigation
 * Geschlossene Untermenüs waren nur per max-height:0 versteckt und
 * blieben fokussierbar. visibility:hidden entfernt sie aus der
 * Tab-Reihenfolge. Geöffnet wird per Hover oder Tastaturfokus,
 * geschlossen zusätzlich per Escape (Klasse .a11y-dismissed, s. a11y.js).
 * ------------------------------------------------------------------ */
.header .nav .mainnavi ul li ul.sub-menu {
	visibility: hidden;
}
.header .nav .mainnavi ul li:hover > ul.sub-menu,
.header .nav .mainnavi ul li:focus-within > ul.sub-menu {
	max-height: 9000px;
	visibility: visible;
}
.header .nav .mainnavi ul li.a11y-dismissed > ul.sub-menu {
	max-height: 0;
	visibility: hidden;
}
/* "transition: all" aus main.min.css würde visibility verzögern; dann wären
   Untermenüpunkte kurz nach dem Öffnen noch nicht per Tab erreichbar. */
.header .nav .mainnavi ul li a {
	-webkit-transition: background-color 0.1s ease-in, color 0.1s ease-in;
	transition: background-color 0.1s ease-in, color 0.1s ease-in;
}

/* ------------------------------------------------------------------
 * 4.6 / 4.8 Mobile Navigation und Suche
 * Ausgeblendete Bereiche (außerhalb des Viewports) sind nicht mehr
 * fokussierbar. Die Auslöser sind jetzt echte <button>-Elemente.
 * ------------------------------------------------------------------ */
.nav-mobile-menuarea { visibility: hidden; }
.nav-mobile-menuarea.active { visibility: visible; }

.searcharea { visibility: hidden; }
.searcharea.active { visibility: visible; }

/* Buttons optisch wie die bisherigen Links darstellen */
.a11y-linkbutton,
.nav-mobile .imgbox button,
button.xbutton {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	text-align: inherit;
	cursor: pointer;
}

.header .nav .metanavi ul li .a11y-linkbutton {
	display: inline-block;
	line-height: 45px;
	font-size: 1em;
}

.nav-mobile .imgbox button {
	display: block;
	height: 60px;
	color: #333;
	text-align: center;
}
.nav-mobile .right .imgbox button { text-align: right; }

button.xbutton { line-height: 1; }

/* Sichtbarer Tastaturfokus für die neuen/geänderten Bedienelemente */
.a11y-linkbutton:focus-visible,
.nav-mobile .imgbox button:focus-visible,
.nav-mobile .imgbox a:focus-visible,
button.xbutton:focus-visible,
.nav-mobile-menuarea a:focus-visible,
.header .nav .mainnavi ul li a:focus-visible,
.header .nav .metanavi ul li a:focus-visible {
	outline: 3px solid #333;
	outline-offset: 2px;
}
button.xbutton:focus-visible { outline-color: #fff; }
.header .nav .mainnavi ul li ul.sub-menu li a:focus-visible {
	outline: 3px solid #fff;
	outline-offset: -5px;
}

/* ------------------------------------------------------------------
 * 4.2 Footer-Linkliste
 * Optisch wie zuvor (Absatz mit Zeilenumbrüchen), semantisch eine Liste.
 * ------------------------------------------------------------------ */
.footer .footer-linklist {
	list-style: none;
	margin: 1em 0 10px 0; /* wie .footer-container p */
	padding: 0;
	text-align: inherit;
}
.footer .footer-linklist li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* ------------------------------------------------------------------
 * 4.9 Formatangabe an Downloadlinks
 * ------------------------------------------------------------------ */
.button-download .download-filetype,
.button-all:hover .download-filetype {
	font-size: inherit;
	position: static;
}

/* ------------------------------------------------------------------
 * 4.11 Beschriftungen von Formularfeldern
 * ------------------------------------------------------------------ */
.searcharea h1 label,
.suchblock h1 label {
	cursor: pointer;
	font: inherit;
	color: inherit;
}

.page-kontakt .element > label,
.page-kontakt .element .a11y-label {
	display: block;
	margin: 0 0 4px 0;
	text-align: left;
	font-weight: bold;
}