/* ==========================================================================
   popup-base.css — shared mobile-first foundation for every popup/modal.

   Audit ref (audit/mobile.md):
     - CC-1: body scroll-lock when any popup is open
     - CC-3: env(safe-area-inset-*) padding on bottom edge
     - CC-7: fullscreen-on-mobile pattern (≤480px) for floating-card popups

   Loaded once (via `_confirm_popup.html`, which is included on every page
   that uses the shared header). Popup-specific stylesheets cascade over
   these utility rules; nothing here changes desktop visuals.
   ========================================================================== */

/* Body scroll-lock. Activated by `window.PopupBase.lock(name)`. The class
   approach (rather than inline style) lets popup CSS cascade `overflow`/
   `touch-action` overrides if a popup ever needs background scroll
   (none currently do). */
html.popup-locked,
body.popup-locked {
  overflow: hidden !important;
  touch-action: none !important;
  /* iOS Safari: prevent rubber-banding behind the modal. */
  overscroll-behavior: none;
}

/* CSS custom property published by popup-base.js when iOS soft-keyboard
   reduces the visual viewport. Popup shells should subtract this from
   their max-height (instead of using `100vh`) so the keyboard never
   buries action buttons. Defaults to 0 so nothing changes when the
   keyboard is closed. */
:root {
  --popup-keyboard-inset: 0px;
}

/* Utility class popup shells can opt into. Combines the modern dynamic
   viewport unit, safe-area-inset, and keyboard offset into one rule. */
.popup-mobile-fullscreen {
  width: 100vw !important;
  height: calc(100dvh - var(--popup-keyboard-inset, 0px)) !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  padding-top: env(safe-area-inset-top, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  padding-left: env(safe-area-inset-left, 0px);
}

/* iOS momentum scroll + overscroll containment for inner scroll panes
   inside popups. Apply to any element that overflows internally. */
.popup-scroll-pane {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}