/*
 * Farbgestaltung ausschließlich für die schwebenden Seitenmenüs auf
 * Atemschutzüberwachung, Gebäudekontrolle, Freihandzeichnung und Infoseiten.
 * Das Seitenlayout außerhalb des geöffneten Overlays bleibt unverändert.
 */

/* Light-Mode: Grundflächen und reguläre Menüeinträge */
#ast-menue-overlay .ast-menue {
    color-scheme: light;
    background: #f7f7f7 !important;
    border-left-color: #777777 !important;
    color: #111111 !important;
}

#ast-menue-overlay .ast-menue-inhalt,
#ast-menue-overlay .ast-menue-kopf {
    background: #f7f7f7 !important;
    color: #111111 !important;
}

#ast-menue-overlay .ast-menue-kopf {
    border-bottom-color: #a0a0a0 !important;
}

#ast-menue-overlay .ast-menue-titel {
    color: #111111 !important;
}

#ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul),
#ast-menue-overlay .ast-menue-schliessen {
    background: #ffffff !important;
    border-color: #777777 !important;
    color: #111111 !important;
}

#ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):hover,
#ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):focus-visible,
#ast-menue-overlay .ast-menue-schliessen:hover,
#ast-menue-overlay .ast-menue-schliessen:focus-visible {
    background: #e9e9e9 !important;
    color: #111111 !important;
}

#ast-menue-overlay .ast-menue-trennlinie {
    background: #aaaaaa !important;
}

/* Variante 3: Weiß mit Rot */
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau {
    opacity: 1 !important;
    background: #ffffff !important;
    border: 2px solid #b60000 !important;
    color: #a00000 !important;
}

#ast-menue-overlay .ast-menue-punkt.ast-menue-modul:hover,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul:focus-visible,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau:hover {
    background: #fff1f1 !important;
    border-color: #8f0000 !important;
    color: #8f0000 !important;
}

#ast-menue-overlay .ast-menue-punkt.ast-menue-modul .ast-menue-icon,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul .ast-menue-icon svg {
    color: currentColor !important;
    stroke: currentColor !important;
}

#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:hover,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:focus-visible,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:active,
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul[aria-current="page"] {
    background: #ff0000 !important;
    border-color: #b60000 !important;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 2px #ffffff !important;
}

#ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau::after {
    background: transparent !important;
    border-color: currentColor !important;
    color: inherit !important;
}

/* Schalter bleiben im selben visuellen System wie die übrigen Menüeinträge. */
#ast-menue-overlay .ast-menue-slider {
    background: #bdbdbd !important;
    border-color: #666666 !important;
}

#ast-menue-overlay .ast-menue-slider::before {
    background: #ffffff !important;
    border-color: #666666 !important;
}

#ast-menue-overlay .ast-menue-checkbox:checked + .ast-menue-slider {
    background: #666666 !important;
}

/* Dark-Mode gilt ausschließlich innerhalb des schwebenden Seitenmenüs. */
@media (prefers-color-scheme: dark) {
    #ast-menue-overlay .ast-menue {
        color-scheme: dark;
        background: #171717 !important;
        border-left-color: #5c5c5c !important;
        color: #f3f3f3 !important;
        box-shadow: -4px 0 18px rgba(0, 0, 0, .58) !important;
    }

    #ast-menue-overlay .ast-menue-inhalt,
    #ast-menue-overlay .ast-menue-kopf {
        background: #171717 !important;
        color: #f3f3f3 !important;
    }

    #ast-menue-overlay .ast-menue-kopf {
        border-bottom-color: #4b4b4b !important;
    }

    #ast-menue-overlay .ast-menue-titel {
        color: #f3f3f3 !important;
    }

    #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul),
    #ast-menue-overlay .ast-menue-schliessen {
        background: #272727 !important;
        border-color: #5c5c5c !important;
        color: #f3f3f3 !important;
    }

    #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):hover,
    #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):focus-visible,
    #ast-menue-overlay .ast-menue-schliessen:hover,
    #ast-menue-overlay .ast-menue-schliessen:focus-visible {
        background: #353535 !important;
        border-color: #777777 !important;
        color: #ffffff !important;
    }

    #ast-menue-overlay .ast-menue-trennlinie {
        background: #474747 !important;
    }

    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau {
        background: #272727 !important;
        border-color: #a90000 !important;
        color: #ff7e7e !important;
    }

    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:hover,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:focus-visible,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau:hover {
        background: #352323 !important;
        border-color: #ef1717 !important;
        color: #ff9a9a !important;
    }

    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:hover,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:focus-visible,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:active,
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul[aria-current="page"] {
        background: #ef1717 !important;
        border-color: #a90000 !important;
        color: #ffffff !important;
        box-shadow: inset 0 0 0 2px #ffffff !important;
    }

    #ast-menue-overlay .ast-menue-slider {
        background: #555555 !important;
        border-color: #8a8a8a !important;
    }

    #ast-menue-overlay .ast-menue-slider::before {
        background: #f3f3f3 !important;
        border-color: #8a8a8a !important;
    }

    #ast-menue-overlay .ast-menue-checkbox:checked + .ast-menue-slider {
        background: #8a8a8a !important;
    }
}

/* Die manuelle Auswahl übersteuert die Systemeinstellung. */
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue {
    color-scheme: light;
    background: #f7f7f7 !important;
    border-left-color: #777777 !important;
    color: #111111 !important;
    box-shadow: -4px 0 18px rgba(0, 0, 0, .24) !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-inhalt,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-kopf {
    background: #f7f7f7 !important;
    color: #111111 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-kopf {
    border-bottom-color: #a0a0a0 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-titel {
    color: #111111 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul),
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-schliessen {
    background: #ffffff !important;
    border-color: #777777 !important;
    color: #111111 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):hover,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):focus-visible,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-schliessen:hover,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-schliessen:focus-visible {
    background: #e9e9e9 !important;
    border-color: #777777 !important;
    color: #111111 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-trennlinie {
    background: #aaaaaa !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau {
    background: #ffffff !important;
    border-color: #b60000 !important;
    color: #a00000 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:hover,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:focus-visible,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau:hover {
    background: #fff1f1 !important;
    border-color: #8f0000 !important;
    color: #8f0000 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:hover,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:focus-visible,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:active,
html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul[aria-current="page"] {
    background: #ff0000 !important;
    border-color: #b60000 !important;
    color: #ffffff !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-slider {
    background: #bdbdbd !important;
    border-color: #666666 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-slider::before {
    background: #ffffff !important;
    border-color: #666666 !important;
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-checkbox:checked + .ast-menue-slider {
    background: #666666 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue {
    color-scheme: dark;
    background: #171717 !important;
    border-left-color: #5c5c5c !important;
    color: #f3f3f3 !important;
    box-shadow: -4px 0 18px rgba(0, 0, 0, .58) !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-inhalt,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-kopf {
    background: #171717 !important;
    color: #f3f3f3 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-kopf {
    border-bottom-color: #4b4b4b !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-titel {
    color: #f3f3f3 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul),
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-schliessen {
    background: #272727 !important;
    border-color: #5c5c5c !important;
    color: #f3f3f3 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):hover,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt:not(.ast-menue-modul):focus-visible,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-schliessen:hover,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-schliessen:focus-visible {
    background: #353535 !important;
    border-color: #777777 !important;
    color: #ffffff !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-trennlinie {
    background: #474747 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau {
    background: #272727 !important;
    border-color: #a90000 !important;
    color: #ff7e7e !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:hover,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:focus-visible,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-vorschau:hover {
    background: #352323 !important;
    border-color: #ef1717 !important;
    color: #ff9a9a !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:hover,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:focus-visible,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul.ast-menue-aktiv:active,
html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul[aria-current="page"] {
    background: #ef1717 !important;
    border-color: #a90000 !important;
    color: #ffffff !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-slider {
    background: #555555 !important;
    border-color: #8a8a8a !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-slider::before {
    background: #f3f3f3 !important;
    border-color: #8a8a8a !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-checkbox:checked + .ast-menue-slider {
    background: #8a8a8a !important;
}

/* Nicht gewählte Module: roter Rahmen bleibt, Text und Icon folgen dem Lesemodus. */
#ast-menue-overlay .ast-menue-punkt.ast-menue-modul:not(.ast-menue-aktiv):not([aria-current="page"]) {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

@media (prefers-color-scheme: dark) {
    #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:not(.ast-menue-aktiv):not([aria-current="page"]) {
        color: #f3f3f3 !important;
        -webkit-text-fill-color: #f3f3f3 !important;
    }
}

html[data-ast-menu-theme="light"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:not(.ast-menue-aktiv):not([aria-current="page"]) {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

html[data-ast-menu-theme="dark"] #ast-menue-overlay .ast-menue-punkt.ast-menue-modul:not(.ast-menue-aktiv):not([aria-current="page"]) {
    color: #f3f3f3 !important;
    -webkit-text-fill-color: #f3f3f3 !important;
}