/* ProParts responsive navbar safety layer.
 * Loaded last to prevent legacy header rules from overlapping at laptop/tablet widths.
 */

.pp-desktop-sticky-nav,
.pp-desktop-sticky-nav *,
.pp-header-inner,
.pp-header-inner * {
  box-sizing: border-box !important;
}

.pp-desktop-sticky-inner,
.pp-header-inner {
  min-width: 0 !important;
}

.pp-sticky-logo,
.pp-sticky-links,
.pp-sticky-actions,
.pp-header-actions,
.pp-search {
  min-width: 0 !important;
}

.pp-sticky-links a,
.pp-sticky-actions a,
.pp-header-actions a {
  white-space: nowrap !important;
}

/* Full desktop: enough space for the complete navigation. */
@media (min-width: 1600px) {
  .pp-desktop-sticky-nav {
    display: flex !important;
  }

  .pp-desktop-sticky-inner {
    display: grid !important;
    grid-template-columns: minmax(88px, 118px) minmax(650px, 1fr) auto !important;
    align-items: center !important;
    gap: clamp(18px, 1.4vw, 30px) !important;
  }

  .pp-sticky-logo {
    width: 100% !important;
    max-width: 118px !important;
  }

  .pp-sticky-logo .pp-logo-img-brand {
    width: 100% !important;
    max-width: 118px !important;
    height: 58px !important;
    object-fit: contain !important;
  }

  .pp-sticky-links {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: clamp(16px, 1.25vw, 28px) !important;
    overflow: hidden !important;
  }

  .pp-sticky-links a {
    font-size: clamp(12px, .82vw, 14px) !important;
    letter-spacing: 0 !important;
    line-height: 1.2 !important;
  }

  .pp-sticky-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
  }

  .pp-sticky-actions > a,
  .pp-sticky-actions .pp-cart-link-sticky,
  .pp-sticky-actions .pp-account-link,
  .pp-sticky-actions .pp-header-add-listing {
    min-height: 42px !important;
    padding: 10px 15px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
  }

  .pp-sticky-actions > a[href^="tel:"] {
    display: none !important;
  }
}

/* Small/medium desktop: compact sticky bar, no collisions. */
@media (min-width: 1321px) and (max-width: 1599px) {
  .pp-desktop-sticky-nav {
    display: flex !important;
  }

  .pp-desktop-sticky-inner {
    display: grid !important;
    grid-template-columns: 76px minmax(430px, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .pp-sticky-logo {
    width: 76px !important;
    max-width: 76px !important;
  }

  .pp-sticky-logo .pp-logo-img-brand {
    width: 76px !important;
    max-width: 76px !important;
    height: 54px !important;
    object-fit: contain !important;
  }

  .pp-sticky-links {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: clamp(10px, 1vw, 18px) !important;
    overflow: hidden !important;
  }

  .pp-sticky-links a {
    font-size: 11px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  /* Keep only the links that fit safely in compact desktop mode. */
  .pp-sticky-links a:nth-child(4),
  .pp-sticky-links a:nth-child(5),
  .pp-sticky-links a:nth-child(7) {
    display: none !important;
  }

  .pp-sticky-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }

  .pp-sticky-actions > a,
  .pp-sticky-actions .pp-cart-link-sticky,
  .pp-sticky-actions .pp-account-link,
  .pp-sticky-actions .pp-header-add-listing {
    min-height: 40px !important;
    max-width: 190px !important;
    padding: 9px 12px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
  }

  .pp-sticky-actions > a[href^="tel:"],
  .pp-sticky-actions .pp-auth-links {
    display: none !important;
  }
}

/* Tablet and small laptop: use one consistent burger header, never the desktop sticky nav. */
@media (max-width: 1320px) {
  .pp-desktop-sticky-nav,
  .pp-sticky-header,
  body.pp-sticky-active .pp-desktop-sticky-nav,
  body.pp-sticky-active .pp-sticky-header {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-100%) !important;
  }

  .pp-header-inner {
    display: grid !important;
    grid-template-columns: minmax(100px, 1fr) auto !important;
    grid-template-areas:
      "logo burger"
      "search search" !important;
    align-items: center !important;
    gap: 12px !important;
    padding-block: 12px !important;
  }

  .pp-logo {
    grid-area: logo !important;
    width: min(180px, 100%) !important;
    max-width: 180px !important;
  }

  .pp-logo .pp-logo-img-brand {
    width: 100% !important;
    max-width: 180px !important;
    height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  .pp-burger {
    grid-area: burger !important;
    display: inline-flex !important;
    justify-self: end !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
  }

  .pp-search {
    grid-area: search !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .pp-header-actions {
    display: none !important;
  }

  .pp-header > #pp-mobile-nav.pp-nav {
    display: none !important;
  }

  .pp-header.pp-mobile-menu-open > #pp-mobile-nav.pp-nav,
  body.pp-mobile-menu-active .pp-header > #pp-mobile-nav.pp-nav,
  #pp-mobile-nav.pp-nav.is-open {
    display: block !important;
  }
}

@media (max-width: 767px) {
  .pp-header-inner {
    gap: 10px !important;
    padding-block: 10px !important;
  }

  .pp-logo {
    width: min(145px, 100%) !important;
    max-width: 145px !important;
  }

  .pp-logo .pp-logo-img-brand {
    height: 48px !important;
    max-width: 145px !important;
  }

  .pp-burger {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
}

body.admin-bar .pp-desktop-sticky-nav {
  top: 32px !important;
}

@media (max-width: 782px) {
  body.admin-bar .pp-desktop-sticky-nav {
    top: 46px !important;
  }
}


/* Fast native year selector: avoids building a second searchable DOM list. */
select[data-fast-native-select] {
  display: block !important;
  width: 100%;
  min-height: 54px;
  padding: 0 44px 0 18px;
  border: 1px solid #dfe4ec;
  border-radius: 18px;
  background-color: #fff;
  color: #111827;
  font: inherit;
  font-weight: 700;
  appearance: auto;
  -webkit-appearance: menulist;
}