/*
 * Dunkelmodus für ahundv-tt25.
 *
 * Einheitlich sehr dunkles Blau wie auf marcweinhardt.de: Seite #121A22,
 * Kopf- und Fußzeile, Titelbild-Überlagerung und Kästen #1A2530
 * (accent-2 und accent-5). Marineblau (Buttons, Style 3) und Fellrot
 * (Kategorie-Chip, Style 4) bleiben als Flächen mit weißer Schrift.
 * Links, Fokusring und Fellrot-Linien bekommen eigene, helle Farben
 * (Variablen aus settings.custom in theme.json).
 *
 * Kontraste nach WCAG-Formel (06.10.2026), auf base / auf Kasten:
 * contrast 14,36 / 12,71:1, Meta-Text 7,24 / 6,41:1, Links 10,24 / 9,07:1,
 * Link-Hover 13,41:1, Fellrot hell 6,76 / 5,98:1. Auf Markierung: Text
 * 11,16:1, Links 7,96:1, Fellrot hell 5,25:1. Fokusring gegen Marine-Button
 * 4,87:1. Weiße Schrift auf Kopf- und Fußzeile 15,54:1, Marine 8,35:1,
 * Fellrot 8,42:1; im Titelbild über weißen Bildstellen mindestens 5,81:1.
 *
 * Aktiv, wenn das System dunkel eingestellt ist und keine eigene Wahl
 * gespeichert ist, oder wenn der Schalter auf „dunkel“ steht.
 * Nur im Frontend geladen, nicht im Editor.
 */

:root {
	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--wp--preset--color--base: #121A22;
		--wp--preset--color--accent-2: #1A2530;
		--wp--preset--color--contrast: #E4E9ED;
		--wp--preset--color--accent-4: #9CA8B3;
		--wp--preset--color--accent-5: #1A2530;
		--wp--preset--color--accent-6: #2E3D4B;
		--wp--preset--color--highlight: #3A2A26;
		--wp--preset--color--accent-light: #D98F69;
		--wp--custom--link: #A9C9EC;
		--wp--custom--link-hover: #D2E3F5;
		--wp--custom--linie: #D98F69;
	}
}

:root[data-theme="dark"] {
	color-scheme: dark;
	--wp--preset--color--base: #121A22;
	--wp--preset--color--accent-2: #1A2530;
	--wp--preset--color--contrast: #E4E9ED;
	--wp--preset--color--accent-4: #9CA8B3;
	--wp--preset--color--accent-5: #1A2530;
	--wp--preset--color--accent-6: #2E3D4B;
	--wp--preset--color--highlight: #3A2A26;
	--wp--preset--color--accent-light: #D98F69;
	--wp--custom--link: #A9C9EC;
	--wp--custom--link-hover: #D2E3F5;
	--wp--custom--linie: #D98F69;
}

/* Formularfelder folgen der Palette statt den Browser-Standardfarben. */
:where(input:not([type="submit"], [type="checkbox"], [type="radio"]), textarea, select) {
	color: var(--wp--preset--color--contrast);
	background-color: var(--wp--preset--color--base);
}

/* ------------------------------------------------------------
 * Schalter (in der Kopfzeile: weiß auf Marine dunkel)
 * ---------------------------------------------------------- */
.ahundv-dunkelmodus {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	color: currentColor;
	background: transparent;
	border: 1px solid currentColor;
	border-radius: 50%;
	cursor: pointer;
}

.ahundv-dunkelmodus[hidden] {
	display: none;
}

.ahundv-dunkelmodus:hover {
	color: var(--wp--preset--color--accent-2);
	background-color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--white);
}

.ahundv-dunkelmodus svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: currentColor;
}

/* Mond zeigt „dunkel einschalten“, Sonne „hell einschalten“. */
.ahundv-dunkelmodus[aria-pressed="true"] .ahundv-icon-mond,
.ahundv-dunkelmodus[aria-pressed="false"] .ahundv-icon-sonne {
	display: none;
}