/* Mobile v29 — site-wide page-end layout for every storefront route. */
@media (max-width: 900px) {
  :root {
    --mobile-v29-dock-height: 70px;
    --mobile-v29-dock-gap: 8px;
    --mobile-v29-footer-clearance: calc(var(--mobile-v29-dock-height) + var(--mobile-v29-dock-gap) + env(safe-area-inset-bottom) + 14px);
  }

  html,
  html body.store-body {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none !important;
  }

  html body.store-body {
    min-height: 100svh !important;
    overflow-y: visible !important;
    background-attachment: scroll !important;
  }

  html body.store-body #app {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  html body.store-body #app > .store-layout:not(.auth-layout) {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  html body.store-body #app > .store-layout:not(.auth-layout) > main.main,
  html body.store-body #app > .store-layout.sidebar-collapsed:not(.auth-layout) > main.main,
  html body.store-body #app > .store-layout.mobile-layout-v23:not(.auth-layout) > main.main,
  html body.store-body #app > .store-layout.mobile-layout-v24:not(.auth-layout) > main.main {
    box-sizing: border-box !important;
    display: flex !important;
    flex: 1 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  html body.store-body #app > .store-layout:not(.auth-layout) > main.main > :not(footer.site-footer) {
    flex: 0 0 auto !important;
  }

  html body.store-body #app > .store-layout:not(.auth-layout) > main.main > footer.site-footer,
  html body.store-body #app > .store-layout:not(.auth-layout) > main.main > .site-footer,
  html body.store-body footer.site-footer.compact-footer.footer-v398,
  html body.store-body footer.site-footer.compact-footer.footer-v399 {
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin-top: auto !important;
    margin-bottom: 0 !important;
    padding-bottom: var(--mobile-v29-footer-clearance) !important;
  }

  html body.store-body #app > .store-layout:not(.auth-layout) > main.main > footer.site-footer::after,
  html body.store-body #app > .store-layout:not(.auth-layout) > main.main > .site-footer::after {
    content: none !important;
    display: none !important;
  }

  /* Auth routes have no footer or mobile dock. */
  html body.store-body #app > .store-layout.auth-layout,
  html body.store-body #app > .store-layout.auth-layout > main.main,
  html body.store-body .auth-shell-v928,
  html body.store-body .auth-v928-shell,
  html body.store-body .auth-page {
    box-sizing: border-box !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    margin-bottom: 0 !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }

  /* Dedicated documentation reader has its own shell and no storefront footer. */
  html body.store-body.docs-dedicated-body-v37 #app,
  html body.store-body.docs-dedicated-body-v37 .docs-boot-v37,
  html body.store-body.docs-dedicated-body-v37 .docs-shell,
  html body.store-body.docs-dedicated-body-v37 .docs-layout,
  html body.store-body.docs-dedicated-body-v37 .docs-reader-v37,
  html body.store-body.docs-dedicated-body-v37 .docs-skeleton-shell-v42 {
    box-sizing: border-box !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    margin-bottom: 0 !important;
    padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }

  /* No route is allowed to create an artificial document tail. */
  html body.store-body #app::after,
  html body.store-body #app > .store-layout::after,
  html body.store-body #app > .store-layout > main.main::after,
  html body.store-body [data-mobile-page-end-v29]::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.store-body.mobile-page-end-v29 {
    overscroll-behavior-y: none !important;
  }
}

@media (max-width: 430px) {
  :root {
    --mobile-v29-dock-height: 68px;
    --mobile-v29-dock-gap: 6px;
    --mobile-v29-footer-clearance: calc(var(--mobile-v29-dock-height) + var(--mobile-v29-dock-gap) + env(safe-area-inset-bottom) + 10px);
  }
}