/* Shared public-site header system.
 * Keep every Clarity Dojo participant-facing surface on the same dark navy
 * header used by the canonical homepage. This intentionally changes color and
 * contrast only. Theme layout, stickiness, spacing, and menu behavior remain
 * owned by OceanWP / the existing surface styles. */
:root{
    --cdse-public-header:#02082d;
}

body:not(.wp-admin) #transparent-header-wrap,
body:not(.wp-admin) #site-header,
body:not(.wp-admin) #site-header #site-header-inner{
    background-color:var(--cdse-public-header)!important;
    border-color:transparent!important;
}

body:not(.wp-admin) #site-header{
    box-shadow:none!important;
}

body:not(.wp-admin) #site-header #site-navigation-wrap .dropdown-menu > li > a,
body:not(.wp-admin) #site-header #site-navigation-wrap .dropdown-menu > li > a .nav-arrow,
body:not(.wp-admin) #site-header .search-toggle-li .site-search-toggle,
body:not(.wp-admin) #site-header .search-toggle-li .site-search-toggle .icon-magnifier,
body:not(.wp-admin) #site-header .oceanwp-mobile-menu-icon,
body:not(.wp-admin) #site-header .oceanwp-mobile-menu-icon a,
body:not(.wp-admin) #site-header button.mobile-menu,
body:not(.wp-admin) #site-header button.mobile-menu .oceanwp-text,
body:not(.wp-admin) #site-header button.mobile-menu .oceanwp-close-text{
    color:#fff!important;
}

body:not(.wp-admin) #site-header #site-navigation-wrap .dropdown-menu > li > a:hover,
body:not(.wp-admin) #site-header #site-navigation-wrap .dropdown-menu > li > a:focus-visible,
body:not(.wp-admin) #site-header .search-toggle-li .site-search-toggle:hover,
body:not(.wp-admin) #site-header .search-toggle-li .site-search-toggle:focus-visible{
    color:#9edfff!important;
}

body:not(.wp-admin) #site-header button.mobile-menu .hamburger-inner,
body:not(.wp-admin) #site-header button.mobile-menu .hamburger-inner::before,
body:not(.wp-admin) #site-header button.mobile-menu .hamburger-inner::after,
body:not(.wp-admin) #site-header .oceanwp-mobile-menu-icon .hamburger-inner,
body:not(.wp-admin) #site-header .oceanwp-mobile-menu-icon .hamburger-inner::before,
body:not(.wp-admin) #site-header .oceanwp-mobile-menu-icon .hamburger-inner::after{
    background-color:#fff!important;
}

body:not(.wp-admin) #site-header #mobile-dropdown,
body:not(.wp-admin) #site-header #mobile-dropdown nav,
body:not(.wp-admin) #site-header #mobile-dropdown ul,
body:not(.wp-admin) #site-header #mobile-dropdown li{
    background-color:var(--cdse-public-header)!important;
}

body:not(.wp-admin) #site-header #mobile-dropdown li{
    border-color:rgba(255,255,255,.12)!important;
}

body:not(.wp-admin) #site-header #mobile-dropdown li > a{
    color:#fff!important;
    background:transparent!important;
}

body:not(.wp-admin) #site-header #mobile-dropdown li > a:hover,
body:not(.wp-admin) #site-header #mobile-dropdown li > a:focus-visible{
    color:#fff!important;
    background:rgba(255,255,255,.10)!important;
}

body:not(.wp-admin) #site-header a:focus-visible,
body:not(.wp-admin) #site-header button.mobile-menu:focus-visible{
    outline:2px solid #fff;
    outline-offset:3px;
}


/* Plugin-owned Schools / Colleges / Parents templates use their own header
 * instead of OceanWP. Keep those surfaces on the exact same header color. */
body:not(.wp-admin) .cds-site-header,
body:not(.wp-admin) .cds-site-header .cds-header-inner{
    background-color:var(--cdse-public-header)!important;
}

body:not(.wp-admin) .cds-site-header,
body:not(.wp-admin) .cds-site-header .cds-brand,
body:not(.wp-admin) .cds-site-header .cds-brand:visited,
body:not(.wp-admin) .cds-site-header nav a,
body:not(.wp-admin) .cds-site-header nav a:visited,
body:not(.wp-admin) .cds-site-header .cds-menu-toggle{
    color:#fff!important;
}

body:not(.wp-admin) .cds-site-header .cds-menu-toggle{
    border-color:rgba(255,255,255,.55)!important;
    background:transparent!important;
}