/*
 * Budget Windows header / megamenu repair overrides.
 *
 * Keep this file small and targeted. It is intended to load after:
 * - assets/css/app.css
 * - assets/css/live-customizer-extract.css
 *
 * Do not move these rules into WordPress Additional CSS unless testing only.
 */

/* -------------------------------------------------------------------------
   Desktop header/megamenu shell
   ------------------------------------------------------------------------- */

@media (min-width: 1000px) {
  /*
   * Salient wraps the captured Budget header in #header-outer.
   * Keep the wrapper tight to the visible custom two-row header.
   */
  #header-outer {
    height: 110px !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /*
   * The captured Budget header uses .container, which otherwise inherits
   * generic Salient container max-width and padding rules.
   */
  #header-outer .global-header__container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    height: 110px !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /*
   * Let the colour bars span the full header area, while the actual logo/nav
   * content remains centred at the intended live-site width.
   */
  #header-outer .global-header__container .global-overlay__container {
    max-width: 1425px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /*
   * Make desktop dropdown positioning predictable and attached to the header.
   */
  #header-outer .global-nav__megamenu,
  #header-outer .global-nav__megamenu > ul.sf-menu {
    position: static !important;
  }

  #header-outer .global-nav__megamenu > ul.sf-menu > li.megamenu-item > ul.megamenu-dropdown__item,
  #header-outer .global-nav__megamenu li.megamenu-item > .megamenu-dropdown__item {
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin-top: 0 !important;
  }

  /*
   * Desktop dropdown typography normalisation.
   */
  #header-outer .megamenu-dropdown__item,
  #header-outer .megamenu-dropdown__item p,
  #header-outer .megamenu-dropdown__item li,
  #header-outer .megamenu-dropdown__item a {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;
  }

  #header-outer .megamenu-dropdown__item h3,
  #header-outer .megamenu-dropdown__item h4,
  #header-outer .megamenu-dropdown__item .vc_custom_heading {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
  }

  #header-outer .megamenu-dropdown__item a {
    text-decoration: none !important;
  }

  #header-outer .megamenu-dropdown__item a:hover {
    text-decoration: underline !important;
  }

  /*
   * Upper CTA row should be lighter/smaller than the phone number.
   * Phone number is deliberately not targeted here.
   */
  #header-outer .global-navcol__second,
  #header-outer .global-nav__upper,
  #header-outer .global-nav__upper a {
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
  }
}

/* -------------------------------------------------------------------------
   Mobile/Zeynep safety only
   ------------------------------------------------------------------------- */

@media (max-width: 999px) {
  /*
   * This only applies if the mobile drawer exists on the page.
   * It does not force the drawer open; it only prevents the short-drawer issue.
   */
  #mobile-nav.zeynep {
    height: 100vh !important;
    bottom: 0 !important;
  }
}

/* Remove the visible Yoast breadcrumb row from all front-end pages. */
body #breadcrumbs.yoast {
  display: none !important;
}

/* Keep Salient's desktop header spacer aligned with the 110px Budget header. */
@media (min-width: 1000px) {
  body #header-space,
  body #header-space.no-subnav {
    height: 110px !important;
    min-height: 0 !important;
    max-height: 110px !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Stop the sticky-header state enlarging and repositioning the logo wrapper. */
@media (min-width: 1000px) {
  #header-outer .global-header__logo,
  #header-outer.small-nav .global-header__logo {
    height: 116px !important;
    min-height: 116px !important;
    max-height: 116px !important;
    align-self: flex-start !important;
  }

  #header-outer .global-header__logo #logo,
  #header-outer.small-nav .global-header__logo #logo {
    height: 116px !important;
    min-height: 116px !important;
    max-height: 116px !important;
    margin: 0 !important;
    align-self: flex-start !important;
  }

  #header-outer .global-header__logo #logo img,
  #header-outer.small-nav .global-header__logo #logo img {
    width: auto !important;
    height: 100px !important;
    max-width: none !important;
    max-height: 100px !important;
    object-fit: contain !important;
  }
}
