/* ============================================================================
   Barrierefreiheit (WCAG 2.1 Stufe AA / EN 301 549)
   ----------------------------------------------------------------------------
   - Sprunglink, Screenreader-Texte, sichtbarer Tastaturfokus
   - Kontraste (Farben, die im Original zu hell waren)
   - Slider- und Lauftext-Schaltflächen, Formularfelder
   - Werkzeugleiste "Barrierefreiheit" (barrierefreiheit.js) und ihre Darstellungsarten
   ============================================================================ */


/* ----- Nur für Screenreader sichtbar ----- */

.bf-sr {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}


/* ----- Überschriften, die vorher nur formatierte Absätze waren: Aussehen unverändert ----- */

h2.bf-h2 {
	margin: 0;
	padding: 0;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
h2.nh1_head { margin-top: 0; }
h3.bf-h3 {
	margin: 22px 0 6px 0;
	font-size: 18px;
	line-height: 22px;
	font-weight: 700;
	color: #4c4c4c;
}
ul.bf-liste {
	margin: 4px 0 8px 0;
	padding-left: 22px;
}
ul.bf-liste li {
	font-size: 15px;
	line-height: 20px;
	color: #4c4c4c;
	margin-bottom: 4px;
}


/* ----- Sprunglink "Zum Inhalt springen" (erscheint beim ersten Tab) ----- */

.bf-skiplink {
	position: absolute;
	left: 10px;
	top: -100px;
	z-index: 10001;
	padding: 12px 18px;
	background: #1a1a1a;
	color: #fff !important;
	font: bold 16px/1.2 'Ubuntu Webfont', Arial, sans-serif;
	text-decoration: underline;
}
.bf-skiplink:focus { top: 10px; }


/* ----- Sichtbarer Tastaturfokus -----
   Das Original schaltet alle Umrandungen ab (* { outline-style: none }). Zweifarbiger Ring:
   schwarz innen, weiß außen - auf hellem und dunklem Hintergrund gleich gut zu sehen. */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid #1a1a1a !important;
	outline-offset: 0;
	box-shadow: 0 0 0 6px #fff !important;
}
/* Ältere Browser ohne :focus-visible */
@supports not selector(:focus-visible) {
	a:focus, button:focus, input:focus, select:focus, textarea:focus, [tabindex]:focus {
		outline: 3px solid #1a1a1a !important;
		box-shadow: 0 0 0 6px #fff !important;
	}
}
/* Formularfelder: Rahmen mit ausreichendem Kontrast (WCAG 1.4.11) */
.mdl_form input[type="text"]:focus-visible,
.mdl_form select:focus-visible,
.mdl_form textarea:focus-visible { box-shadow: 0 0 0 5px #fff, 0 0 0 7px #1a1a1a !important; }
/* Sprungziel des Sprunglinks */
#inhalt:focus,
#lightbox:focus,
#bf-leiste-titel:focus { outline: none !important; box-shadow: none !important; }


/* ----- Kontraste ----- */

/* Fußband (Kontaktblock): Weiß auf dem hellen Blau erreichte nur 3:1 - dunkleres Blau (4,6:1).
   Am PC ist das Band Teil des Hintergrundbilds (172 px blau, darunter dunkel). */
.bsc_bgr-footer-left,
.bsc_bgr-footer-center,
.bsc_bgr-footer-right {
	background: linear-gradient(to bottom, #007bbd 0, #007bbd 172px, #1a1a1a 172px, #1a1a1a 100%) 0 0 / 100% 100% no-repeat !important;
}

/* Kontaktblock im Fuß: Zeilen untereinander stehender Links mindestens 24 px hoch (WCAG 2.5.8) */
.plg_contact .row02,
.plg_contact .row03 { line-height: 24px !important; }
.plg_contact > .row03 > a { display: inline-block; line-height: 24px !important; }	/* responsive.css setzt inline */

/* Brotkrumen auf schmalen Bildschirmen: umbrechende Zeilen mindestens 24 px hoch */
@media screen and (max-width: 979px) {
	.bsc_box1_pos6 .nhy_lh { line-height: 26px; }
}

/* Fußzeile PC: Platz für den zusätzlichen Link "Barrierefreiheit" in einer Zeile */
@media screen and (min-width: 980px) {
	.bsc_box6_size2 { width: 390px; }
}

/* Formularfelder: sichtbarer Rahmen (vorher hellgrau auf weiß ohne Rahmen) */
.mdl_form input[type="text"],
.mdl_form input[type="password"],
.mdl_form select,
.mdl_form textarea {
	border: 1px solid #767676;
}
.mdl_form_error input[type="text"],
.mdl_form_error select,
.mdl_form_error textarea { border-color: #c80000; }

/* Pflichtfeld-Hinweis bei Fehlern: zusätzlich zur Farbe ein Text (WCAG 1.4.1) */
.bf-feldfehler {
	display: block;
	color: #c80000;
	font-size: 14px;
	font-weight: bold;
	padding: 4px 0 0 5px;
}

/* Text im Slider: kräftigerer Schatten für den Kontrast zum Steinhintergrund */
.nh2_text-headline1,
.nh2_text-description {
	text-shadow: 0 0 3px #000, 0 0 6px #000, 1px 1px 5px #000 !important;
}


/* ----- Slider: Schaltflächen ----- */

/* Pause / Abspielen (WCAG 2.2.2): unten rechts an der Anordnung aus Text und Kreisbild
   (Folien-Koordinaten wie in responsive.css: --rsp-w = Breite der Anordnung, Mitte bei x = 960) */
.bf-pause {
	position: absolute;
	z-index: 20;
	right: calc(960px - var(--rsp-w, 920px) / 2);
	bottom: 12px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 32px;
	padding: 4px 12px;
	border: 2px solid #fff;
	border-radius: 16px;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	font: bold 14px/1 'Ubuntu Webfont', Arial, sans-serif;
	cursor: pointer;
}
.bf-pause:hover { background: #000; }
.bf-pause svg { width: 12px; height: 12px; fill: #fff; }
/* Handy: Ausschnitt der Folie beginnt bei x = 485 - oben rechts, nur Symbol */
@media screen and (max-width: 699px) {
	.bf-pause {
		right: calc(1920px - 485px - 100vw + 12px);
		top: 10px;
		bottom: auto;
		width: 36px;
		min-height: 36px;
		padding: 0;
		justify-content: center;
		border-radius: 50%;
	}
	.bf-pause .bf-pause-text { display: none; }
}

/* Lauftext oben: Pause-Schaltfläche */
.bf-ticker-pause {
	position: absolute;
	z-index: 20;
	right: -30px;					/* PC: rechts neben dem Lauftext (dort ist noch Platz bis zum Rand) */
	top: 8px;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid #fff;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.6);
	cursor: pointer;
}
.bf-ticker-pause svg { display: block; width: 10px; height: 10px; margin: 0 auto; fill: #fff; }
.bsc_box1_size4 { position: relative; }
@media screen and (max-width: 979px) {
	.bf-ticker-pause { right: 12px; }
	.bsc_box1_size4 .mdl_ticker_box { margin-right: 30px; }
}
.bf-ticker-angehalten .hui_scroller_inner { animation-play-state: paused !important; }
.mdl_ticker_box:focus-within .hui_scroller_inner { animation-play-state: paused; }

/* Wer im System "Bewegung reduzieren" eingestellt hat: Lauftext steht still */
@media (prefers-reduced-motion: reduce) {
	.hui_scroller_inner { animation-play-state: paused !important; }
	* { scroll-behavior: auto !important; }
}


/* ----- Werkzeugleiste "Barrierefreiheit" ----- */

.bf-knopf {
	position: fixed;
	z-index: 10000;
	right: 16px;
	bottom: 16px;
	width: 56px;
	height: 56px;
	padding: 0;
	border: 3px solid #fff;
	border-radius: 50%;
	background: #007bbd;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
	cursor: pointer;
}
.bf-knopf:hover { background: #005f92; }
@media screen and (max-width: 699px) {
	.bf-knopf { width: 48px; height: 48px; right: 10px; bottom: 10px; }
	.bf-knopf svg { width: 28px; height: 28px; }
	.bf-leiste { right: 10px; bottom: 68px; max-width: calc(100vw - 20px); }
}
.bf-knopf svg { display: block; width: 34px; height: 34px; margin: 0 auto; fill: #fff; }

.bf-leiste {
	position: fixed;
	z-index: 10000;
	right: 16px;
	bottom: 84px;
	width: 340px;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 110px);
	overflow-y: auto;
	box-sizing: border-box;
	padding: 18px 18px 14px 18px;
	background: #fff;
	color: #1a1a1a;
	border: 2px solid #1a1a1a;
	border-radius: 8px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
	font: 16px/1.4 'Ubuntu Webfont', Arial, sans-serif;
	text-align: left;
}
.bf-leiste[hidden] { display: none; }
.bf-leiste h2 {
	margin: 0 0 4px 0;
	font-size: 20px;
	line-height: 1.2;
	color: #1a1a1a;
}
.bf-leiste p { margin: 0 0 12px 0; font-size: 14px; color: #4c4c4c; }
.bf-leiste .bf-zeile {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 0;
	border-top: 1px solid #d0d0d0;
}
.bf-leiste .bf-zeile span { font-weight: bold; }
.bf-leiste button {
	min-height: 40px;
	min-width: 44px;
	padding: 6px 12px;
	border: 2px solid #1a1a1a;
	border-radius: 6px;
	background: #fff;
	color: #1a1a1a;
	font: bold 15px/1.2 'Ubuntu Webfont', Arial, sans-serif;
	cursor: pointer;
}
.bf-leiste button:hover { background: #e8e8e8; }
.bf-leiste button[aria-pressed="true"] { background: #1a1a1a; color: #fff; }
.bf-leiste .bf-stufen { display: flex; gap: 6px; }
.bf-leiste .bf-fuss {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding-top: 12px;
	border-top: 1px solid #d0d0d0;
}
.bf-leiste .bf-fuss a { color: #005f92; font-weight: bold; text-decoration: underline; }
.bf-leiste .bf-schliessen {
	position: absolute;
	right: 8px;
	top: 8px;
	min-width: 40px;
	padding: 0;
	font-size: 22px;
	line-height: 1;
}
@media print { .bf-knopf, .bf-leiste, .bf-pause, .bf-ticker-pause, .bf-skiplink { display: none !important; } }


/* ----- Darstellungsarten der Werkzeugleiste (Klassen am <html>) ----- */

/* Links hervorheben */
html.bf-links a:not(.bf-skiplink):not(.nh2_box_linkbutton):not(.button01):not(.nct_box) {
	text-decoration: underline !important;
	text-decoration-thickness: 2px !important;
	text-underline-offset: 3px;
}
html.bf-links a:not(.bf-skiplink) { outline: 2px dashed currentColor; outline-offset: 2px; }

/* Lesbare Schrift: schlichte Schrift, größere Abstände (WCAG 1.4.12) */
html.bf-lesbar body,
html.bf-lesbar body *:not(svg):not(path) {
	font-family: Verdana, Arial, Helvetica, sans-serif !important;
	letter-spacing: 0.03em !important;
	word-spacing: 0.1em !important;
}
html.bf-lesbar .bsc_maincontent p,
html.bf-lesbar .bsc_maincontent li,
html.bf-lesbar .bsc_maincontent td { line-height: 1.6 !important; }

/* Hoher Kontrast: schwarz auf weiß, Hintergrundbilder im Text aus */
html.bf-kontrast .bsc_contentbox2,
html.bf-kontrast .bsc_contentbox3,
html.bf-kontrast .bsc_contentbox4 { background-color: #fff !important; }
html.bf-kontrast .bsc_maincontent * { color: #000 !important; }
html.bf-kontrast .bsc_maincontent a { color: #00007a !important; text-decoration: underline !important; }
html.bf-kontrast .bsc_contentbox5 *,
html.bf-kontrast .bsc_contentbox6 * { color: #fff !important; }
html.bf-kontrast .bsc_contentbox6 > .bsc_box6_pos1 { background-color: #000 !important; }
html.bf-kontrast .bsc_container2,
html.bf-kontrast .bsc_footer { background: #000 !important; }
html.bf-kontrast [class*="bsc_bgr2-"],
html.bf-kontrast [class*="bsc_bgr-footer-"] { display: none !important; }
html.bf-kontrast .bsc_contentbox6 a { text-decoration: underline !important; }
html.bf-kontrast .bsc_box1_pos2 .nm1_normal,
html.bf-kontrast .bsc_box1_pos2 .nm1_aktiv { color: #000 !important; text-decoration: underline; }
html.bf-kontrast .nh2_text-headline1,
html.bf-kontrast .nh2_text-description { background: rgba(0, 0, 0, 0.85); background-clip: content-box; }	/* nur hinter dem Text, nicht im Abstand */

/* Grosse Schrift: lange Woerter duerfen umbrechen statt ueber den Rand zu ragen */
html.bf-gross .bsc_maincontent { overflow-wrap: break-word; word-wrap: break-word; }
html.bf-kontrast .mdl_form input[type="text"],
html.bf-kontrast .mdl_form select,
html.bf-kontrast .mdl_form textarea { border: 2px solid #000 !important; }
html.bf-kontrast .bf-feldfehler,
html.bf-kontrast .mdl_form_error .form_label { color: #b00000 !important; }

/* Animationen stoppen */
html.bf-ruhig *,
html.bf-ruhig *::before,
html.bf-ruhig *::after {
	animation-play-state: paused !important;
	transition: none !important;
}
