/* CSS For Dark Mode */
 
img.wp-dark-mode-ignore {
    filter: none !important;
    mix-blend-mode: normal !important;
}

html.wp-dark-mode-active, 
html.wp-dark-mode-active body {
    background: #272b2d !important;
    color: #eee !important;
}

html.wp-dark-mode-active body #header,
html.wp-dark-mode-active body #header .container,
html.wp-dark-mode-active body #header .container.clearfix,
html.wp-dark-mode-active body #navigation,
html.wp-dark-mode-active body .container .clearfix,
html.wp-dark-mode-active body #navigation ul.menu li  {
    background-color: rgb(32, 35, 35) !important;
    color: red !important;
}

html.wp-dark-mode-active body #navigation ul.menu li:not(.current-menu-item) > a,
html.wp-dark-mode-active body #navigation ul.sub-menu li:not(.current-menu-item) > a {
    background-color: rgb(32, 35, 35) !important;
    color: #eee !important;
}

html.wp-dark-mode-active body #navigation .menu .menu-item:hover > a,
html.wp-dark-mode-active body #navigation ul.menu li.current-menu-item ul.sub-menu li:hover > a {
    background-color: #f0c30e !important;
}
/* Active menu item */
html.wp-dark-mode-active body #navigation .menu .current-menu-item > a,
html.wp-dark-mode-active body #navigation ul.menu li.current-menu-item ul.sub-menu li > a,
html.wp-dark-mode-active body #navigation ul.menu li ul.sub-menu li > a,
html.wp-dark-mode-active body #navigation ul.menu li.current-menu-item ul.sub-menu.toggle-submenu,
html.wp-dark-mode-active body #navigation ul.menu li ul.sub-menu.toggle-submenu,
html.wp-dark-mode-active body #navigation ul.menu li a,
html.wp-dark-mode-active body #navigation ul.menu li ul.sub-menu li a,
html.wp-dark-mode-active body #header nav#navigation ul ul li {
    background-color: #584841 !important; 
    color: rgb(229, 224, 216) !important;      
}

html.wp-dark-mode-active body #navigation,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li.current-menu-item,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li.current-menu-item a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li.current_page_item,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li.current_page_item a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu li,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu li a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu.toggle-submenu,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li span.toggle-caret,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li span.toggle-caret i {
    background-color: #584841 !important;
    color: rgb(229, 224, 216) !important;
}

html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li:hover a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu li:hover a,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li ul.sub-menu li:hover,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li:hover span.toggle-caret,
html.wp-dark-mode-active body #navigation ul#menu-primary-menu-1 li:hover span.toggle-caret i {
    background-color: #ba9b22 !important; /* darker or different color on hover */
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}


html.wp-dark-mode-active #custom-mobile-menu li.active a{
    background-color: #584841 !important; 
    color: rgb(229, 224, 216) !important;
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

/* Submenu general background (for ul container) */
html.wp-dark-mode-active #pull,
html.wp-dark-mode-active #custom-mobile-menu,
html.wp-dark-mode-active #custom-mobile-menu li,
html.wp-dark-mode-active #custom-mobile-menu li a,
html.wp-dark-mode-active body #navigation ul.sub-menu,
html.wp-dark-mode-active #mobile-custom-menu-container,
html.wp-dark-mode-active .secondary-navigation {
    background-color: rgb(32, 35, 35) !important;
    color: #fff !important;
}

html.wp-dark-mode-active body .secondary-navigation {
border-bottom: 5px solid rgb(58, 61, 61) !important; 
}

html:not(.wp-dark-mode-active),
html:not(.wp-dark-mode-active) body {
    background: #fff !important;
    color: #111 !important;
}

/* Prevents white flash during paint */
html, body {
    transition: none !important;
}