/* ═══════════════════════════════════════════════════════════════════════════
   GDU website — the phone layer (5 Nov 2026)

   The same design on every phone, the way DIS does it: nothing is redesigned or hidden, the
   layout only adapts. Loaded last on every public page, so it wins over the page's own styles.
     · fits from the smallest phones (320 px) up: nothing wider than the screen
     · every link and button at least 44 px tall to tap
     · inputs at 16 px, so iPhones don't zoom the page when one is tapped
     · clear of the notch and the home bar (viewport-fit=cover + safe areas)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Every page ─────────────────────────────────────────────────────────── */
html { -webkit-tap-highlight-color: rgba(240, 200, 66, .25); }
img, video, iframe, svg { max-width: 100%; }

/* Clear of the notch (phones held sideways) and the home bar */
.gh-wrap { padding-left: max(var(--gutter, 1.25rem), env(safe-area-inset-left, 0px)); padding-right: max(var(--gutter, 1.25rem), env(safe-area-inset-right, 0px)); }
.gh-sheet-in { padding-bottom: calc(2.5rem + env(safe-area-inset-bottom, 0px)); }
footer, .gf { padding-bottom: env(safe-area-inset-bottom, 0px); }

@media (max-width: 768px) {
  /* 16 px in every field: iOS zooms the page into anything smaller when it is tapped */
  input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; }
  /* Long words (agency and county names) wrap instead of pushing the page sideways */
  main h1, main h2, main h3, main h4 { overflow-wrap: break-word; }
  main p, main li, main dd, main span { overflow-wrap: break-word; }
}

/* The header on the smallest phones: the two marks a little smaller so the menu button fits (logos only scaled) */
@media (max-width: 380px) {
  .gh-bar { gap: .5rem; }
  .gh-brand { flex-shrink: 1; min-width: 0; gap: .6rem; }
  .gh-gdu { max-width: 42vw; object-fit: contain; overflow: hidden; }
  .gh-arms { height: 44px; }
  .gh-gdu { height: 34px; }
  .gh-rule { height: 26px; }
  .gh-toggle { width: 44px; height: 44px; flex-shrink: 0; }
}

/* ── Homepage ───────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .hero-links { gap: .25rem 1.25rem; }
  .hero-links a { display: inline-flex; align-items: center; min-height: 44px; padding-bottom: 0; }
  /* The map's key sits under the map instead of over it */
  .kmap { margin-bottom: 3rem; }
  .kmap-legend { position: absolute; top: auto; bottom: -2.6rem; left: 0; right: 0; margin-top: 0; max-width: 100%; }
  .kmap-hint { display: none; }
  .ba-tab { min-height: 48px; }
  .csort button, .gl-tabs button, #rmore, .voices-nav button { min-height: 44px; }
}
@media (max-width: 480px) {
  /* All 47 counties: the tile codes and counts stay readable on a small screen */
  .cm-map { gap: 3px; }
  .cm-t { padding: 3px; border-radius: 6px; }
  .cm-t .c { font-size: 10px; letter-spacing: 0; }
  .cm-t .n { font-size: 11px; }
}

/* ── Pillars ────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ach button { min-height: 44px; }
}

/* ── Scorecard ──────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .ch-head { grid-template-columns: 1fr; gap: .6rem; }
  .ch-no { font-size: 3.4rem; }
  .ch-t h2 { font-size: clamp(1.7rem, 8.4vw, 2.2rem); letter-spacing: -.03em; }
}
@media (max-width: 768px) {
  .more { min-height: 44px; }
  .search input { min-height: 44px; }
  .chnav a { min-height: 44px; }
}

/* ── Delivery Corner ────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  /* County and order side by side, search on its own line: nothing cut off */
  .tbar .tools { flex-wrap: wrap; width: 100%; }
  .tbar .tools select { flex: 1 1 calc(50% - .25rem); max-width: none !important; min-width: 0; height: 44px; }
  .tbar .tools input { flex: 1 1 100%; width: auto !important; min-width: 0; height: 44px; }
  .chips .chip { min-height: 44px; }
  .sstats b { font-size: 1.25rem; overflow-wrap: break-word; }
}

/* ── About GDU ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .fig a, .who-link { min-height: 44px; }
}
@media (max-width: 480px) {
  /* Long button labels wrap rather than run off the screen */
  .btn { white-space: normal; height: auto; min-height: 52px; padding-top: .7rem; padding-bottom: .7rem; text-align: center; line-height: 1.3; }
}

/* ── The Brief, 404 ─────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .page-btn { min-width: 44px; min-height: 44px; }
  .quick-link { min-height: 44px; }
}
