/* ==========================================================================
   Responsive overrides (mobile-first) — v2025-09-17
   Breakpoints: 480 / 768 / 1024 / 1280
   ========================================================================== */

/* Base: mobile first */
.container, .wrap{ padding-left:16px; padding-right:16px }

/* Cards stacking */
.dash-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px }
@media (max-width:1024px){ .dash-grid{ gap:10px } }
@media (max-width:900px){ .dash-grid{ grid-template-columns:1fr } }

/* Tables: horizontal scroll on small screens */
.table-wrap{ overflow:auto; -webkit-overflow-scrolling:touch }
.table-wrap table{ min-width:720px }

/* Forms */
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
@media (max-width:768px){ .form-row{ grid-template-columns:1fr } }
input, select, textarea{ max-width:100% }

/* Header/Menu vertical: full width on mobile */
.header_menu_vertical, .menu-vertical, .sidebar{
  width:100%;
}
@media (min-width:981px){
  .header_menu_vertical, .menu-vertical, .sidebar{ width:auto }
}

/* Hero spacing */
.hero, .hero-wrap{ padding-top: clamp(24px, 6vw, 48px); padding-bottom: clamp(16px, 4vw, 32px) }

/* Utilities */
.hide-on-mobile{ display:none !important }
@media (min-width:768px){ .hide-on-mobile{ display:revert !important } }
.show-on-mobile{ display:block !important }
@media (min-width:768px){ .show-on-mobile{ display:none !important } }

/* Inventory grid sizing */
.inventory-grid{ grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)) }
@media (min-width:1024px){ .inventory-grid{ grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)) } }