/* RD Accessibility – Widget und Modi */

:root {
	--rd-a11y-accent: #1a56db;
	--rd-a11y-font: Verdana, Tahoma, "Trebuchet MS", Arial, sans-serif;
	--rd-a11y-ink: #14181f;
	--rd-a11y-muted: #4a5260;
	--rd-a11y-line: #d3d8e0;
	--rd-a11y-surface: rgba(255, 255, 255, .92);
	--rd-a11y-tint: #f1f4f9;
}

/* ---------- Widget ---------- */

.rd-a11y-root,
.rd-a11y-root * {
	box-sizing: border-box;
}

.rd-a11y-root {
	font: 16px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--rd-a11y-ink);
	letter-spacing: normal;
	word-spacing: normal;
	text-align: left;
}

.rd-a11y-root button,
.rd-a11y-root a {
	font: inherit;
	letter-spacing: inherit;
	text-transform: none;
	text-shadow: none;
}

/* Umschalter */
.rd-a11y-root button.rd-a11y-toggle {
	position: fixed;
	z-index: 2147483000;
	width: 56px;
	height: 56px;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 3px solid #fff;
	border-radius: 50%;
	background: var(--rd-a11y-accent);
	color: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .35);
	cursor: pointer;
	line-height: 1;
}

.rd-a11y-pos-right button.rd-a11y-toggle { right: 18px; }
.rd-a11y-pos-left button.rd-a11y-toggle { left: 18px; }
.rd-a11y-v-bottom button.rd-a11y-toggle { bottom: 18px; }
.rd-a11y-v-top button.rd-a11y-toggle { top: 18px; }
.rd-a11y-v-middle button.rd-a11y-toggle { top: 50%; transform: translateY(-50%); }

.rd-a11y-root button.rd-a11y-toggle:hover { filter: brightness(1.12); }

.rd-a11y-root button:focus-visible,
.rd-a11y-root a:focus-visible,
.rd-a11y-root .rd-a11y-title:focus-visible {
	outline: 3px solid #000;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #fff;
}

/* Sidebar */
.rd-a11y-panel {
	position: fixed;
	z-index: 2147483001;
	top: 0;
	bottom: 0;
	width: 390px;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	background: var(--rd-a11y-surface);
	box-shadow: 0 0 28px rgba(0, 0, 0, .3);
	overflow: hidden;
}

.rd-a11y-panel[hidden] { display: none !important; }
.rd-a11y-pos-right .rd-a11y-panel { right: 0; border-left: 4px solid var(--rd-a11y-accent); }
.rd-a11y-pos-left .rd-a11y-panel { left: 0; border-right: 4px solid var(--rd-a11y-accent); }

@media (prefers-reduced-motion: no-preference) {
	.rd-a11y-pos-right .rd-a11y-panel { animation: rd-a11y-in-r .22s ease-out; }
	.rd-a11y-pos-left .rd-a11y-panel { animation: rd-a11y-in-l .22s ease-out; }
}

@keyframes rd-a11y-in-r { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes rd-a11y-in-l { from { transform: translateX(-24px); opacity: 0; } to { transform: none; opacity: 1; } }

.rd-a11y-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px 8px;
}

.rd-a11y-root .rd-a11y-title {
	margin: 0;
	padding: 0;
	font-size: 22px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--rd-a11y-ink);
	border: 0;
	background: none;
}

.rd-a11y-root button.rd-a11y-close {
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	flex: none;
	border: 1px solid var(--rd-a11y-line);
	border-radius: 8px;
	background: var(--rd-a11y-ink);
	color: #ffffff;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
}

.rd-a11y-root button.rd-a11y-close:hover { background: #fff; color: var(--rd-a11y-ink); }

.rd-a11y-intro {
	margin: 0;
	padding: 0 18px 12px;
	font-size: 14px;
	color: var(--rd-a11y-muted);
	border-bottom: 1px solid var(--rd-a11y-line);
}

.rd-a11y-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 4px 18px 12px;
	overscroll-behavior: contain;
}

.rd-a11y-section { padding: 14px 0 6px; }
.rd-a11y-section + .rd-a11y-section { border-top: 1px solid var(--rd-a11y-line); }

.rd-a11y-root .rd-a11y-h3 {
	margin: 0 0 10px;
	padding: 0;
	font-size: 16px;
	line-height: 1.3;
	font-weight: 700;
	color: var(--rd-a11y-ink);
	border: 0;
	background: none;
	text-transform: none;
}

.rd-a11y-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-bottom: 10px;
}

.rd-a11y-root button.rd-a11y-btn {
	position: relative;
	min-height: 48px;
	margin: 0;
	padding: 8px 10px 8px 12px;
	display: flex;
	align-items: center;
	text-align: left;
	border: 2px solid var(--rd-a11y-line);
	border-radius: 8px;
	background: var(--rd-a11y-surface);
	color: var(--rd-a11y-ink);
	font-size: 14px;
	line-height: 1.25;
	font-weight: 500;
	cursor: pointer;
	box-shadow: none;
}

.rd-a11y-root button.rd-a11y-btn:hover { border-color: var(--rd-a11y-accent); background: var(--rd-a11y-tint); }

.rd-a11y-root button.rd-a11y-btn[aria-pressed="true"] {
	border-color: var(--rd-a11y-accent);
	background: var(--rd-a11y-accent);
	color: #fff;
	padding-right: 30px;
}

.rd-a11y-root button.rd-a11y-btn[aria-pressed="true"]::after {
	content: "";
	position: absolute;
	right: 11px;
	top: 50%;
	width: 6px;
	height: 12px;
	margin-top: -8px;
	border: solid #fff;
	border-width: 0 3px 3px 0;
	transform: rotate(45deg);
}

.rd-a11y-stepper {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	padding: 6px 8px 6px 12px;
	border: 2px solid var(--rd-a11y-line);
	border-radius: 8px;
}

.rd-a11y-step-label { flex: 1 1 auto; font-size: 14px; font-weight: 500; }

.rd-a11y-step-val {
	min-width: 64px;
	text-align: center;
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	color: var(--rd-a11y-muted);
}

.rd-a11y-root button.rd-a11y-step-btn {
	width: 40px;
	height: 40px;
	flex: none;
	padding: 0;
	margin: 0;
	border: 2px solid var(--rd-a11y-accent);
	border-radius: 8px;
	background: var(--rd-a11y-surface);
	color: var(--rd-a11y-accent);
	font-size: 22px;
	line-height: 1;
	font-weight: 700;
	cursor: pointer;
}

.rd-a11y-root button.rd-a11y-step-btn:hover:not(:disabled) { background: var(--rd-a11y-accent); color: #fff; }
.rd-a11y-root button.rd-a11y-step-btn:disabled { opacity: .4; cursor: not-allowed; }

.rd-a11y-hint { margin: 0 0 8px; font-size: 13px; color: var(--rd-a11y-muted); }

.rd-a11y-foot {
	padding: 12px 18px 14px;
	border-top: 1px solid var(--rd-a11y-line);
	background: var(--rd-a11y-tint);
}

.rd-a11y-root button.rd-a11y-reset {
	width: 100%;
	min-height: 46px;
	margin: 0 0 8px;
	padding: 8px 12px;
	border: 2px solid var(--rd-a11y-ink);
	border-radius: 8px;
	background: var(--rd-a11y-ink);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.rd-a11y-root button.rd-a11y-reset:hover { background: #fff; color: var(--rd-a11y-ink); }

.rd-a11y-root a.rd-a11y-statement {
	display: inline-block;
	margin: 0 0 6px;
	color: var(--rd-a11y-accent);
	font-size: 14px;
	text-decoration: underline;
}

.rd-a11y-footer {
	flex: none;
	padding: 12px 18px 16px;
	border-top: 1px solid var(--rd-a11y-line);
	background: var(--rd-a11y-surface);
	font-size: 13px;
	line-height: 1.5;
	color: var(--rd-a11y-muted);
}

.rd-a11y-footer > :first-child { margin-top: 0; }
.rd-a11y-footer > :last-child { margin-bottom: 0; }
.rd-a11y-footer p { margin: 0 0 8px; font-size: inherit; color: inherit; }
.rd-a11y-footer a { color: var(--rd-a11y-accent); text-decoration: underline; }

.rd-a11y-live {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Skip-Link */
a.rd-a11y-skip {
	position: fixed;
	z-index: 2147483002;
	top: -80px;
	left: 12px;
	padding: 12px 18px;
	background: #000;
	color: #fff;
	font: 600 16px/1.2 -apple-system, "Segoe UI", Arial, sans-serif;
	text-decoration: underline;
	border-radius: 0 0 8px 8px;
}

a.rd-a11y-skip:focus { top: 0; outline: 3px solid #ff0; }

/* Lesehilfen */
.rd-a11y-guide {
	position: fixed;
	z-index: 2147482990;
	left: 0;
	width: 100%;
	height: 5px;
	background: var(--rd-a11y-accent);
	box-shadow: 0 0 0 2px #fff;
	pointer-events: none;
}

.rd-a11y-mask {
	position: fixed;
	z-index: 2147482990;
	left: 0;
	width: 100%;
	background: rgba(0, 0, 0, .72);
	pointer-events: none;
}

.rd-a11y-mask-top { top: 0; }
.rd-a11y-mask-bottom { bottom: 0; }
.rd-a11y-guide[hidden], .rd-a11y-mask[hidden] { display: none !important; }

@media (max-width: 782px) {
	.rd-a11y-root.rd-a11y-nomobile { display: none !important; }
	.rd-a11y-panel { width: 100%; border-width: 0 !important; }
	.rd-a11y-grid { grid-template-columns: 1fr; }
}

@media print {
	.rd-a11y-root, a.rd-a11y-skip { display: none !important; }
}

/* ---------- Seiten-Modi (nie auf das Widget selbst) ---------- */

/* Zeilen-, Buchstaben- und Wortabstand */
html.rd-a11y-lh-1 { --rd-lh: 1.5; }
html.rd-a11y-lh-2 { --rd-lh: 1.7; }
html.rd-a11y-lh-3 { --rd-lh: 1.9; }
html.rd-a11y-lh-4 { --rd-lh: 2.2; }
html.rd-a11y-ls-1 { --rd-ls: .04em; }
html.rd-a11y-ls-2 { --rd-ls: .08em; }
html.rd-a11y-ls-3 { --rd-ls: .12em; }
html.rd-a11y-ls-4 { --rd-ls: .16em; }
html.rd-a11y-ws-1 { --rd-ws: .08em; }
html.rd-a11y-ws-2 { --rd-ws: .16em; }
html.rd-a11y-ws-3 { --rd-ws: .24em; }
html.rd-a11y-ws-4 { --rd-ws: .32em; }

html[class*="rd-a11y-lh-"] body :not(.rd-a11y-root):not(.rd-a11y-root *) { line-height: var(--rd-lh) !important; }
html[class*="rd-a11y-ls-"] body :not(.rd-a11y-root):not(.rd-a11y-root *) { letter-spacing: var(--rd-ls) !important; }
html[class*="rd-a11y-ws-"] body :not(.rd-a11y-root):not(.rd-a11y-root *) { word-spacing: var(--rd-ws) !important; }

html.rd-a11y-align body :not(.rd-a11y-root):not(.rd-a11y-root *) { text-align: left !important; }

/* Gut lesbare Schrift (Icon-Fonts bleiben unberührt) */
html.rd-a11y-font body :not(.rd-a11y-root):not(.rd-a11y-root *):not(i):not(.dashicons):not([class*="icon"]):not([class*="fa-"]):not([class^="fa"]):not([class*="et-pb-icon"]):not([class*="et_pb_icon"]) {
	font-family: var(--rd-a11y-font) !important;
}

/* Kontrastmodi */
html.rd-a11y-contrast-high { --rd-bg: #000; --rd-fg: #fff; --rd-link: #ffe600; --rd-border: #fff; }
html.rd-a11y-contrast-dark { --rd-bg: #15171c; --rd-fg: #e9ecf1; --rd-link: #8db4ff; --rd-border: #4a5160; }
html.rd-a11y-contrast-light { --rd-bg: #fff; --rd-fg: #000; --rd-link: #0000d6; --rd-border: #000; }

html[class*="rd-a11y-contrast-"],
html[class*="rd-a11y-contrast-"] body {
	background: var(--rd-bg) !important;
	color: var(--rd-fg) !important;
}

html[class*="rd-a11y-contrast-"] body :not(.rd-a11y-root):not(.rd-a11y-root *) {
	background-color: var(--rd-bg) !important;
	background-image: none !important;
	color: var(--rd-fg) !important;
	border-color: var(--rd-border) !important;
	text-shadow: none !important;
	box-shadow: none !important;
}

html[class*="rd-a11y-contrast-"] body a:not(.rd-a11y-root *),
html[class*="rd-a11y-contrast-"] body a:not(.rd-a11y-root *) * {
	color: var(--rd-link) !important;
	text-decoration: underline !important;
}

html[class*="rd-a11y-contrast-"] body :is(svg, path, circle, rect):not(.rd-a11y-root *) { fill: currentColor; }

/* Farbfilter */
html.rd-a11y-filter-invert { filter: invert(1) hue-rotate(180deg); }
html.rd-a11y-filter-invert img,
html.rd-a11y-filter-invert video,
html.rd-a11y-filter-invert .rd-a11y-panel,
html.rd-a11y-filter-invert .rd-a11y-toggle { filter: invert(1) hue-rotate(180deg); }
html.rd-a11y-filter-gray { filter: grayscale(1); }
html.rd-a11y-filter-low { filter: saturate(.45); }
html.rd-a11y-filter-high { filter: saturate(2); }

/* Links und Überschriften */
html.rd-a11y-links body a:not(.rd-a11y-root *) {
	text-decoration: underline !important;
	text-decoration-thickness: 2px !important;
	text-underline-offset: 3px !important;
	background: #fff200 !important;
	color: #000 !important;
	outline: 2px solid #000 !important;
	outline-offset: 1px !important;
}

html.rd-a11y-headings body :is(h1, h2, h3, h4, h5, h6, [role="heading"]):not(.rd-a11y-root *) {
	outline: 3px solid var(--rd-a11y-accent) !important;
	outline-offset: 4px !important;
	background: rgba(26, 86, 219, .1) !important;
}

/* Großer Mauszeiger */
html.rd-a11y-cursor,
html.rd-a11y-cursor body :not(.rd-a11y-root):not(.rd-a11y-root *) {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24'%3E%3Cpath d='M5 2l14 10-6 1.5L16 21l-3 1.2-3-7.5L5 19z' fill='%23000' stroke='%23fff' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2, auto !important;
}

/* Fokus hervorheben */
html.rd-a11y-focus body :focus {
	outline: 4px solid #ff0 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 7px #000 !important;
}

/* Animationen stoppen */
html.rd-a11y-motion *,
html.rd-a11y-motion *::before,
html.rd-a11y-motion *::after {
	animation: none !important;
	animation-delay: 0s !important;
	transition: none !important;
	scroll-behavior: auto !important;
}

/* Bilder ausblenden */
html.rd-a11y-images body :is(img, picture, video, canvas):not(.rd-a11y-root *) { visibility: hidden !important; }
html.rd-a11y-images body :not(.rd-a11y-root):not(.rd-a11y-root *) { background-image: none !important; }
