fix(panel): improve module dashboards on small mobile

Switch KPI grids to 1-column and tighten spacing below 420px to prevent cramped layouts and overflow on small devices.

Made-with: Cursor

components/panel/audits/AuditsDashboard/audits-dashboard.css

@@ -103,6 +103,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-auditDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-auditDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 620px) {
   .maf-auditDash__thead {
     display: none;

components/panel/checklist/ChecklistDashboard/checklist-dashboard.css

@@ -103,6 +103,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-checkDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-checkDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 620px) {
   .maf-checkDash__thead {
     display: none;

components/panel/incidents/IncidentsDashboard/incidents-dashboard.css

@@ -88,6 +88,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-modDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-modDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 520px) {
   .maf-modDash {
     padding: 0.9rem 0.65rem 1.1rem;

components/panel/inspection/InspectionDashboard/inspection-dashboard.css

@@ -103,6 +103,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-inspDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-inspDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 620px) {
   .maf-inspDash__thead {
     display: none;

components/panel/permit/PermitDashboard/permit-dashboard.css

@@ -103,6 +103,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-permitDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-permitDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 520px) {
   .maf-permitDash {
     padding: 0.9rem 0.65rem 1.1rem;

components/panel/suggestion/SuggestionDashboard/suggestion-dashboard.css

@@ -107,6 +107,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-suggestDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-suggestDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 520px) {
   .maf-suggestDash {
     padding: 0.9rem 0.65rem 1.1rem;

components/panel/tracking/TrackingDashboard/tracking-dashboard.css

@@ -103,6 +103,17 @@
   }
 }
 
+@media (max-width: 420px) {
+  .maf-trackDash__kpis {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .maf-trackDash__grid {
+    gap: 10px;
+  }
+}
+
 @media (max-width: 520px) {
   .maf-trackDash {
     padding: 0.9rem 0.65rem 1.1rem;