/* base-fixes.css
   Shared responsive fixes — link this in every page's <head>,
   before that page's own <style> block, so page-specific styles
   can still override these where needed. */

* {
  box-sizing: border-box;
}

html, body {
  max-width: 100%;
  overflow-x: hidden;
}

img, video {
  max-width: 100%;
  height: auto;
}

/* Prevent any fixed-width block from forcing horizontal scroll */
.page,
.content,
.card,
.section-card {
  max-width: 100%;
}

/* Use dynamic viewport height where supported, falls back safely */
.full-height {
  min-height: 100vh;
  min-height: 100dvh;
}

/* Flex rows should wrap on narrow screens instead of overflowing */
.quick-actions,
.assets-grid,
.bottom-nav {
  flex-wrap: wrap;
}

/* Bottom nav: pin to the real viewport instead of relying on position:sticky,
   which breaks and scrolls with the page when any ancestor's scroll context
   isn't set up exactly right. position:fixed always stays put. */
.bottom-nav {
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%);
  bottom: 0 !important;
  width: 100%;
  max-width: 480px;
  z-index: 100;
  /* extra bottom padding for iPhone home-bar / gesture area */
  padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

/* Stop page content from being hidden underneath the now-fixed nav */
.content {
  padding-bottom: 100px;
}