/* The existing navigation keeps its design and safe-area padding. Only on
   eligible populated-cart routes do the two bars share a fixed stack. */
.v2-cart-dock { display:contents; }
.v2-mobile-cart { display:none; }

@media screen and (max-width:900px) {
  :root:has(.v2-cart-dock--active) { --slv2-mobile-cart-height:60px; }

  .v2-cart-dock--active {
    display:flex; flex-direction:column;
    position:fixed; inset-inline:0; bottom:0; z-index:95;
  }
  .v2-cart-dock--active > .tabbar { position:static; }
  /* The full-screen filter drawer owns its bottom action area while open. */
  body:has(.v2-fd.is-open) .v2-cart-dock { visibility:hidden; }

  .v2-mobile-cart {
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    height:var(--slv2-mobile-cart-height); padding:8px var(--slv2-gutter);
    padding-left:max(var(--slv2-gutter), env(safe-area-inset-left));
    padding-right:max(var(--slv2-gutter), env(safe-area-inset-right));
    background:var(--slv2-cta-primary-bg); color:var(--slv2-cta-primary-text);
    border-radius:0; box-shadow:none;
    font-family:var(--slv2-sans);
  }
  /* One baseline: amount first, count as a quiet suffix beside it. */
  .v2-mobile-cart__totals {
    display:flex; align-items:baseline; gap:8px;
    min-width:0; font-variant-numeric:tabular-nums;
  }
  .v2-mobile-cart__count {
    font-size:11px; line-height:16px; font-weight:500;
    letter-spacing:.08em; text-transform:uppercase; opacity:.82; white-space:nowrap;
  }
  .v2-mobile-cart__subtotal { font-size:18px; line-height:24px; font-weight:600; }
  .v2-mobile-cart__link {
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    flex-shrink:0; min-height:44px; padding:0 4px;
    color:inherit; text-decoration:none; border-radius:var(--slv2-r-ui);
    font-size:11px; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  }
  .v2-mobile-cart__link:focus-visible { outline:2px solid currentColor; outline-offset:2px; }

  /* Reserve the extra bar at the end of content and the footer. Anchor/focus
     scrolling and add-to-cart notifications also stay clear of the dock. */
  body:has(.v2-cart-dock--active) .page-main { padding-bottom:var(--slv2-mobile-cart-height); }
  body:has(.v2-cart-dock--active) .ftr {
    padding-bottom:calc(60px + env(safe-area-inset-bottom) + var(--sp-4) + var(--slv2-mobile-cart-height));
  }
  html:has(.v2-cart-dock--active) {
    scroll-padding-bottom:calc(76px + env(safe-area-inset-bottom) + var(--slv2-mobile-cart-height));
  }
  body:has(.v2-cart-dock--active) .toast-wrap {
    bottom:calc(72px + env(safe-area-inset-bottom) + var(--slv2-mobile-cart-height));
  }
}