/*
 * iPhone and touch-screen refinements. Loaded on customer and phone-staff pages.
 * Desktop is unaffected: touch sizing only applies to coarse pointers, and layout
 * changes only apply on narrow screens.
 */

/* Safari: no text auto-resizing on rotate, no grey flash on tap, no delayed taps */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none; }
a, button, [role="button"], label, .btn { touch-action: manipulation; }

/* Stop iPhone Safari zooming in when a field is tapped (it zooms when text is under 16px) */
@media (pointer: coarse) {
  input, select, textarea { font-size: 16px !important; }
}

/* Touch targets: at least 44 x 44 px (Apple's guideline) on touch screens */
@media (pointer: coarse) {
  button, [role="button"], .info-link, .leave-btn, #leaveBtn, #checkStatusLink,
  .seg-btn, .sheet-close, .qf-chip, .chip, .filter-chip {
    min-height: 44px;
    min-width: 44px;
  }
  a.footer-brand, a.qf-brand, a.nav-link, a.see-all, .section-head a, .qf-section-title a, .view-all {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
  }
  .info-link, .leave-btn, #leaveBtn, #checkStatusLink { display: inline-flex; align-items: center; padding: 10px 6px; }
  .sheet-close { width: 44px; height: 44px; }
}

/* Safe areas: keep bars clear of the notch, the rounded corners and the home indicator */
.bottom-nav, .qf-bottom-nav {
  box-sizing: border-box;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.bottom-nav { height: calc(var(--nav-h, 64px) + env(safe-area-inset-bottom, 0px)); }
.action-bar, .sheet-footer { padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
.sheet { padding-bottom: env(safe-area-inset-bottom, 0px); max-height: 90vh; max-height: 90dvh; }

@supports (padding: max(0px)) {
  body { padding-left: max(0px, env(safe-area-inset-left)); padding-right: max(0px, env(safe-area-inset-right)); }
}

/* Phone widths: use the full screen instead of a floating card */
@media (max-width: 600px) {
  .card {
    max-width: none !important;
    min-height: 100dvh;
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .bg-scene .orb { opacity: 0.35; }
  .toast-container { left: 16px; right: 16px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); align-items: center; }
  .toast-container > * { max-width: 100%; }
}

/* Keep modals and sheets from scrolling the page behind them */
.modal-overlay, .sheet-backdrop, .sheet { overscroll-behavior: contain; }