/* Mobile / installed-app polish (loaded after app.css; no Tailwind rebuild needed). */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
a, button, input, select, textarea, label, summary { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
/* iOS Safari zooms the whole page when a field with a font smaller than 16px gets focus: keep fields at 16px on phones and tablets */
@media (max-width: 1023px) {
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]), select, textarea { font-size: 16px; }
}
/* never let a wide child push the page sideways (iOS shows the page "zoomed out" when that happens) */
body { overflow-x: clip; }
img, video, canvas { max-width: 100%; height: auto; }
/* installed app (standalone): no browser bar, so keep content out of the notch / home-indicator area */
@media (display-mode: standalone) {
  body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); overscroll-behavior-y: contain; }
}
/* install hint */
.pwa-hint { position: fixed; z-index: 60; inset-inline: 12px; bottom: calc(72px + env(safe-area-inset-bottom)); background: #fff; color: #222; border: 1px solid #e5e7eb;
  border-radius: 16px; box-shadow: 0 8px 30px rgba(0,0,0,.18); padding: 12px 14px; font-size: 14px; line-height: 1.8; display: none; }
.pwa-hint.show { display: block; }
.pwa-hint b { color: #B8892B; }
.pwa-hint .row { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; }
.pwa-hint button { border: 0; border-radius: 10px; padding: 6px 14px; font-size: 14px; background: #B8892B; color: #fff; }
.pwa-hint .x { background: transparent; color: #888; font-size: 20px; padding: 0 4px; }
@media (min-width: 1024px) { .pwa-hint { display: none !important; } }
/* bottom navigation: five equal columns even on a 320px phone (labels shrink instead of widening the page) */
nav[aria-label="ناوبری موبایل"] ul { grid-template-columns: repeat(5, minmax(0, 1fr)); }
nav[aria-label="ناوبری موبایل"] a { min-width: 0; padding-inline: 2px; white-space: nowrap; }
nav[aria-label="ناوبری موبایل"] li { min-width: 0; text-align: center; }
@media (max-width: 340px) { nav[aria-label="ناوبری موبایل"] ul { font-size: 10px; } }
/* product lists: the sort bar must be allowed to shrink (a 16px select with long option names pushed the page wider than a 320px phone) */
#filter-form > * { min-width: 0; }
#filter-form select { max-width: 10.5rem; text-overflow: ellipsis; }
#filter-form > div:first-of-type { flex-wrap: wrap; row-gap: 6px; }
/* grid items may shrink below their content (a long file-input label / wide table must not stretch the whole page) */
main .grid > * { min-width: 0; }
input[type=file] { max-width: 100%; }