/* ==============================================================
   EDUMASPUL | SUPER-COMPACT HEADER - OJS 3.x Default Theme
   For the ultra-wide 11:1 Edumaspul banner (4158 x 378 px).
   Upload image as Journal Logo; upload this CSS as Journal Style Sheet.
   No JavaScript. Scope: journal header and primary navigation only.
   ============================================================== */

/* Unified dark teal background, with no white blocks or empty margins. */
#headerNavigationContainer.pkp_structure_head,
#headerNavigationContainer .pkp_head_wrapper,
#headerNavigationContainer .pkp_site_name_wrapper,
#headerNavigationContainer .pkp_site_name,
#headerNavigationContainer .pkp_site_name > a {
  background: #063e43 !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

#headerNavigationContainer.pkp_structure_head {
  padding: 0 !important;
  border-bottom: 0 !important;
}

/* Slim 19px account/login strip, instead of tall OJS default spacing. */
@media (min-width: 992px) {
  #headerNavigationContainer .pkp_head_wrapper {
    width: 100% !important;
    max-width: none !important;
    padding: 19px 0 0 !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;
  }

  #headerNavigationContainer .pkp_navigation_user_wrapper {
    position: absolute !important;
    top: 0 !important;
    right: 12px !important;
    left: auto !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 50 !important;
  }

  #headerNavigationContainer .pkp_navigation_user > li > a {
    color: #ffffff !important;
    font-size: 11px !important;
    padding: 1px 5px !important;
    line-height: 17px !important;
  }
}

/* Remove default OJS logo container height and all image gaps. */
#headerNavigationContainer .pkp_site_name_wrapper,
#headerNavigationContainer .pkp_site_name {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  box-sizing: border-box !important;
}

#headerNavigationContainer .pkp_site_name {
  display: block !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  font-size: 0 !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-align: center !important;
}

#headerNavigationContainer .pkp_site_name > a,
#headerNavigationContainer .pkp_site_name > a.is_img,
#headerNavigationContainer .pkp_site_name .is_img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  line-height: 0 !important;
}

/* Full-width 11:1 banner: about 109px tall at a 1200px viewport.
   Do not force max-height, crop, or stretch; preserve logo and ISSN. */
#headerNavigationContainer .pkp_site_name img,
#headerNavigationContainer .pkp_site_name .is_img img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  vertical-align: middle !important;
  object-fit: contain !important;
}

/* Navigation closely attached to the banner. */
@media (min-width: 992px) {
  #headerNavigationContainer .pkp_site_nav_menu {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #075a57 !important;
    border-top: 2px solid #d5af48 !important;
  }

  #headerNavigationContainer .pkp_navigation_primary_row,
  #headerNavigationContainer .pkp_navigation_primary_wrapper {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: #075a57 !important;
  }

  #headerNavigationContainer .pkp_navigation_primary > li > a,
  #headerNavigationContainer .pkp_navigation_search_wrapper > a {
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 17px !important;
    padding: 7px 10px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  #headerNavigationContainer .pkp_navigation_primary > li > a:hover,
  #headerNavigationContainer .pkp_navigation_primary > li > a:focus,
  #headerNavigationContainer .pkp_navigation_search_wrapper > a:hover {
    color: #ffe6a4 !important;
  }

  /* Preserve readability of dropdown links. */
  #headerNavigationContainer .pkp_navigation_primary ul {
    background: #ffffff !important;
  }
  #headerNavigationContainer .pkp_navigation_primary ul a {
    color: #163a3b !important;
  }
}

/* Mobile: keep the native OJS menu accessible and the logo undistorted. */
@media (max-width: 991px) {
  #headerNavigationContainer .pkp_head_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
  }

  /* Narrow toolbar above banner reserves room for OJS hamburger. */
  #headerNavigationContainer .pkp_site_name_wrapper {
    padding-top: 40px !important;
    position: relative !important;
  }

  #headerNavigationContainer .pkp_site_nav_toggle {
    z-index: 80 !important;
  }

  #headerNavigationContainer .pkp_site_nav_menu {
    background: #075a57 !important;
    z-index: 90 !important;
  }
}
