/**
 * Lyor Auto-Shade – Header/Logo Inversion über dark/light Sections.
 * mix-blend-mode: difference (transparenter Header) + Body-Klassen (Fallback).
 */

.lyor-auto-invert {
	color: var(--lyor-shade-light, var(--p-shade-10, #fff));
	mix-blend-mode: difference;
	transition: color 0.4s var(--lyor-ease, cubic-bezier(0.19, 1, 0.22, 1));
}

.lyor-auto-invert img,
.lyor-auto-invert svg {
	mix-blend-mode: difference;
}

/* Fallback bei opakem Header: Observer setzt body-Klassen */
body.lyor-over-dark-section .lyor-auto-invert {
	color: var(--lyor-shade-light, var(--p-shade-10, #fff));
}

body.lyor-over-dark-section .lyor-auto-invert img {
	filter: brightness(0) invert(1);
}

body.lyor-over-light-section .lyor-auto-invert {
	color: var(--lyor-shade-dark, var(--p-shade-1, #111));
}

body.lyor-over-light-section .lyor-auto-invert img {
	filter: brightness(0);
}