/* ============================================================
   GoZaanstad — phone polish.

   Every rule here is scoped to <=768px, so desktop is untouched. The values come
   from measuring the live pages at 390x844 (iPhone width), not from guesswork:
   nav rows 448-509px wide on a 390px screen, tap targets down to 20px, labels at
   10.6px, and every input under 16px (which makes iOS Safari zoom the page).
   Loaded last so it wins ties against each page's own <style> block.
   ============================================================ */
@media (max-width: 768px) {

  /* iOS Safari zooms the whole page when a focused input is under 16px. */
  input, select, textarea { font-size: 16px !important; }

  /* 100vh includes the URL bar on iOS, so pages jump as it hides. svh tracks the
     visible viewport instead. */
  @supports (min-height: 100svh) {
    body { min-height: 100svh; }
  }

  /* Stop iOS inflating text in landscape. */
  html { -webkit-text-size-adjust: 100%; }

  /* The desktop nav rows overflow a phone (measured 448-509px wide). Navigation
     lives in the hamburger drawer on mobile — see js/mobile-nav.js. */
  .gz-nav-links, .gz-navlinks, .nav-links { display: none !important; }

  /* The injected EN/NL switch duplicates the drawer's own language row and crowded
     the bar enough to push the menu button off-screen (measured x=406 on a 390px
     viewport, i.e. untappable). Hidden here, still available inside the drawer. */
  .gzui-lang { display: none !important; }

  /* Belt and braces: the menu button must never be squeezed out, whatever else the
     bar holds. The brand truncates instead. */
  .nav-inner, .gz-nav-inner, .nav-container { flex-wrap: nowrap; }
  .nav-hamburger { flex: 0 0 auto; min-width: 44px; min-height: 44px; }
  a.brand, a.gz-brand, a.gz-logo {
    min-width: 0; flex-shrink: 1;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  }
  /* "Sign in" was wrapping to two lines once it got a 40px min-height. */
  .nav-user button, .nav-user a, .nav-actions button, .nav-actions a,
  .gz-nav-actions button, .gz-nav-actions a { white-space: nowrap; }

  /* ── Tap targets: 40px minimum (measured 20-37px) ───────────────────── */
  .chip, .fchip, .tab-btn, .mode-tab, .card-cta, .ctrl-btn, .panel-close,
  .rb-close, .lang-btn, .theme-btn, .gz-navlink, .gzc-b, .gzui-lang button,
  a.brand, a.gz-brand, a.gz-logo, .btn-sm,
  .nav-user button, .nav-user a, .nav-actions button, .nav-actions a {
    min-height: 40px;
  }
  /* Primary card action — Apple's 44px guideline */
  .card-cta { min-height: 44px; }
  .chip, .fchip, .tab-btn, .mode-tab, .gzc-b {
    padding-top: .55rem;
    padding-bottom: .55rem;
  }
  /* Inputs are for typing — give them a comfortable target. */
  input.search-in, .cp-field, .pe-field, .s-input { min-height: 44px; }

  /* Theme dots are deliberately tiny circles; grow the hit area, not the dot. */
  .theme-dot { position: relative; }
  .theme-dot::after {
    content: '';
    position: absolute;
    inset: -13px;
    border-radius: 50%;
  }

  /* ── Legibility: 12px floor on labels/pills (measured 10.6-11.5px) ───── */
  .cat-pill, .feat-star, .feat-pill, .pc-district, .pc-rv, .gem-pill, .cp-label,
  .fb-tag, .ec-date-m, .ec-organizer, .ec-price, .ev-label,
  .hs-rt-l, .card-type-badge, .diff-badge, .stat-lbl, .rb-stat-lbl,
  .gallery-tag,
  .hero-tag, .hs-l, .chip, .fchip, .panel-header {
    font-size: 12px !important;
  }

  /* Nothing may push the page sideways. */
  img, video, iframe, table, pre { max-width: 100%; }

  /* Momentum scrolling inside scrollable panels. */
  [class*="scroll"], .s-filters { -webkit-overflow-scrolling: touch; }
}
