/* Checklist #21: responsive fixes for Admin + member pages */
@media (max-width: 900px) {
  .stat-cards { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important; }
  form div[style*="grid-template-columns"], form div[style*="display:grid"] { grid-template-columns: 1fr !important; }
  div[style*="display:flex"] { flex-wrap: wrap; }
}
@media (max-width: 720px) {
  .container, main { max-width: 100vw; overflow-x: hidden; }
  table td, table th { word-break: break-word; }
  h1, h2, h3, h4 { overflow-wrap: break-word; }
  .btn, button { max-width: 100%; }
  input, select, textarea { max-width: 100%; }
}
/* Wide tables scroll instead of widening the page */
.table-scroll-wrap { overflow-x: auto; max-width: 100%; }

/* Follow-up #1: no crossing line over MEMBERSHIP / NEW ARRIVALS banner labels */
.section-label[style*="padding-left:0"]::before { display: none !important; }

/* Checklist #21: PV level inputs always keep readable width (wrap, never squeeze) */
form div.pvLevelGrid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)) !important; }
form div.pvLevelGrid input { width: 100% !important; text-align: center; }

/* Off-canvas drawer: closed = not rendered (zero page scroll), open = slide-in */
.mobile-menu { display: none; }
.mobile-menu.open { display: flex; animation: drawerIn .28s cubic-bezier(.4,0,.2,1); }
@keyframes drawerIn { from { transform: translateX(100%); } to { transform: translateX(0); } }

/* Header neat-fit: 701-1480px the search moves to its own full-width row
   (logo + compact nav + icons on row 1, search pill on row 2 - no squeezing) */
@media (max-width: 1480px) and (min-width: 701px) {
  .header-inner { flex-wrap: wrap; row-gap: .5rem; }
  .header-search { flex: 1 1 100%; order: 10; max-width: none; margin: 0; min-width: 0; }
  .main-nav { margin-left: auto; }
  .main-nav a { padding: .5rem .5rem; font-size: .75rem; letter-spacing: 0; }
  .header-icons { margin-left: 0; }
}
