/* JVLE OJS 3.5 - full-width header banner with white background */

/* Make the main header and its inner container span the viewport */
#headerNavigationContainer.navbar,
#headerNavigationContainer.navbar.navbar-default,
#headerNavigationContainer {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 0 !important;
    border-bottom: 3px solid #55bce8 !important;
    box-shadow: none !important;
}

#headerNavigationContainer > .container,
#headerNavigationContainer .container,
#headerNavigationContainer .navbar-container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Banner/logo occupies the full header width */
#headerNavigationContainer .navbar-header,
#headerNavigationContainer .pkp_site_name,
#headerNavigationContainer .navbar-brand,
#headerNavigationContainer a.navbar-brand {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    text-align: center !important;
    background: #ffffff !important;
}

#headerNavigationContainer .navbar-brand img,
#headerNavigationContainer .pkp_site_name img,
#headerNavigationContainer img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
}

/* Keep navigation on its own row beneath the banner */
#headerNavigationContainer .navbar-collapse,
#headerNavigationContainer .navbar-nav,
#headerNavigationContainer .pkp_navigation_primary_wrapper {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

#headerNavigationContainer .navbar-nav > li > a,
#headerNavigationContainer .pkp_navigation_primary > li > a,
#headerNavigationContainer .navbar-nav > li > a:hover,
#headerNavigationContainer .pkp_navigation_primary > li > a:hover {
    color: #123b55 !important;
    background-color: #ffffff !important;
}

#headerNavigationContainer .navbar-nav > li.active > a,
#headerNavigationContainer .pkp_navigation_primary > li > a[aria-current="page"] {
    color: #123b55 !important;
    background-color: #f1f7fa !important;
}

/* Preserve readable admin/user controls against the white header */
#headerNavigationContainer .navbar-text,
#headerNavigationContainer .navbar-link,
#headerNavigationContainer .dropdown-toggle {
    color: #123b55 !important;
}