Add store items pagination and fix modal backdrop blur across dashboards.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/super-admin/src/components/ConfirmDeleteModal.module.css

@@ -1,16 +1,28 @@
 .overlay {
   position: fixed;
   inset: 0;
-  background: rgba(127, 29, 29, 0.28);
-  backdrop-filter: blur(10px);
-  -webkit-backdrop-filter: blur(10px);
+  isolation: isolate;
+  background: transparent;
   display: flex;
   align-items: center;
   justify-content: center;
-  z-index: 300;
+  z-index: 200;
   padding: 20px;
 }
 
+/* Tint + blur on ::before so opacity animations on .overlay cannot disable backdrop-filter. */
+.overlay::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  pointer-events: none;
+  background: rgba(127, 29, 29, 0.28);
+  backdrop-filter: blur(var(--modal-overlay-blur));
+  -webkit-backdrop-filter: blur(var(--modal-overlay-blur));
+}
+
+
 .modal {
   position: relative;
   width: 100%;
@@ -105,13 +117,8 @@
   color: #ef4444;
 }
 
-.overlayIn { animation: overlayFadeIn 0.22s ease forwards; }
-.overlayOut { animation: overlayFadeOut 0.22s ease forwards; }
 .modalIn { animation: modalFadeIn 0.25s ease forwards; }
 .modalOut { animation: modalFadeOut 0.22s ease forwards; }
-
-@keyframes overlayFadeIn { from { opacity: 0; } to { opacity: 1; } }
-@keyframes overlayFadeOut { from { opacity: 1; } to { opacity: 0; } }
 @keyframes modalFadeIn {
   from { opacity: 0; transform: translateY(12px) scale(0.98); }
   to { opacity: 1; transform: translateY(0) scale(1); }

apps/super-admin/src/components/Modal.module.css

@@ -1,9 +1,8 @@
 .overlay {
   position: fixed;
   inset: 0;
-  background: rgba(15, 23, 42, 0.32);
-  backdrop-filter: blur(10px);
-  -webkit-backdrop-filter: blur(10px);
+  isolation: isolate;
+  background: transparent;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -11,6 +10,19 @@
   padding: 20px;
 }
 
+/* Tint + blur on ::before so opacity animations on .overlay cannot disable backdrop-filter. */
+.overlay::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  pointer-events: none;
+  background: var(--modal-overlay-bg);
+  backdrop-filter: blur(var(--modal-overlay-blur));
+  -webkit-backdrop-filter: blur(var(--modal-overlay-blur));
+}
+
+
 .modal {
   width: 100%;
   max-width: 520px;

apps/super-admin/src/index.css

@@ -29,6 +29,8 @@
   --radius: 16px;
   --radius-sm: 12px;
   --blur-glass: 28px;
+  --modal-overlay-bg: rgba(15, 23, 42, 0.4);
+  --modal-overlay-blur: 12px;
   --select-arrow-size: 16px;
   --select-arrow-offset: 12px;
   --select-padding-end: 2.5rem;