/* Global mobile layout — same containment/chrome rules as shop (flux) */

html:has(body.zv-dock-pad),
body.zv-dock-pad {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

body.zv-dock-pad img,
body.zv-dock-pad video,
body.zv-dock-pad canvas,
body.zv-dock-pad svg {
  max-width: 100%;
  height: auto;
}

body.zv-dock-pad img[src] {
  height: auto;
}

/* Containment: prevent grid/media blowout like pre-fix shop cards */
body.zv-dock-pad .zv-root,
body.zv-dock-pad .lx-root,
body.zv-dock-pad .vb-root,
body.zv-dock-pad .fx-root,
body.zv-dock-pad .tp-root,
body.zv-dock-pad .st-root,
body.zv-dock-pad .od-root,
body.zv-dock-pad .ng-root,
body.zv-dock-pad .ic-root,
body.zv-dock-pad .qz-root,
body.zv-dock-pad .rp-root,
body.zv-dock-pad .cv-root,
body.zv-dock-pad .kb-root,
body.zv-dock-pad .rs-root,
body.zv-dock-pad .cx-root,
body.zv-dock-pad .page-main,
body.zv-dock-pad [class$="-stage"],
body.zv-dock-pad [class$="-deck"],
body.zv-dock-pad [class$="-room"],
body.zv-dock-pad [class$="-board"],
body.zv-dock-pad [class$="-shell"],
body.zv-dock-pad [class*="-cascade"],
body.zv-dock-pad [class*="-wrap"] {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

body.zv-dock-pad [class*="-facet"],
body.zv-dock-pad [class*="-card"],
body.zv-dock-pad [class*="-tile"],
body.zv-dock-pad [class*="-panel"],
body.zv-dock-pad [class*="-plank"],
body.zv-dock-pad article,
body.zv-dock-pad section {
  max-width: 100%;
  min-width: 0;
}

@media (max-width: 959px) {
  /* Dock clearance on all page stages */
  body.zv-dock-pad .fx-stage,
  body.zv-dock-pad .od-stage,
  body.zv-dock-pad .ng-stage,
  body.zv-dock-pad .qz-stage,
  body.zv-dock-pad .vb-deck,
  body.zv-dock-pad .lx-orbit,
  body.zv-dock-pad .lx-deck,
  body.zv-dock-pad .st-room,
  body.zv-dock-pad .tp-board,
  body.zv-dock-pad .rp-deck,
  body.zv-dock-pad .kb-brief,
  body.zv-dock-pad .kb-grid,
  body.zv-dock-pad .rs-frame,
  body.zv-dock-pad .rs-board,
  body.zv-dock-pad .cv-board,
  body.zv-dock-pad .ic-deck,
  body.zv-dock-pad .cx-page,
  body.zv-dock-pad .cx-layout,
  body.zv-dock-pad .zv-stage,
  body.zv-dock-pad .page-main {
    padding-bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px)) !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.zv-dock-pad .cx-island {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.55rem !important;
    max-width: min(100% - 1.1rem, 1080px) !important;
    width: min(100% - 1.1rem, 1080px) !important;
    border-radius: 1rem !important;
    padding: 0.45rem 0.65rem !important;
  }

  body.zv-dock-pad .cx-island > div,
  body.zv-dock-pad .cx-island nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.15rem;
    min-width: 0;
  }

  body.zv-dock-pad .cx-island a {
    margin-left: 0.25rem !important;
    font-size: 0.76rem !important;
    white-space: nowrap;
  }

  /* One-row chrome (brand left, links right) — shop pattern */
  body.zv-dock-pad .fx-bar,
  body.zv-dock-pad .od-chrome,
  body.zv-dock-pad .ng-chrome,
  body.zv-dock-pad .qz-chrome,
  body.zv-dock-pad .vb-mast,
  body.zv-dock-pad .lx-chrome,
  body.zv-dock-pad .st-chrome,
  body.zv-dock-pad .tp-chrome,
  body.zv-dock-pad .rp-chrome,
  body.zv-dock-pad .kb-chrome,
  body.zv-dock-pad .rs-chrome,
  body.zv-dock-pad .cv-chrome,
  body.zv-dock-pad .ic-chrome,
  body.zv-dock-pad .cx-chrome {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.55rem !important;
    max-width: 100%;
    min-width: 0;
  }

  body.zv-dock-pad .fx-sig,
  body.zv-dock-pad .od-mark,
  body.zv-dock-pad .ng-mark,
  body.zv-dock-pad .qz-mark,
  body.zv-dock-pad .vb-mark,
  body.zv-dock-pad .lx-sigil,
  body.zv-dock-pad .lx-mark,
  body.zv-dock-pad .st-mark,
  body.zv-dock-pad .tp-mark,
  body.zv-dock-pad .rp-mark,
  body.zv-dock-pad .kb-mark,
  body.zv-dock-pad .rs-mark,
  body.zv-dock-pad .cv-mark,
  body.zv-dock-pad .ic-mark,
  body.zv-dock-pad .cx-mark {
    min-width: 0;
    flex: 1 1 auto;
    max-width: 100%;
  }

  body.zv-dock-pad .fx-sig span,
  body.zv-dock-pad .od-mark span,
  body.zv-dock-pad .ng-mark span,
  body.zv-dock-pad .qz-mark span,
  body.zv-dock-pad .vb-mark strong,
  body.zv-dock-pad .lx-sigil span,
  body.zv-dock-pad .lx-mark strong,
  body.zv-dock-pad .st-mark span,
  body.zv-dock-pad .tp-mark strong,
  body.zv-dock-pad .rp-mark strong,
  body.zv-dock-pad .kb-mark strong,
  body.zv-dock-pad .rs-mark span,
  body.zv-dock-pad .cv-mark span,
  body.zv-dock-pad .ic-mark span,
  body.zv-dock-pad .cx-mark strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.95rem !important;
  }

  body.zv-dock-pad .fx-bar-links,
  body.zv-dock-pad .od-chrome-links,
  body.zv-dock-pad .ng-chrome-links,
  body.zv-dock-pad .qz-chrome-links,
  body.zv-dock-pad .vb-mast-links,
  body.zv-dock-pad .lx-chrome-rail,
  body.zv-dock-pad .lx-chrome-links,
  body.zv-dock-pad .st-chrome-links,
  body.zv-dock-pad .tp-chrome-links,
  body.zv-dock-pad .rp-chrome-links,
  body.zv-dock-pad .kb-chrome-links,
  body.zv-dock-pad .rs-chrome-links,
  body.zv-dock-pad .cv-chrome-links,
  body.zv-dock-pad .ic-chrome-links,
  body.zv-dock-pad .cx-chrome-links,
  body.zv-dock-pad .cx-nav {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    max-width: 58%;
    justify-content: flex-end !important;
    gap: 0.08rem !important;
    min-width: 0;
  }

  body.zv-dock-pad .fx-bar-links a,
  body.zv-dock-pad .od-chrome-links a,
  body.zv-dock-pad .ng-chrome-links a,
  body.zv-dock-pad .qz-chrome-links a,
  body.zv-dock-pad .vb-mast-links a,
  body.zv-dock-pad .lx-chrome-rail a,
  body.zv-dock-pad .lx-chrome-links a,
  body.zv-dock-pad .st-chrome-links a,
  body.zv-dock-pad .tp-chrome-links a,
  body.zv-dock-pad .rp-chrome-links a,
  body.zv-dock-pad .kb-chrome-links a,
  body.zv-dock-pad .rs-chrome-links a,
  body.zv-dock-pad .cv-chrome-links a,
  body.zv-dock-pad .ic-chrome-links a,
  body.zv-dock-pad .cx-chrome-links a,
  body.zv-dock-pad .cx-nav a {
    font-size: 0.76rem !important;
    padding: 0.36rem 0.45rem !important;
    white-space: nowrap;
  }

  /* Decorative washes must not widen layout */
  body.zv-dock-pad .lx-aura,
  body.zv-dock-pad .rp-tide,
  body.zv-dock-pad .kb-wash,
  body.zv-dock-pad .vb-scan,
  body.zv-dock-pad .od-mesh,
  body.zv-dock-pad .tp-grid-bg,
  body.zv-dock-pad .fx-noise,
  body.zv-dock-pad .st-wash,
  body.zv-dock-pad .st-haze,
  body.zv-dock-pad .ng-haze,
  body.zv-dock-pad .qz-haze,
  body.zv-dock-pad .cv-haze,
  body.zv-dock-pad .rs-glow,
  body.zv-dock-pad .rs-haze,
  body.zv-dock-pad .ic-haze {
    left: 0 !important;
    right: 0 !important;
    max-width: 100% !important;
    width: auto !important;
  }

  /* Scrollable chip/filter rows stay inside viewport */
  body.zv-dock-pad .fx-dial-track,
  body.zv-dock-pad .vb-radar-track,
  body.zv-dock-pad .vb-suggest,
  body.zv-dock-pad .rs-jump,
  body.zv-dock-pad .rs-sort-track,
  body.zv-dock-pad .rs-pills,
  body.zv-dock-pad .rs-sort,
  body.zv-dock-pad .st-steps,
  body.zv-dock-pad .lx-seg,
  body.zv-dock-pad [class*="-chips"],
  body.zv-dock-pad [class*="-pills"],
  body.zv-dock-pad [class*="-rail-track"] {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  body.zv-dock-pad .fx-dial-track::-webkit-scrollbar,
  body.zv-dock-pad .vb-radar-track::-webkit-scrollbar,
  body.zv-dock-pad .vb-suggest::-webkit-scrollbar,
  body.zv-dock-pad .rs-jump::-webkit-scrollbar,
  body.zv-dock-pad .rs-sort-track::-webkit-scrollbar,
  body.zv-dock-pad .st-steps::-webkit-scrollbar,
  body.zv-dock-pad .lx-seg::-webkit-scrollbar {
    display: none;
  }

  /* Catalog / cart / account cards */
  body.zv-dock-pad .rs-tile,
  body.zv-dock-pad .rs-tiles,
  body.zv-dock-pad .rs-band,
  body.zv-dock-pad .st-plank,
  body.zv-dock-pad .st-layout,
  body.zv-dock-pad .st-settle,
  body.zv-dock-pad .lx-gate,
  body.zv-dock-pad .lx-glass,
  body.zv-dock-pad .lx-suite,
  body.zv-dock-pad .lx-orbit,
  body.zv-dock-pad .qz-board,
  body.zv-dock-pad .qz-lens {
    max-width: 100%;
    min-width: 0;
  }

  body.zv-dock-pad .st-plank-media,
  body.zv-dock-pad .rs-tile-media,
  body.zv-dock-pad .qz-film,
  body.zv-dock-pad .qz-hero-media {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  /* Media blocks inside cards */
  body.zv-dock-pad [class*="-media"],
  body.zv-dock-pad [class*="-photo"],
  body.zv-dock-pad [class*="-figure"] {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  body.zv-dock-pad [class*="-media"] img,
  body.zv-dock-pad [class*="-photo"] img,
  body.zv-dock-pad [class*="-figure"] img {
    width: 100%;
    max-width: 100%;
    display: block;
    object-fit: cover;
  }

  /* Readable titles — avoid clipped gradient text on narrow screens */
  body.zv-dock-pad .fx-fluid,
  body.zv-dock-pad .lx-fluid,
  body.zv-dock-pad [class*="-fluid"] {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    color: inherit !important;
  }

  /* Forms / buttons stay inside */
  body.zv-dock-pad input,
  body.zv-dock-pad textarea,
  body.zv-dock-pad select,
  body.zv-dock-pad button,
  body.zv-dock-pad .st-btn,
  body.zv-dock-pad [class*="-btn"] {
    max-width: 100%;
  }

  body.zv-dock-pad form {
    max-width: 100%;
    min-width: 0;
  }

  /* Back-to-top above dock */
  body.zv-dock-pad .zv-plinth-top.is-float {
    bottom: calc(6.35rem + env(safe-area-inset-bottom, 0px)) !important;
    right: 0.85rem !important;
  }
}

@media (max-width: 420px) {
  body.zv-dock-pad .fx-bar-links a,
  body.zv-dock-pad .od-chrome-links a,
  body.zv-dock-pad .ng-chrome-links a,
  body.zv-dock-pad .qz-chrome-links a,
  body.zv-dock-pad .vb-mast-links a,
  body.zv-dock-pad .lx-chrome-links a,
  body.zv-dock-pad .st-chrome-links a,
  body.zv-dock-pad .tp-chrome-links a,
  body.zv-dock-pad .rp-chrome-links a,
  body.zv-dock-pad .kb-chrome-links a,
  body.zv-dock-pad .rs-chrome-links a,
  body.zv-dock-pad .cv-chrome-links a,
  body.zv-dock-pad .ic-chrome-links a,
  body.zv-dock-pad .cx-chrome-links a {
    padding: 0.32rem 0.38rem !important;
    font-size: 0.72rem !important;
  }
}