/* Bangs Music Distro — document layout 2.0.0.
 * The document owns vertical scrolling. Shelves and open dialogs keep their
 * local scrolling. Do not put a fixed height or overflow:hidden on body.
 */
html,
body {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overscroll-behavior-x: none;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* The legacy base stylesheet sets html/body height:100%. A later homepage
 * rule also forces overflow-x:hidden on body, which computes overflow-y:auto.
 * Together they turn body into a second, viewport-height scrolling pane.
 * Grow with the content and contain horizontal overflow at the document root.
 */
html:root,
html:root > body {
  height: auto !important;
  max-height: none !important;
}

html:root {
  min-height: 100%;
  scrollbar-gutter: stable;
  overflow-x: hidden !important;
}

html:root > body {
  min-height: 100vh;
  overflow-x: visible !important;
}

@supports (min-height: 100dvh) {
  html:root > body {
    min-height: 100dvh;
  }
}

@supports (overflow-x: clip) {
  html:root {
    overflow-x: clip !important;
  }
}

/* Lock the document, including on older browsers without :has(). Its width
 * and scroll position stay intact; dialog content can still scroll locally.
 */
html:root:is(.bh48-modal-open, .bmd-player-modal-open, .bmd24-scroll-lock) {
  overflow-y: hidden !important;
}
@supports selector(html:has(dialog:modal)) {
  html:root:has(dialog:modal),
  html:root:has(#bmdNowPlaying:not([hidden])) {
    overflow-y: hidden !important;
  }
}

body > main,
#bmdMain,
.bh48-header,
.footer.bmd-footer-v51 {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}

/* Avoid automatic focus zoom changing the apparent width on phones. Native
 * pinch zoom remains available; the existing iOS guard limits shrink only. */
@media (max-width: 820px) {
  body :is(input[type="text"], input[type="search"], input[type="email"],
    input[type="tel"], input[type="password"], input[type="url"], textarea, select) {
    font-size: max(16px, 1em) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:root { scroll-behavior: auto; }
}