/*
 * Platz für eigene Änderungen direkt als CSS
 * Die hier gemachten Änderungen überschreiben ggfs. andere Styles, da diese Datei als letzte geladen wird.
 */

:root {
    --cs-menu-yellow: #fff853;
    --cs-header-blue: #26293f; /* HIER ggf. dein exaktes Header-Blau einsetzen */
    --cs-link-header-hover: #fffdc2;
    --cs-link-main-hover: #4e5273;
}

/* Menü-Schriften im Header beim Hover gelb */
header a:hover,
header a:focus,
header .nav-link:hover,
header .nav-link:focus,
header .navbar-nav .nav-link:hover,
header .navbar-nav .nav-link:focus,
header .dropdown-item:hover,
header .dropdown-item:focus,
#mainNavigation a:hover,
#mainNavigation a:focus,
#mainNavigation .nav-link:hover,
#mainNavigation .nav-link:focus {
    color: var(--cs-menu-yellow) !important;
}

/* Aktive / gehoverte Menü-Unterstriche im Header gelb */
header .nav-link:hover,
header .nav-link:focus,
header .nav-link.active,
header .nav-item.active > .nav-link,
#mainNavigation .nav-link:hover,
#mainNavigation .nav-link:focus,
#mainNavigation .nav-link.active,
#mainNavigation .nav-item.active > .nav-link {
    border-bottom-color: var(--cs-menu-yellow) !important;
}

/* Falls NOVA den Unterstrich über ::before / ::after baut */
header .nav-link.dropdown-toggle:before,
/* header .nav-link::after, 
header .nav-item::before,
header .nav-item::after, */
/* #mainNavigation .nav-link::before,
#mainNavigation .nav-link::after, */
#mainNavigation .nav-item::before,
#mainNavigation .nav-item::after {
    background-color: var(--cs-menu-yellow) !important;
    border-color: var(--cs-menu-yellow) !important;
}

/* Dropdown-/Megamenu-Links im Header: Hover gelb */
header .dropdown-menu a:hover,
header .dropdown-menu a:focus,
header .dropdown-menu .dropdown-item:hover,
header .dropdown-menu .dropdown-item:focus,
header .megamenu a:hover,
header .megamenu a:focus,
#mainNavigation .dropdown-menu a:hover,
#mainNavigation .dropdown-menu a:focus {
    color: var(--cs-menu-yellow) !important;
}

/* Menütrenner LINKS im Menü nicht gelb, sondern Header-Blau */
header .dropdown-menu .dropdown-divider,
header .megamenu .dropdown-divider,
header .dropdown-menu hr,
header .megamenu hr,
header .dropdown-menu li,
header .megamenu li,
#dropdown-menu-pagination-header .page-item a::after,
#mainNavigation .dropdown-menu .dropdown-divider,
#mainNavigation .megamenu .dropdown-divider,
#mainNavigation .dropdown-menu hr,
#mainNavigation .megamenu hr {
    border-color: var(--cs-header-blue) !important;
}

/* Falls die Trenner als Hintergrundlinie gebaut sind */
header .dropdown-divider,
header .megamenu .dropdown-divider,
#mainNavigation .dropdown-divider,
#mainNavigation .megamenu .dropdown-divider {
    background-color: var(--cs-header-blue) !important;
}

/* Buttons im Header */
header button.btn.btn-secondary {
    background-color: var(--cs-menu-yellow) !important;
    color: var(--cs-header-blue) !important;
    border-color: var(--cs-menu-yellow) !important;
}

header button.btn.btn-secondary:hover,
header button.btn.btn-secondary:focus, {
    background-color: var(--cs-link-header-hover) !important;
    border-color: var(--cs-link-header-hover) !important;
}

aside .nav-link {
    border-color: var(--cs-header-blue) !important;
}

main a:hover,
main a:focus {
    color: var(--cs-link-main-hover) !important;
}