/**
 * Bright Mode — Light-Werte für die AO-Globalfarben (Bright Mode Phase 3).
 * Dark ist Standard (Werte im Elementor-Kit, post-7.css auf .elementor-kit-7).
 * Dieses Blatt überschreibt NUR die Variablen unter html[data-theme="light"].
 *
 * BEWUSST NICHT überschrieben: --e-global-color-aomtx (Text auf Medien) —
 * Sektionen mit Video-/Bild-Hintergrund bleiben in beiden Modi dunkel,
 * ihr Text bleibt weiß.
 */

html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }

html[data-theme="light"] .elementor-kit-7 {
	--e-global-color-aofl0: #FFFFFF;
	--e-global-color-aofl1: #F4F5F7;
	--e-global-color-aofl2: #E9EBEF;
	--e-global-color-aofl3: #FBFCFD;
	--e-global-color-aotx1: #14171B;
	--e-global-color-aotx2: #3A4048;
	--e-global-color-aotx3: #5A6169;
	--e-global-color-aoak1: #007DA0;
	--e-global-color-aoak2: #1279B0;
	--e-global-color-aoak3: #0074BA;
	--e-global-color-aoak3t: #0074BA00;
	--e-global-color-aoln1: rgba(12, 16, 20, 0.18);
	--e-global-color-aoln2: rgba(12, 16, 20, 0.08);
}

/* Der Seitengrund hinter transparenten Sektionen */
html[data-theme="light"] body { background-color: #FFFFFF; }

/* ---- Startseite (Betreiber-Entscheid 13.08.): Der Startscreen/Hero ist von
   der Modus-Option AUSGENOMMEN und bleibt in beiden Modi original dunkel.
   Einzige Ausnahme auf der Startseite: die Testimonials-Sektion (sobald
   eingebunden) wird im Hellmodus als helle Bahn ausgespielt — siehe Block
   ".ao-testimonials" unten, der modulweit gilt. ---- */

/* ---- Testimonials-Modul im Hellmodus: helle Sektion mit weißen Karten.
   Gilt überall, wo das Modul rendert (Testseite /testimonials/, künftig
   Startseite). Im Dark-Modus unverändert dunkel. */
html[data-theme="light"] .ao-testimonials {
	background: #F5F6F8;
	--ao-t-line: rgba(12, 16, 20, 0.12);
}

html[data-theme="light"] .ao-testimonials__title,
html[data-theme="light"] .ao-testimonial__name {
	color: #14171B;
}

html[data-theme="light"] .ao-testimonials__kicker {
	color: #007DA0;
}

html[data-theme="light"] .ao-testimonial {
	background: #FFFFFF;
	border-color: rgba(12, 16, 20, 0.10);
	box-shadow: 0 10px 30px rgba(12, 16, 20, 0.10);
}

/* Der dunkle Karten-Layer (Foto+Gradienten, eigenes Kind-Element) wird im
   Hellmodus zur zarten Textur auf der weißen Karte. */
html[data-theme="light"] .ao-testimonial__bg {
	opacity: 0.08;
}

html[data-theme="light"] .ao-testimonial__quote,
html[data-theme="light"] .ao-testimonial__more {
	color: #2A2F36;
}

html[data-theme="light"] .ao-testimonial__role {
	color: #5A6169;
}

html[data-theme="light"] .ao-testimonial__body {
	scrollbar-color: rgba(12, 16, 20, 0.3) transparent;
}

html[data-theme="light"] .ao-testimonial__body::-webkit-scrollbar-thumb {
	background: rgba(12, 16, 20, 0.3);
}

html[data-theme="light"] .ao-testimonial__badge {
	border-color: rgba(12, 16, 20, 0.35);
	color: #5A6169;
}

html[data-theme="light"] .ao-testimonials__play {
	background: rgba(12, 16, 20, 0.08);
	color: #14171B;
}

html[data-theme="light"] .ao-testimonials__dot span {
	background: rgba(12, 16, 20, 0.25);
}

/* Footer-Logos (weiße Wortmarke + blau-weißes Signet): im Hellmodus
   invertieren; hue-rotate stellt den Cyan-Ton wieder her. */
html[data-theme="light"] .elementor-element-b3e99d4 img,
html[data-theme="light"] .elementor-element-5123f48 img {
	filter: invert(1) hue-rotate(180deg);
}

/* Header-Konzept in BEIDEN Modi: Menü/Logo immer weiß (Slot aomtx), der von
   Elementor beim Scrollen eingeblendete Balken (Container 1442678f/fe66de4)
   bleibt bewusst SCHWARZ — dunkle Glasleiste auch im Hellmodus. Dadurch
   stimmt das Einblend-Timing von Elementor pixelgenau, ohne eigene Logik.
   Archiv-Seiten (Tag/Kategorie) starten hell: dort bekommt der Header die
   dunkle Leiste PERMANENT, damit Logo/Menü ab Scroll 0 lesbar sind. */
/* NUR Tag-/Kategorie-Archive (NICHT body.archive — das matcht auch /projekte/
   als CPT-Archiv!) und NUR im Hellmodus: dort startet die Seite hell, weißes
   Logo/Menü brauchen die Leiste ab Scroll 0. Überall sonst gilt: Header ist
   ungescrollt 100% transparent (Betreiber-Ansage 13.08.). */
html[data-theme="light"] body.tag .elementor-element-4f73fd4,
html[data-theme="light"] body.tag .elementor-element-fe66de4,
html[data-theme="light"] body.category .elementor-element-4f73fd4,
html[data-theme="light"] body.category .elementor-element-fe66de4 {
	background-color: #0A0C10 !important;
}

/* ---- Umschalt-Button (rechts fixiert) ---- */
.ao-theme-toggle {
	position: fixed;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 9990; /* unter Cookie-Layer (Borlabs nutzt >2^25), über Inhalt */
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid var(--e-global-color-aoln1, rgba(255, 255, 255, 0.19));
	background: var(--e-global-color-aofl2, #202227);
	color: var(--e-global-color-aotx1, #ffffff);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ao-theme-toggle:hover { transform: translateY(-50%) scale(1.08); }

.ao-theme-toggle:focus-visible {
	outline: 2px solid var(--e-global-color-aoak1, #00ABD7);
	outline-offset: 3px;
}

.ao-theme-toggle svg { width: 22px; height: 22px; display: block; }

/* Icon-Logik: Dark zeigt Sonne (Wechsel zu hell), Light zeigt Mond */
.ao-theme-toggle .ao-tt-mond { display: none; }
html[data-theme="light"] .ao-theme-toggle .ao-tt-sonne { display: none; }
html[data-theme="light"] .ao-theme-toggle .ao-tt-mond { display: block; }

html[data-theme="light"] .ao-theme-toggle {
	box-shadow: 0 4px 18px rgba(20, 23, 27, 0.18);
}

@media (max-width: 767px) {
	.ao-theme-toggle { right: 10px; width: 42px; height: 42px; }
}

@media print {
	.ao-theme-toggle { display: none; }
}