/* Phone-first refinements for the Humble Farm installable web app. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 320px; overscroll-behavior-x: none; }
button, a, input, select, textarea { touch-action: manipulation; }
button, .button, .text-button, .nav-register { min-height: 44px; }
input, select, textarea { scroll-margin-block: 18vh; }
.dashboard-tabs { scrollbar-width: thin; scrollbar-color: #a8ad9a transparent; }
.data-table-wrap { max-width: 100%; -webkit-overflow-scrolling: touch; }
.portal-shell, .section-shell, .panel, .example-picker, .farm-example-banner { min-width: 0; }
.farm-form input, .farm-form select, .farm-form textarea,
.farm-controls input, .farm-controls select { font-size: 16px; }
.pwa-install-button { display: none; }
.pwa-install-button[hidden] { display: none; }

@media (max-width: 650px) {
  body { padding-bottom: env(safe-area-inset-bottom); }
  .site-header { padding-left: max(5%, env(safe-area-inset-left)); padding-right: max(5%, env(safe-area-inset-right)); }
  .site-header nav.open { max-height: calc(100dvh - 77px); overflow-y: auto; overscroll-behavior: contain; }
  .nav-logins { align-items: stretch; }
  .nav-logins > * { min-height: 46px; }
  .cart-toggle { min-width: 44px; min-height: 44px; }
  .dashboard-tabs {
    position: sticky; top: 0; z-index: 8; display: flex; gap: 8px;
    overflow-x: auto; overflow-y: hidden; white-space: nowrap;
    padding: 10px 2px; margin: 12px 0 18px; background: var(--paper);
    overscroll-behavior-x: contain; scroll-snap-type: x proximity;
  }
  .dashboard-tabs button { flex: 0 0 auto; min-height: 44px; padding: 10px 14px; scroll-snap-align: start; }
  .farm-task-filter select, .example-picker select { min-height: 48px; }
  .task-row { min-height: 54px; }
  .task-row input[type="checkbox"] { width: 22px; height: 22px; flex: 0 0 22px; }
  .farm-count-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .farm-count-grid input { min-height: 48px; }
  .farm-form textarea { min-height: 96px; }
  .farm-form .button, .farm-export .button, .weather-controls .button { width: 100%; min-height: 48px; justify-content: center; }
  .data-table-wrap table { min-width: 600px; }
  .weather-week { min-width: 680px; }
  .farm-export { display: grid; gap: 10px; }
  dialog { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px - env(safe-area-inset-top)); overflow-y: auto; overscroll-behavior: contain; }
  .login-dialog, .cart-dialog, .merch-dialog, .weather-dialog { padding-bottom: max(26px, env(safe-area-inset-bottom)); }
}

@media (max-width: 380px) {
  .portal-shell { padding-left: 4%; padding-right: 4%; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .metric { padding: 14px 11px; }
  .metric strong { font-size: 30px; }
  .farm-count-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
