/**
 * Mobile header parity — logo + garage + cart top bar (row 1).
 * Links row / SELECT YOUR PARTS / Top Selling / Track / search hidden on mobile.
 * Garage + Cart sit on the physical right of the logo row (garage beside cart).
 * Desktop unchanged. Loaded after mobile-v2.css (must win over display:contents / hide rules).
 */
@media (max-width: 900px) {
  :root {
    --nav-main-h: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm);
    --nav-total-h: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm);
    --nav-logo-h: calc((72px - 0.6cm) * 1.98);
    --nav-search-h: 36px;
    --mob-v2-header-total: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm + env(safe-area-inset-top, 0));
    --nav-mob-h: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm);
    --ws-header-border: #e8ecf2;
  }

  body.is-home-page {
    --mob-v2-header-total: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm + env(safe-area-inset-top, 0));
    --nav-mob-h: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm);
  }

  body > nav:not(.mob-bottom-bar),
  nav:not(.mob-bottom-bar),
  body.is-home-page > nav:not(.mob-bottom-bar),
  body.is-home-page nav:not(.mob-bottom-bar) {
    display: block !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: sticky !important;
    top: 0 !important;
    inset: auto !important;
    z-index: 1200 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid var(--ws-header-border, #e8ecf2) !important;
    box-shadow: 0 1px 3px rgba(26, 35, 50, 0.06) !important;
  }

  body > nav:not(.mob-bottom-bar)::before,
  body > nav:not(.mob-bottom-bar)::after,
  nav:not(.mob-bottom-bar)::before,
  nav:not(.mob-bottom-bar)::after {
    display: none !important;
    content: none !important;
  }

  /* Kill single-column grid that stacked logo above search */
  .nav-main,
  body.is-home-page .nav-main,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-main,
  nav:not(.mob-bottom-bar) .nav-main {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    gap: 0 !important;
    padding: env(safe-area-inset-top, 0) 0 0 !important;
    background: #ffffff !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    grid-template-areas: none !important;
  }

  /* ONE line: logo (left) + garage + cart (physical right) — override mobile-v2 display:contents */
  .nav-shell.nav-main-row,
  body.is-home-page .nav-shell.nav-main-row,
  body.is-home-page .nav-main-row,
  body.is-home-page .nav-main .nav-shell,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-shell.nav-main-row,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-main-row,
  html[dir="ltr"] .nav-shell.nav-main-row,
  html[dir="rtl"] .nav-shell.nav-main-row,
  html[dir="ltr"] body.is-home-page > nav:not(.mob-bottom-bar) .nav-shell.nav-main-row,
  html[dir="rtl"] body.is-home-page > nav:not(.mob-bottom-bar) .nav-shell.nav-main-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    direction: ltr !important;
    gap: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm) !important;
    min-height: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm) !important;
    max-height: calc((76px - 1cm) * 1.45 - 0.25cm + 0.15cm - 0.20cm) !important;
    padding: 2px 10px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    overflow: visible !important;
  }

  .nav-logo,
  body.is-home-page .nav-logo,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-logo,
  html[dir="rtl"] body.is-home-page > nav:not(.mob-bottom-bar) .nav-logo {
    display: flex !important;
    flex: 0 0 auto !important;
    grid-area: auto !important;
    width: auto !important;
    max-width: calc(173px * 1.98) !important;
    height: calc((72px - 0.6cm) * 1.98) !important;
    min-height: calc((72px - 0.6cm) * 1.98) !important;
    max-height: calc((72px - 0.6cm) * 1.98) !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    align-self: center !important;
  }

  .nav-logo-img,
  body.is-home-page .nav-logo-img,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-logo-img,
  html[dir="rtl"] body.is-home-page > nav:not(.mob-bottom-bar) .nav-logo-img {
    display: block !important;
    height: calc((72px - 0.6cm) * 1.98) !important;
    max-height: calc((72px - 0.6cm) * 1.98) !important;
    width: auto !important;
    max-width: calc(173px * 1.98) !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: translateY(0) !important;
    margin: 0 !important;
  }

  /* Flatten action wrappers so garage + cart join the logo flex row */
  .nav-actions-wrap,
  body.is-home-page .nav-actions-wrap,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-actions-wrap,
  .nav-main-actions,
  body.is-home-page .nav-main-actions,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-main-actions,
  .nav-util-cluster,
  body.is-home-page .nav-util-cluster,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-util-cluster {
    display: contents !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Hide search / shop / non-cart utils (legacy mobile-actions stay hidden) */
  .nav-trade-cluster,
  body.is-home-page .nav-trade-cluster,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-trade-cluster,
  .nav-trade-cluster > .nav-shop-btn,
  body.is-home-page .nav-trade-cluster > .nav-shop-btn,
  .nav-search-wrap,
  body.is-home-page .nav-search-wrap,
  body.is-home-page > nav:not(.mob-bottom-bar) .nav-search-wrap,
  .nav-search,
  body.is-home-page .nav-search,
  .nav-search-dropdown,
  body.is-home-page .nav-search-dropdown,
  #navSearchDropdown,
  body.is-home-page #navSearchDropdown,
  .nav-search-filter,
  .nav-search .nav-search-filter,
  body.is-home-page .nav-search-filter,
  .nav-search-filter-chevron,
  .nav-util-cluster .nav-lang-wrap,
  body.is-home-page .nav-util-cluster .nav-lang-wrap,
  .nav-util-cluster .nav-util-btn--auth,
  .nav-util-cluster .nav-account,
  .nav-util-cluster .nav-btn-auth,
  .nav-mobile-actions {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Garage — icon + "My Garage" label (i18n), brand red, physical right cluster */
  .nav-util-cluster .nav-garage-btn,
  .nav-util-cluster .nav-util-btn--garage,
  #navGarageBtn,
  body.is-home-page .nav-util-cluster .nav-garage-btn,
  body.is-home-page .nav-util-cluster .nav-util-btn--garage,
  body.is-home-page #navGarageBtn,
  html[dir="rtl"] .nav-util-cluster .nav-garage-btn,
  html[dir="ltr"] .nav-util-cluster .nav-garage-btn,
  html[dir="rtl"] body.is-home-page #navGarageBtn,
  html[dir="ltr"] body.is-home-page #navGarageBtn {
    display: inline-flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    gap: 4px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    margin-inline: auto 0 !important;
    padding: 0 2px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    color: var(--red, #D71920) !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    cursor: pointer;
  }

  .nav-util-cluster .nav-garage-btn:hover,
  .nav-util-cluster .nav-garage-btn:focus-visible,
  #navGarageBtn:hover,
  #navGarageBtn:focus-visible,
  body.is-home-page #navGarageBtn:hover,
  body.is-home-page #navGarageBtn:focus-visible {
    background: transparent !important;
    border: none !important;
    color: var(--red, #D71920) !important;
    box-shadow: none !important;
    opacity: 0.75;
  }

  .nav-util-cluster .nav-garage-btn:active,
  #navGarageBtn:active,
  body.is-home-page #navGarageBtn:active {
    background: transparent !important;
    border: none !important;
    transform: scale(0.96);
  }

  .nav-util-cluster .nav-garage-btn .nav-util-btn__label,
  #navGarageBtn .nav-util-btn__label,
  body.is-home-page #navGarageBtn .nav-util-btn__label,
  html[dir="ltr"] .nav-util-cluster .nav-garage-btn .nav-util-btn__label,
  html[dir="rtl"] .nav-util-cluster .nav-garage-btn .nav-util-btn__label,
  html[dir="ltr"] #navGarageBtn .nav-util-btn__label,
  html[dir="rtl"] #navGarageBtn .nav-util-btn__label {
    display: inline-block !important;
    visibility: visible !important;
    position: static !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: 0.02em;
    text-transform: none !important;
    color: var(--red, #D71920) !important;
  }

  html[dir="rtl"] .nav-util-cluster .nav-garage-btn .nav-util-btn__label,
  html[dir="rtl"] #navGarageBtn .nav-util-btn__label,
  html[dir="rtl"] body.is-home-page #navGarageBtn .nav-util-btn__label {
    font-family: var(--font-ar) !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
  }

  html[dir="ltr"] .nav-util-cluster .nav-garage-btn .nav-util-btn__label,
  html[dir="ltr"] #navGarageBtn .nav-util-btn__label,
  html[dir="ltr"] body.is-home-page #navGarageBtn .nav-util-btn__label {
    font-family: var(--font-en, Montserrat, Arial, sans-serif) !important;
  }

  .nav-util-cluster .nav-garage-btn .nav-util-btn__icon,
  #navGarageBtn .nav-util-btn__icon,
  body.is-home-page #navGarageBtn .nav-util-btn__icon {
    display: inline-flex !important;
    position: relative !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    color: inherit !important;
  }

  .nav-util-cluster .nav-garage-btn .nav-util-btn__icon svg,
  .nav-util-cluster .nav-garage-btn svg.nav-garage-icon-svg,
  #navGarageBtn .nav-util-btn__icon svg,
  #navGarageBtn svg.nav-garage-icon-svg,
  body.is-home-page #navGarageBtn svg {
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    color: inherit !important;
  }

  .nav-util-cluster .nav-garage-btn .nav-util-btn__icon svg path,
  #navGarageBtn .nav-util-btn__icon svg path {
    fill: currentColor !important;
    stroke: none !important;
  }

  .nav-util-cluster .nav-garage-btn .nav-garage-status,
  #navGarageBtn .nav-garage-status {
    top: -2px !important;
    inset-inline-end: -2px !important;
    transform: scale(0.85);
    transform-origin: top right;
  }

  /* Cart — glyph only (no plate), physical right after garage (LTR + RTL) */
  .nav-util-cluster .nav-cart-btn,
  .nav-util-cluster .nav-util-btn--cart,
  .nav-util-cluster .nav-cart-btn.nav-util-btn,
  #navCartBtn,
  body.is-home-page .nav-util-cluster .nav-cart-btn,
  body.is-home-page .nav-util-cluster .nav-util-btn--cart,
  body.is-home-page #navCartBtn,
  html[dir="rtl"] .nav-util-cluster .nav-cart-btn,
  html[dir="ltr"] .nav-util-cluster .nav-cart-btn,
  html[dir="rtl"] body.is-home-page #navCartBtn,
  html[dir="ltr"] body.is-home-page #navCartBtn {
    display: inline-flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-inline: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    color: #111111 !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    cursor: pointer;
  }

  .nav-util-cluster .nav-cart-btn:hover,
  .nav-util-cluster .nav-cart-btn:focus-visible,
  #navCartBtn:hover,
  #navCartBtn:focus-visible,
  body.is-home-page #navCartBtn:hover,
  body.is-home-page #navCartBtn:focus-visible {
    background: transparent !important;
    border: none !important;
    color: #111111 !important;
    box-shadow: none !important;
    opacity: 0.75;
  }

  .nav-util-cluster .nav-cart-btn:active,
  #navCartBtn:active,
  body.is-home-page #navCartBtn:active {
    background: transparent !important;
    border: none !important;
    transform: scale(0.96);
  }

  .nav-util-cluster .nav-cart-btn .nav-cart-label,
  .nav-util-cluster .nav-cart-btn .nav-util-btn__label,
  #navCartBtn .nav-cart-label,
  body.is-home-page #navCartBtn .nav-cart-label {
    display: none !important;
  }

  .nav-util-cluster .nav-cart-btn .nav-cart-icon-wrap,
  #navCartBtn .nav-cart-icon-wrap,
  body.is-home-page #navCartBtn .nav-cart-icon-wrap {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 33px !important;
    overflow: visible !important;
  }

  .nav-util-cluster .nav-cart-btn svg,
  #navCartBtn svg,
  body.is-home-page #navCartBtn svg {
    width: 44px !important;
    height: 33px !important;
    stroke: currentColor !important;
    fill: none !important;
    color: inherit !important;
    stroke-width: 2.75 !important;
    stroke-linecap: butt !important;
    stroke-linejoin: miter !important;
  }

  .nav-util-cluster .nav-cart-btn svg .nav-cart-wheel,
  #navCartBtn svg .nav-cart-wheel,
  body.is-home-page #navCartBtn svg .nav-cart-wheel {
    fill: currentColor !important;
    stroke: none !important;
  }

  /* Count digit inside open basket cargo — physical left (SVG not mirrored) */
  .nav-util-cluster .nav-cart-btn .cart-badge,
  #navCartBtn .cart-badge,
  body.is-home-page #navCartBtn .cart-badge,
  html[dir="ltr"] .nav-util-cluster .nav-cart-btn .cart-badge,
  html[dir="rtl"] .nav-util-cluster .nav-cart-btn .cart-badge,
  html[dir="ltr"] #navCartBtn .cart-badge,
  html[dir="rtl"] #navCartBtn .cart-badge {
    top: 44% !important;
    /* Reset logical insets first; physical left/right last (RTL maps inline-end → left). */
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    right: auto !important;
    left: 58% !important;
    transform: translate(-50%, calc(-50% - 3mm)) !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #D71920 !important;
    font-size: 14.375px !important;
    font-weight: 800 !important;
    font-family: var(--font-en, Montserrat, Arial, sans-serif) !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
    pointer-events: none;
  }

  .nav-util-cluster .nav-cart-btn .cart-badge.bump,
  #navCartBtn .cart-badge.bump,
  body.is-home-page #navCartBtn .cart-badge.bump {
    animation: nav-cart-count-bump 0.3s ease !important;
  }

  @keyframes nav-cart-count-bump {
    0%, 100% { transform: translate(-50%, calc(-50% - 3mm)) scale(1); }
    50% { transform: translate(-50%, calc(-50% - 3mm)) scale(1.28); }
  }

  /* Row 2 collapsed on mobile — SELECT YOUR PARTS + all nav-links items hidden */
  .nav-shell.nav-links-row,
  #navLinksRow.nav-shell.nav-links-row,
  body.is-home-page .nav-shell.nav-links-row,
  body.is-home-page #navLinksRow,
  html[dir="ltr"] .nav-shell.nav-links-row,
  html[dir="rtl"] .nav-shell.nav-links-row {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    border: none !important;
  }

  .nav-links-shop-btn,
  #navLinksRow .nav-links-shop-btn,
  body.is-home-page .nav-links-shop-btn,
  body.is-home-page #navLinksRow .nav-links-shop-btn {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .nav-links-item,
  body.is-home-page .nav-links-item,
  #navLinksRow .nav-links-item--top-selling,
  #navLinksRow .nav-links-item[data-i18n="trackOrderTitle"],
  #navLinksRow .nav-links-item[data-i18n="footerAbout"],
  #navLinksRow .nav-links-item[data-i18n="mobV2HelpTitle"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.catalog-page-open > nav:not(.mob-bottom-bar),
  body.catalog-branch-mode > nav:not(.mob-bottom-bar),
  body.catalog-drawer-open > nav:not(.mob-bottom-bar),
  body:has(#catalogDrawer.open) > nav:not(.mob-bottom-bar) {
    display: block !important;
    visibility: visible !important;
    background: #ffffff !important;
    z-index: 1200 !important;
  }
}