/* Header finish. main.css owns positioning, visibility and menu states. */
.site-header,
.site-header.header-scrolled {
  background: #fff;
  border-bottom-color: var(--line);
  box-shadow: none;
  backdrop-filter: none;
}

.site-header .btn-quote,
.site-header .btn-mobile-quote {
  border-radius: .375rem;
  box-shadow: none;
}

.site-header .nav-list > li > a:not(.btn),
.site-header .nav-list > li > .nav-drop-btn {
  min-height: 44px;
  border-radius: .375rem;
  font-size: .9rem;
  white-space: nowrap;
}

.site-header .nav-list > li > a::after {
  content: none;
}

.site-header :is(.nav-drop, .nav-mega) {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: .5rem;
  box-shadow: 0 .75rem 1.5rem rgb(12 21 36 / 12%);
}

/* Keep the hover bridge above the panels and the repair list inside the viewport. */
.site-header .nav-mega {
  padding: 0;
}

.nav-mega > .sub-inner {
  box-sizing: border-box;
  max-height: calc(100dvh - 9rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1rem 1.25rem;
}

.nav-mega .mega-command-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(13rem, 1fr);
  gap: 1rem;
}

.nav-mega .mega-col-title {
  color: var(--ink);
  font-size: .875rem;
  letter-spacing: 0;
  text-transform: none;
}

.nav-mega :is(.mega-col-badge, .mega-speed-pill, .mega-item-arrow),
.nav-drop .nav-rich-pill {
  display: none;
}

.site-header .nav-list :is(.mega-item, .nav-rich-item, .nav-loc-pill) {
  min-height: 44px;
  padding: .5rem;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.site-header .nav-list :is(.mega-item, .nav-rich-item, .nav-loc-pill):is(:hover, :focus-visible) {
  background: var(--mist);
  color: var(--brand-deep);
}

.site-header :is(.mega-icon-box, .nav-rich-icon) {
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  background: none;
  color: var(--brand-deep);
  border: 0;
  box-shadow: none;
}

.nav-mega .mega-item-title,
.nav-mega .mega-item-desc {
  white-space: normal;
}

.nav-mega .mega-search-wrap {
  border-radius: .375rem;
  box-shadow: none;
}

.nav-mega .mega-action-card {
  border-radius: .375rem;
  background: var(--ink);
  box-shadow: none;
}

.nav-mega .mega-action-card::before {
  content: none;
}

.site-header .nav-list .mega-bottom-tag {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--brand-deep);
  text-decoration: underline;
  text-underline-offset: .2em;
}

.nav-drop--locations {
  width: 380px;
  min-width: 0;
  max-width: calc(100vw - 24px);
}

.nav-drop--locations .nav-rich-item--store {
  align-items: flex-start;
}

.nav-drop--locations .nav-rich-text {
  min-width: 0;
}

.nav-drop--locations .nav-rich-sub {
  white-space: normal;
  overflow-wrap: anywhere;
}

.nav-drop--locations .nav-rich-arrow {
  display: none;
}

.nav-location-direction {
  display: inline-block;
  margin-top: .2rem;
  color: var(--brand-deep);
  font-size: .74rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: .16em;
}

.mega-action-card__contacts {
  grid-template-columns: 1fr;
  min-width: 0;
}

.mega-contact-pill {
  min-width: 0;
  overflow: hidden;
}

.mega-contact-pill span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 1024px) and (max-width: 1150px) {
  .site-header .nav-list > li > a:not(.btn),
  .site-header .nav-list > li > .nav-drop-btn {
    padding-inline: .5rem;
  }
}

@media (max-width: 1023px) {
  .site-header .nav-toggle,
  .site-header .btn-mobile-quote {
    min-height: 44px;
  }

  .mobile-menu .mm-top-shortcuts {
    padding-block: .25rem .75rem;
    border-bottom: 1px solid var(--line);
  }

  .mobile-menu .mm-shortcut-tile,
  .mobile-menu .mm-shortcut-tile:is(:hover, :active) {
    min-height: 44px;
    padding: .5rem 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
  }

  .mobile-menu .mm-group-btn {
    min-height: 52px;
    padding-inline: 0;
    border-radius: 0;
    background: transparent;
  }

  .mobile-menu .mm-chev {
    background: transparent;
  }

  .mobile-menu .mm-sub ul {
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  .mobile-menu .mm-sub a {
    min-height: 44px;
    border-radius: 0;
    border-bottom: 1px solid var(--line);
    box-shadow: none;
    transform: none;
  }

  .mobile-menu .mm-sub a .ic {
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }

  .mobile-menu .mm-sticky-bar .btn {
    min-height: 44px;
    border-radius: .375rem;
    box-shadow: none;
  }
}
