@amogads/ui 1.1.5 → 1.1.6

package/dist/index.js

@@ -390,6 +390,7 @@ __export(design_system_exports, {
   buttonVariants: () => buttonVariants,
   downloadQrCode: () => downloadQrCode,
   formatBytes: () => formatBytes,
+  formatTimeAgo: () => formatTimeAgo,
   getFileCategoryTheme: () => getFileCategoryTheme,
   navigationMenuTriggerStyle: () => navigationMenuTriggerStyle,
   sidebarData: () => sidebarData2,
@@ -11390,245 +11391,198 @@ function AiChatHeader({
 }
 
 // src/design-system/components/files/file-card-item.tsx
-var import_react17 = __toESM(require("react"));
 var import_lucide_react48 = require("lucide-react");
-var import_date_fns3 = require("date-fns");
 var import_jsx_runtime94 = require("react/jsx-runtime");
-function getFileCategoryTheme(category) {
-  switch (category) {
-    case "Pdf":
-      return {
-        bg: "bg-red-500/10 dark:bg-red-950/40",
-        text: "text-red-600 dark:text-red-400",
-        border: "border-red-200/40 dark:border-red-900/40",
-        gradient: "from-red-500/20 to-orange-500/10"
-      };
-    case "Doc":
-      return {
-        bg: "bg-blue-500/10 dark:bg-blue-950/40",
-        text: "text-blue-600 dark:text-blue-400",
-        border: "border-blue-200/40 dark:border-blue-900/40",
-        gradient: "from-blue-500/20 to-indigo-500/10"
-      };
-    case "Xls":
-    case "Csv":
-      return {
-        bg: "bg-emerald-500/10 dark:bg-emerald-950/40",
-        text: "text-emerald-600 dark:text-emerald-400",
-        border: "border-emerald-200/40 dark:border-emerald-900/40",
-        gradient: "from-emerald-500/20 to-teal-500/10"
-      };
-    case "Images":
-      return {
-        bg: "bg-amber-500/10 dark:bg-amber-950/40",
-        text: "text-amber-600 dark:text-amber-400",
-        border: "border-amber-200/40 dark:border-amber-900/40",
-        gradient: "from-amber-500/20 to-yellow-500/10"
-      };
-    case "Videos":
-      return {
-        bg: "bg-purple-500/10 dark:bg-purple-950/40",
-        text: "text-purple-600 dark:text-purple-400",
-        border: "border-purple-200/40 dark:border-purple-900/40",
-        gradient: "from-purple-500/20 to-pink-500/10"
-      };
-    case "Zip":
-      return {
-        bg: "bg-orange-500/10 dark:bg-orange-950/40",
-        text: "text-orange-600 dark:text-orange-400",
-        border: "border-orange-200/40 dark:border-orange-900/40",
-        gradient: "from-orange-500/20 to-amber-500/10"
-      };
-    default:
-      return {
-        bg: "bg-indigo-500/10 dark:bg-indigo-950/40",
-        text: "text-indigo-600 dark:text-indigo-400",
-        border: "border-indigo-200/40 dark:border-indigo-900/40",
-        gradient: "from-indigo-500/20 to-purple-500/10"
-      };
-  }
-}
-function formatBytes(bytes) {
+function formatBytes(bytes, decimals = 1) {
   if (!bytes || bytes === 0) return "0 B";
   const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
   const sizes = ["B", "KB", "MB", "GB", "TB"];
   const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+}
+function getFileCategoryTheme(category) {
+  const cat = (category || "").toLowerCase();
+  if (cat.includes("pdf")) {
+    return {
+      name: "Pdf",
+      icon: import_lucide_react48.FileText,
+      badgeColor: "bg-red-500/10 text-red-600 dark:text-red-400 border-red-200/50",
+      iconColor: "text-red-500",
+      bgColor: "bg-red-50 dark:bg-red-950/30"
+    };
+  }
+  if (cat.includes("doc") || cat.includes("word") || cat.includes("txt")) {
+    return {
+      name: "Doc",
+      icon: import_lucide_react48.FileText,
+      badgeColor: "bg-blue-500/10 text-blue-600 dark:text-blue-400 border-blue-200/50",
+      iconColor: "text-blue-500",
+      bgColor: "bg-blue-50 dark:bg-blue-950/30"
+    };
+  }
+  if (cat.includes("xls") || cat.includes("csv") || cat.includes("sheet")) {
+    return {
+      name: "Spreadsheet",
+      icon: import_lucide_react48.FileSpreadsheet,
+      badgeColor: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400 border-emerald-200/50",
+      iconColor: "text-emerald-500",
+      bgColor: "bg-emerald-50 dark:bg-emerald-950/30"
+    };
+  }
+  if (cat.includes("image") || cat.includes("img") || cat.includes("png") || cat.includes("jpg")) {
+    return {
+      name: "Images",
+      icon: import_lucide_react48.Image,
+      badgeColor: "bg-amber-500/10 text-amber-600 dark:text-amber-400 border-amber-200/50",
+      iconColor: "text-amber-500",
+      bgColor: "bg-amber-50 dark:bg-amber-950/30"
+    };
+  }
+  if (cat.includes("video") || cat.includes("mp4") || cat.includes("mov")) {
+    return {
+      name: "Videos",
+      icon: import_lucide_react48.Film,
+      badgeColor: "bg-purple-500/10 text-purple-600 dark:text-purple-400 border-purple-200/50",
+      iconColor: "text-purple-500",
+      bgColor: "bg-purple-50 dark:bg-purple-950/30"
+    };
+  }
+  if (cat.includes("zip") || cat.includes("rar") || cat.includes("tar")) {
+    return {
+      name: "Archives",
+      icon: import_lucide_react48.Archive,
+      badgeColor: "bg-orange-500/10 text-orange-600 dark:text-orange-400 border-orange-200/50",
+      iconColor: "text-orange-500",
+      bgColor: "bg-orange-50 dark:bg-orange-950/30"
+    };
+  }
+  return {
+    name: "Other",
+    icon: import_lucide_react48.File,
+    badgeColor: "bg-muted text-muted-foreground border-border/80",
+    iconColor: "text-muted-foreground",
+    bgColor: "bg-muted/40"
+  };
+}
+function formatTimeAgo(dateString) {
+  if (!dateString) return "recently";
+  try {
+    const d = new Date(dateString);
+    const diff = (Date.now() - d.getTime()) / 1e3;
+    if (diff < 60) return "just now";
+    if (diff < 3600) return `${Math.floor(diff / 60)} mins ago`;
+    if (diff < 86400) {
+      const hours = Math.floor(diff / 3600);
+      return `${hours} hour${hours > 1 ? "s" : ""} ago`;
+    }
+    const days = Math.floor(diff / 86400);
+    return `${days} day${days > 1 ? "s" : ""} ago`;
+  } catch {
+    return "recently";
+  }
 }
 function FileCardItem({
   file,
-  isSelected = false,
   viewMode = "grid",
+  isSelected = false,
   onSelect,
   onPreview,
   onDownload,
+  onDelete,
   onCopyLink,
   onRename,
-  onDelete,
   onShare,
   className
 }) {
   const theme = getFileCategoryTheme(file.category);
-  const isImage = file.category === "Images" || /\.(jpg|jpeg|png|webp|svg|gif)$/i.test(file.fileName);
-  const isVideo = file.category === "Videos" || /\.(mp4|webm|mov|mkv)$/i.test(file.fileName);
-  const isPdf = file.category === "Pdf" || /\.pdf$/i.test(file.fileName);
-  const isSheet = file.category === "Xls" || file.category === "Csv" || /\.(xls|xlsx|csv)$/i.test(file.fileName);
-  const isZip = file.category === "Zip" || /\.(zip|rar|7z|tar|gz)$/i.test(file.fileName);
-  const updatedTimeDisplay = import_react17.default.useMemo(() => {
-    if (!file.updatedAt) return "Recently";
-    try {
-      const d = new Date(file.updatedAt);
-      return (0, import_date_fns3.formatDistanceToNow)(d, { addSuffix: true });
-    } catch {
-      return "Recently";
-    }
-  }, [file.updatedAt]);
+  const isImage = theme.name === "Images" || file.fileName.match(/\.(jpg|jpeg|png|webp|gif|svg)$/i) || file.fileUrl && file.fileUrl.startsWith("http") && !file.fileUrl.endsWith(".pdf");
   if (viewMode === "table") {
     return /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
       "tr",
       {
-        onClick: () => onSelect?.(file),
         className: cn(
-          "group border-b border-border/50 transition-colors hover:bg-muted/40 cursor-pointer",
+          "group border-b border-border/60 transition-colors hover:bg-muted/40 text-xs",
           isSelected && "bg-primary/5",
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-3 px-4", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-2.5 px-3", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center gap-2.5 min-w-0", children: [
             /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
               "div",
               {
                 className: cn(
-                  "flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border shadow-2xs",
-                  theme.bg,
-                  theme.border
+                  "flex h-7 w-7 items-center justify-center rounded-lg shrink-0",
+                  theme.bgColor,
+                  theme.iconColor
                 ),
-                children: isImage ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Image, { className: cn("h-4 w-4", theme.text) }) : isVideo ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Film, { className: cn("h-4 w-4", theme.text) }) : isPdf ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileText, { className: cn("h-4 w-4", theme.text) }) : isSheet ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileSpreadsheet, { className: cn("h-4 w-4", theme.text) }) : isZip ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileArchive, { className: cn("h-4 w-4", theme.text) }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileCode, { className: cn("h-4 w-4", theme.text) })
+                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(theme.icon, { className: "h-3.5 w-3.5" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "min-w-0", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("p", { className: "font-semibold text-xs text-foreground truncate max-w-[240px] sm:max-w-xs", children: file.fileName }),
-              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("p", { className: "text-[11px] text-muted-foreground", children: file.folderPath || file.section || "General" })
-            ] })
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "font-semibold text-foreground truncate max-w-[200px]", children: file.fileName })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-3 px-4 text-xs", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-            Badge,
-            {
-              variant: "outline",
-              className: cn("text-[10px] px-2 py-0.5 font-bold", theme.bg, theme.text, theme.border),
-              children: file.category
-            }
-          ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-3 px-4 text-xs text-muted-foreground font-mono", children: formatBytes(file.fileSize) }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-3 px-4 text-xs text-muted-foreground hidden sm:table-cell", children: updatedTimeDisplay }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-3 px-4 text-right", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-end gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-              "button",
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-2.5 px-3 text-muted-foreground truncate max-w-[140px]", children: file.folderPath || file.section || "General" }),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-2.5 px-3 text-muted-foreground font-mono", children: formatBytes(file.fileSize) }),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-2.5 px-3 text-muted-foreground", children: formatTimeAgo(file.updatedAt) }),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("td", { className: "py-2.5 px-3 text-right", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-end gap-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
+              Button,
               {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  onPreview?.(file);
-                },
-                className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                title: "Preview",
-                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-4 w-4" })
+                size: "sm",
+                variant: "ghost",
+                onClick: () => onPreview?.(file),
+                className: "h-7 px-2.5 rounded-lg bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 hover:bg-indigo-500/20 text-xs font-semibold gap-1.5",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5" }),
+                  " Preview"
+                ]
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-              "button",
+              Button,
               {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  onDownload?.(file);
-                },
-                className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                title: "Download",
-                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-4 w-4" })
+                size: "icon",
+                variant: "ghost",
+                onClick: () => onDownload?.(file),
+                className: "h-7 w-7 rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground",
+                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5" })
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenu, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-                "button",
+                Button,
                 {
-                  type: "button",
-                  onClick: (e) => e.stopPropagation(),
-                  className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                  title: "More actions",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.MoreHorizontal, { className: "h-4 w-4" })
+                  size: "icon",
+                  variant: "ghost",
+                  className: "h-7 w-7 rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.MoreHorizontal, { className: "h-3.5 w-3.5" })
                 }
               ) }),
               /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuContent, { align: "end", className: "w-40 rounded-xl p-1 shadow-lg", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onPreview?.(file), className: "gap-2 text-xs", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5" }),
+                  " Preview"
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onDownload?.(file), className: "gap-2 text-xs", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5" }),
+                  " Download"
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onCopyLink?.(file), className: "gap-2 text-xs", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5" }),
+                  " Copy Link"
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuSeparator, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
                   DropdownMenuItem,
                   {
-                    onClick: () => onPreview?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5 text-blue-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Preview" })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onDownload?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5 text-emerald-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Download" })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onCopyLink?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5 text-amber-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Copy Link" })
-                    ]
-                  }
-                ),
-                onShare && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onShare(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Share2, { className: "h-3.5 w-3.5 text-indigo-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Share" })
-                    ]
-                  }
-                ),
-                onRename && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onRename(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
+                    onClick: () => onDelete?.(file),
+                    className: "gap-2 text-xs text-destructive focus:text-destructive",
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Pencil, { className: "h-3.5 w-3.5 text-purple-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Rename" })
+                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Trash2, { className: "h-3.5 w-3.5" }),
+                      " Delete"
                     ]
                   }
-                ),
-                onDelete && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(import_jsx_runtime94.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuSeparator, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => onDelete(file),
-                      className: "cursor-pointer text-xs flex items-center gap-2 py-1.5 text-rose-500 hover:text-rose-600 hover:bg-rose-50 dark:hover:bg-rose-950/30 rounded-md",
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Trash2, { className: "h-3.5 w-3.5 text-rose-500" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Delete" })
-                      ]
-                    }
-                  )
-                ] })
+                )
               ] })
             ] })
           ] }) })
@@ -11639,143 +11593,119 @@ function FileCardItem({
   return /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
     "div",
     {
-      onClick: () => onSelect?.(file),
       className: cn(
-        "group relative flex flex-col justify-between overflow-hidden rounded-2xl border border-border/80 bg-card p-3.5 shadow-2xs transition-all duration-200 hover:shadow-md hover:border-indigo-300 dark:hover:border-indigo-700/60 cursor-pointer select-none",
-        isSelected && "border-indigo-500 ring-2 ring-indigo-500/20 bg-indigo-500/5",
+        "group relative flex flex-col justify-between rounded-2xl border border-border/80 bg-card p-2.5 shadow-2xs hover:shadow-md transition-all hover:border-indigo-300 dark:hover:border-indigo-700 select-none",
+        isSelected && "ring-2 ring-indigo-500 bg-indigo-500/5",
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "relative mb-3 flex items-center justify-center overflow-hidden rounded-xl bg-muted/20 border border-border/40 min-h-[105px]", children: [
-          isImage && file.fileUrl ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("div", { className: "relative w-full aspect-[16/10] rounded-xl overflow-hidden bg-muted/60 mb-2.5 flex items-center justify-center", children: isImage && file.fileUrl ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
             "img",
             {
               src: file.fileUrl,
               alt: file.fileName,
-              className: "h-28 w-full object-cover transition-transform duration-300 group-hover:scale-105",
+              className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105",
               loading: "lazy"
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+          ) : /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
             "div",
             {
               className: cn(
-                "flex h-16 w-16 items-center justify-center rounded-2xl border shadow-inner transition-transform duration-200 group-hover:scale-110",
-                theme.bg,
-                theme.border
-              ),
-              children: isPdf ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileText, { className: cn("h-8 w-8", theme.text) }) : isVideo ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Film, { className: cn("h-8 w-8", theme.text) }) : isSheet ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileSpreadsheet, { className: cn("h-8 w-8", theme.text) }) : isZip ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileArchive, { className: cn("h-8 w-8", theme.text) }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.FileCode, { className: cn("h-8 w-8", theme.text) })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-            Badge,
-            {
-              variant: "outline",
-              className: cn(
-                "absolute top-2 right-2 backdrop-blur-md text-[10px] font-bold px-1.5 py-0.5 shadow-2xs",
-                theme.bg,
-                theme.text,
-                theme.border
+                "flex flex-col items-center justify-center gap-1.5 w-full h-full p-4",
+                theme.bgColor
               ),
-              children: file.category
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(theme.icon, { className: cn("h-10 w-10", theme.iconColor) }),
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "text-[11px] font-bold uppercase tracking-wider text-muted-foreground", children: theme.name })
+              ]
             }
-          )
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex flex-col gap-1 min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("h4", { className: "font-bold text-xs text-foreground truncate tracking-tight", title: file.fileName, children: file.fileName }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-between text-[11px] text-muted-foreground", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "font-mono", children: formatBytes(file.fileSize) }),
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "truncate", children: updatedTimeDisplay })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "mt-3 pt-2.5 flex items-center justify-between border-t border-border/50 text-muted-foreground", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "text-[10px] text-muted-foreground/70 font-medium truncate max-w-[120px]", children: file.folderPath || file.section || "General" }),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center gap-1", children: [
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "px-1 min-w-0", children: [
             /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-              "button",
+              "h3",
               {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  onPreview?.(file);
-                },
-                className: "p-1 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                title: "Preview file",
-                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5" })
+                className: "text-sm font-bold text-foreground truncate tracking-tight",
+                title: file.fileName,
+                children: file.fileName
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-              "button",
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("p", { className: "text-xs text-muted-foreground truncate mt-0.5 flex items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: file.folderPath || `Chat/${file.senderEmail || "amanmicropay@gmail.com"}` }),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "\xB7" }),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: formatTimeAgo(file.updatedAt) })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center gap-1.5 mt-2.5 pt-2 border-t border-border/40 px-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              onClick: () => onPreview?.(file),
+              className: "h-7 px-2.5 rounded-lg bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 hover:bg-indigo-500/20 text-xs font-semibold gap-1.5 flex-1 justify-center cursor-pointer",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5" }),
+                " Preview"
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+            Button,
+            {
+              size: "icon",
+              variant: "ghost",
+              onClick: () => onDownload?.(file),
+              className: "h-7 w-7 rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground cursor-pointer",
+              title: "Download",
+              children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenu, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+              Button,
               {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  onDownload?.(file);
-                },
-                className: "p-1 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                title: "Download file",
-                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5" })
+                size: "icon",
+                variant: "ghost",
+                className: "h-7 w-7 rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground cursor-pointer",
+                title: "More actions",
+                children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.MoreHorizontal, { className: "h-3.5 w-3.5" })
               }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenu, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-                "button",
+            ) }),
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuContent, { align: "end", className: "w-40 rounded-xl p-1 shadow-lg", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onPreview?.(file), className: "gap-2 text-xs", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5" }),
+                " Preview"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onDownload?.(file), className: "gap-2 text-xs", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5" }),
+                " Download"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onCopyLink?.(file), className: "gap-2 text-xs", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5" }),
+                " Copy Link"
+              ] }),
+              onShare && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onShare?.(file), className: "gap-2 text-xs", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Share2, { className: "h-3.5 w-3.5" }),
+                " Share"
+              ] }),
+              onRename && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuItem, { onClick: () => onRename?.(file), className: "gap-2 text-xs", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Edit2, { className: "h-3.5 w-3.5" }),
+                " Rename"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuSeparator, {}),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
+                DropdownMenuItem,
                 {
-                  type: "button",
-                  onClick: (e) => e.stopPropagation(),
-                  className: "p-1 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-                  title: "More",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.MoreHorizontal, { className: "h-3.5 w-3.5" })
+                  onClick: () => onDelete?.(file),
+                  className: "gap-2 text-xs text-destructive focus:text-destructive",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Trash2, { className: "h-3.5 w-3.5" }),
+                    " Delete"
+                  ]
                 }
-              ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(DropdownMenuContent, { align: "end", className: "w-38 rounded-xl p-1 shadow-lg", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onPreview?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Eye, { className: "h-3.5 w-3.5 text-blue-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Preview" })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onDownload?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Download, { className: "h-3.5 w-3.5 text-emerald-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Download" })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                  DropdownMenuItem,
-                  {
-                    onClick: () => onCopyLink?.(file),
-                    className: "cursor-pointer text-xs flex items-center gap-2 py-1.5",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5 text-amber-500" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Copy Link" })
-                    ]
-                  }
-                ),
-                onDelete && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(import_jsx_runtime94.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(DropdownMenuSeparator, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => onDelete(file),
-                      className: "cursor-pointer text-xs flex items-center gap-2 py-1.5 text-rose-500 hover:text-rose-600 hover:bg-rose-50 dark:hover:bg-rose-950/30 rounded-md",
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react48.Trash2, { className: "h-3.5 w-3.5 text-rose-500" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { children: "Delete" })
-                      ]
-                    }
-                  )
-                ] })
-              ] })
+              )
             ] })
           ] })
         ] })
@@ -12020,286 +11950,62 @@ function StorageStatCard({
 }
 
 // src/design-system/components/files/user-file-cards-view.tsx
-var import_react18 = require("react");
-var import_lucide_react52 = require("lucide-react");
-
-// src/features/Message/components/chat/header-actions.tsx
+var import_react17 = require("react");
 var import_lucide_react51 = require("lucide-react");
-var import_sonner3 = require("sonner");
 var import_jsx_runtime97 = require("react/jsx-runtime");
-function HeaderActions({
-  onDelete,
-  onDownload,
-  onPrint,
-  onShare,
-  onReply,
-  onForward,
-  onPin,
-  onStar,
-  onFavorite,
-  onArchive,
-  onActionThis,
-  onClose
+function UserFileCardsView({
+  folder,
+  files,
+  selectedFileId,
+  onSelectFileForPreview,
+  onDownloadFile,
+  onDeleteFile,
+  onCopyLink,
+  onRenameFile,
+  onShareFile,
+  onUploadClick,
+  onBack,
+  onClose,
+  className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-1 shrink-0 select-none", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: () => {
-          if (onActionThis) onActionThis();
-          else import_sonner3.toast.info("Act on this option selected");
-        },
-        className: "p-1.5 rounded-lg hover:bg-muted text-amber-500 hover:text-amber-600 transition-colors cursor-pointer",
-        title: "Act on this",
-        children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Bell, { className: "h-4.5 w-4.5" })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: () => import_sonner3.toast.success("Flagged item"),
-        className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-        title: "Flag",
-        children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Flag, { className: "h-4.5 w-4.5" })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenu, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-        "button",
-        {
-          type: "button",
-          className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
-          title: "More options",
-          children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.MoreVertical, { className: "h-4.5 w-4.5" })
-        }
-      ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
-        DropdownMenuContent,
-        {
-          align: "end",
-          className: "w-48 border border-border/80 bg-background shadow-lg p-1 space-y-0.5",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onReply) onReply();
-                  else import_sonner3.toast.info("Reply option selected");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Reply, { className: "h-4 w-4 text-blue-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Reply" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onForward) onForward();
-                  else import_sonner3.toast.info("Forward option selected");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Forward, { className: "h-4 w-4 text-sky-400" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Forward" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onPin) onPin();
-                  else import_sonner3.toast.success("Message pinned");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Pin, { className: "h-4 w-4 text-purple-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Pin Message" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onStar) onStar();
-                  else import_sonner3.toast.success("Starred successfully");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Star, { className: "h-4 w-4 text-amber-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Star" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onFavorite) onFavorite();
-                  else import_sonner3.toast.success("Added to favorites");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Heart, { className: "h-4 w-4 text-rose-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Favorite" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => import_sonner3.toast.success("Flagged message"),
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Flag, { className: "h-4 w-4 text-red-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Flag" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onArchive) onArchive();
-                  else import_sonner3.toast.success("Archived successfully");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Archive, { className: "h-4 w-4 text-indigo-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Archive" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onActionThis) onActionThis();
-                  else import_sonner3.toast.info("Action This selected");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-muted/80 rounded-md",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Bell, { className: "h-4 w-4 text-amber-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "text-foreground", children: "Action This" })
-                ] })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-              DropdownMenuItem,
-              {
-                onClick: () => {
-                  if (onDelete) onDelete();
-                  else import_sonner3.toast.success("Item deleted");
-                },
-                className: "cursor-pointer text-xs flex items-center justify-between py-2 px-2.5 font-medium hover:bg-red-500/10 rounded-md text-red-500 focus:text-red-500",
-                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Trash2, { className: "h-4 w-4 text-red-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { className: "font-semibold text-red-500", children: "Delete" })
-                ] })
-              }
-            )
-          ]
-        }
-      )
-    ] }),
-    onClose && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: onClose,
-        className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors cursor-pointer ml-0.5",
-        title: "Close",
-        "aria-label": "Close",
-        children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.X, { className: "h-4.5 w-4.5" })
-      }
-    )
-  ] });
-}
-
-// src/design-system/components/files/user-file-cards-view.tsx
-var import_jsx_runtime98 = require("react/jsx-runtime");
-var CATEGORY_TABS = [
-  { label: "All Files", value: "all" },
-  { label: "PDFs", value: "Pdf" },
-  { label: "Documents", value: "Doc" },
-  { label: "Spreadsheets", value: "Xls" },
-  { label: "Images", value: "Images" },
-  { label: "Videos", value: "Videos" },
-  { label: "Archives", value: "Zip" }
-];
-function UserFileCardsView({
-  folder,
-  files,
-  selectedFileId,
-  onSelectFileForPreview,
-  onDownloadFile,
-  onDeleteFile,
-  onCopyLink,
-  onRenameFile,
-  onShareFile,
-  onUploadClick,
-  onBack,
-  className
-}) {
-  const [searchQuery, setSearchQuery] = (0, import_react18.useState)("");
-  const [selectedCategory, setSelectedCategory] = (0, import_react18.useState)("all");
-  const [sortBy, setSortBy] = (0, import_react18.useState)("date");
-  const [sortOrder, setSortOrder] = (0, import_react18.useState)("desc");
-  const [viewMode, setViewMode] = (0, import_react18.useState)("grid");
-  const [currentPage, setCurrentPage] = (0, import_react18.useState)(1);
-  const itemsPerPage = viewMode === "grid" ? 12 : 20;
-  const [selectedIds, setSelectedIds] = (0, import_react18.useState)(/* @__PURE__ */ new Set());
-  const filteredFiles = (0, import_react18.useMemo)(() => {
-    return files.filter((f) => {
-      const matchCategory = selectedCategory === "all" || f.category.toLowerCase() === selectedCategory.toLowerCase() || selectedCategory === "Xls" && (f.category === "Csv" || f.category === "Xls");
-      const matchSearch = !searchQuery.trim() || f.fileName.toLowerCase().includes(searchQuery.toLowerCase()) || f.folderPath && f.folderPath.toLowerCase().includes(searchQuery.toLowerCase());
-      return matchCategory && matchSearch;
-    });
-  }, [files, selectedCategory, searchQuery]);
-  const sortedFiles = (0, import_react18.useMemo)(() => {
-    return [...filteredFiles].sort((a, b) => {
-      let compare = 0;
-      if (sortBy === "date") {
-        const timeA = a.updatedAt ? new Date(a.updatedAt).getTime() : 0;
-        const timeB = b.updatedAt ? new Date(b.updatedAt).getTime() : 0;
-        compare = timeB - timeA;
-      } else if (sortBy === "name") {
-        compare = a.fileName.localeCompare(b.fileName);
-      } else if (sortBy === "size") {
-        compare = (b.fileSize || 0) - (a.fileSize || 0);
+  const [searchQuery, setSearchQuery] = (0, import_react17.useState)("");
+  const [selectedCategory, setSelectedCategory] = (0, import_react17.useState)("all");
+  const [sortBy, setSortBy] = (0, import_react17.useState)("date");
+  const [sortOrder, setSortOrder] = (0, import_react17.useState)("desc");
+  const [viewMode, setViewMode] = (0, import_react17.useState)("grid");
+  const [currentPage, setCurrentPage] = (0, import_react17.useState)(1);
+  const itemsPerPage = viewMode === "grid" ? 12 : 20;
+  const [selectedIds, setSelectedIds] = (0, import_react17.useState)(/* @__PURE__ */ new Set());
+  const filteredFiles = (0, import_react17.useMemo)(() => {
+    return files.filter((f) => {
+      const matchCategory = selectedCategory === "all" || f.category.toLowerCase() === selectedCategory.toLowerCase() || selectedCategory === "Xls" && (f.category === "Csv" || f.category === "Xls");
+      const matchSearch = !searchQuery.trim() || f.fileName.toLowerCase().includes(searchQuery.toLowerCase()) || f.folderPath && f.folderPath.toLowerCase().includes(searchQuery.toLowerCase());
+      return matchCategory && matchSearch;
+    });
+  }, [files, selectedCategory, searchQuery]);
+  const sortedFiles = (0, import_react17.useMemo)(() => {
+    return [...filteredFiles].sort((a, b) => {
+      let compare = 0;
+      if (sortBy === "date") {
+        const timeA = a.updatedAt ? new Date(a.updatedAt).getTime() : 0;
+        const timeB = b.updatedAt ? new Date(b.updatedAt).getTime() : 0;
+        compare = timeB - timeA;
+      } else if (sortBy === "name") {
+        compare = a.fileName.localeCompare(b.fileName);
+      } else if (sortBy === "size") {
+        compare = (b.fileSize || 0) - (a.fileSize || 0);
       }
       return sortOrder === "asc" ? -compare : compare;
     });
   }, [filteredFiles, sortBy, sortOrder]);
   const totalPages = Math.ceil(sortedFiles.length / itemsPerPage) || 1;
-  const paginatedFiles = (0, import_react18.useMemo)(() => {
+  const paginatedFiles = (0, import_react17.useMemo)(() => {
     const start = (currentPage - 1) * itemsPerPage;
     return sortedFiles.slice(start, start + itemsPerPage);
   }, [sortedFiles, currentPage, itemsPerPage]);
-  const totalBytes = (0, import_react18.useMemo)(() => {
+  const totalBytes = (0, import_react17.useMemo)(() => {
     return files.reduce((acc, curr) => acc + (curr.fileSize || 0), 0);
   }, [files]);
-  const toggleSelectAll = () => {
-    if (selectedIds.size === paginatedFiles.length) {
-      setSelectedIds(/* @__PURE__ */ new Set());
-    } else {
-      setSelectedIds(new Set(paginatedFiles.map((f) => f.id)));
-    }
-  };
-  const toggleSelectOne = (id) => {
-    setSelectedIds((prev) => {
-      const next = new Set(prev);
-      if (next.has(id)) next.delete(id);
-      else next.add(id);
-      return next;
-    });
-  };
   const handleBulkDownload = () => {
     const toDownload = files.filter((f) => selectedIds.has(f.id));
     toDownload.forEach((f) => onDownloadFile?.(f));
@@ -12309,7 +12015,9 @@ function UserFileCardsView({
     toDelete.forEach((f) => onDeleteFile?.(f));
     setSelectedIds(/* @__PURE__ */ new Set());
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+  const folderDisplayName = folder?.name || "Images";
+  const folderDisplayPath = folder?.path || "Chat/amanmicropay@gmail.com/Images";
+  return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
     "div",
     {
       className: cn(
@@ -12317,320 +12025,297 @@ function UserFileCardsView({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center justify-between border-b border-border bg-background px-4 py-3 shrink-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2.5 min-w-0", children: [
-            onBack && /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center justify-between border-b border-border bg-background px-4 py-3 shrink-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-3 min-w-0", children: [
+            onBack && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
               "button",
               {
                 type: "button",
                 onClick: onBack,
                 className: "flex h-8 w-8 items-center justify-center rounded-xl text-muted-foreground hover:bg-muted hover:text-foreground transition-colors cursor-pointer",
                 title: "Back",
-                children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ArrowLeft, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.ArrowLeft, { className: "h-4 w-4" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-xl bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 border border-indigo-200/50 shrink-0 shadow-2xs", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.FolderOpen, { className: "h-5 w-5" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "min-w-0", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("h2", { className: "truncate text-sm font-bold text-foreground tracking-tight", children: folder?.name || "All Files & Folders" }),
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Badge, { variant: "secondary", className: "text-[10px] px-1.5 py-0 h-4 font-mono", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-xl bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 border border-indigo-200/50 dark:border-indigo-900/40 shrink-0 shadow-2xs", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.FolderOpen, { className: "h-5 w-5" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("h2", { className: "truncate text-base font-bold text-foreground tracking-tight", children: folderDisplayName }),
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("span", { className: "px-2 py-0.5 rounded-full bg-muted text-xs font-normal text-muted-foreground shrink-0", children: [
                   filteredFiles.length,
                   " files"
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("p", { className: "truncate text-xs text-muted-foreground", children: [
-                folder?.path || "Storage Space",
-                " \xB7 Total size: ",
-                formatBytes(totalBytes)
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("p", { className: "truncate text-xs text-muted-foreground mt-0.5", children: [
+                "Storage folder: ",
+                folderDisplayPath
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-1.5 shrink-0", children: [
-            onUploadClick && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
-              Button,
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-1 shrink-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+              "button",
               {
-                size: "sm",
-                onClick: onUploadClick,
-                className: "gap-1.5 h-8 text-xs font-semibold shadow-xs",
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Upload, { className: "h-3.5 w-3.5" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { className: "hidden sm:inline", children: "Upload Files" })
-                ]
+                type: "button",
+                className: "p-2 rounded-lg text-amber-500 hover:bg-muted transition-colors cursor-pointer",
+                title: "Notifications",
+                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Bell, { className: "h-4 w-4" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(HeaderActions, { onDelete: onBack })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex flex-col gap-2.5 border-b border-border/60 bg-muted/10 p-3 shrink-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "relative min-w-[200px] flex-1 max-w-md", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" }),
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                Input,
-                {
-                  value: searchQuery,
-                  onChange: (e) => {
-                    setSearchQuery(e.target.value);
-                    setCurrentPage(1);
-                  },
-                  placeholder: "Search files by name, type, or path...",
-                  className: "h-8.5 pl-8 pr-8 text-xs rounded-xl bg-background border-border/80"
-                }
-              ),
-              searchQuery && /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+              "button",
+              {
+                type: "button",
+                className: "p-2 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
+                title: "Flag / Report",
+                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Flag, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenu, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
                 "button",
                 {
                   type: "button",
-                  onClick: () => setSearchQuery(""),
-                  className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.X, { className: "h-3.5 w-3.5" })
+                  className: "p-2 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
+                  title: "Options",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.MoreVertical, { className: "h-4 w-4" })
                 }
-              )
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(DropdownMenu, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5 text-xs rounded-xl", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ArrowUpDown, { className: "h-3.5 w-3.5 text-muted-foreground" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("span", { className: "hidden sm:inline capitalize", children: [
-                    "Sort: ",
-                    sortBy
-                  ] })
-                ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(DropdownMenuContent, { align: "end", className: "w-44 rounded-xl p-1 shadow-lg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(DropdownMenuLabel, { className: "text-[10px] text-muted-foreground uppercase font-bold tracking-wider", children: "Sort By" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => setSortBy("date"),
-                      className: cn("text-xs cursor-pointer", sortBy === "date" && "font-bold text-primary"),
-                      children: "Last Updated"
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => setSortBy("name"),
-                      className: cn("text-xs cursor-pointer", sortBy === "name" && "font-bold text-primary"),
-                      children: "File Name (A-Z)"
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => setSortBy("size"),
-                      className: cn("text-xs cursor-pointer", sortBy === "size" && "font-bold text-primary"),
-                      children: "File Size"
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(DropdownMenuSeparator, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
-                    DropdownMenuItem,
-                    {
-                      onClick: () => setSortOrder((prev) => prev === "asc" ? "desc" : "asc"),
-                      className: "text-xs cursor-pointer",
-                      children: [
-                        "Order: ",
-                        sortOrder === "asc" ? "Ascending \u2191" : "Descending \u2193"
-                      ]
-                    }
-                  )
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenuContent, { align: "end", className: "w-44 rounded-xl p-1 shadow-lg", children: [
+                onUploadClick && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenuItem, { onClick: onUploadClick, className: "gap-2 text-xs", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Upload, { className: "h-3.5 w-3.5" }),
+                  " Upload Files"
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenuItem, { onClick: () => setViewMode(viewMode === "grid" ? "table" : "grid"), className: "gap-2 text-xs", children: [
+                  viewMode === "grid" ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.List, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.LayoutGrid, { className: "h-3.5 w-3.5" }),
+                  "Switch to ",
+                  viewMode === "grid" ? "Table" : "Card",
+                  " View"
                 ] })
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center rounded-xl bg-muted/50 p-0.5 border border-border/60", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => setViewMode("grid"),
-                    className: cn(
-                      "flex h-7 w-7 items-center justify-center rounded-lg transition-all cursor-pointer",
-                      viewMode === "grid" ? "bg-background text-foreground shadow-2xs font-bold" : "text-muted-foreground hover:text-foreground"
-                    ),
-                    title: "Grid View",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.LayoutGrid, { className: "h-3.5 w-3.5" })
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => setViewMode("table"),
-                    className: cn(
-                      "flex h-7 w-7 items-center justify-center rounded-lg transition-all cursor-pointer",
-                      viewMode === "table" ? "bg-background text-foreground shadow-2xs font-bold" : "text-muted-foreground hover:text-foreground"
-                    ),
-                    title: "Table View",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Table, { className: "h-3.5 w-3.5" })
-                  }
-                )
               ] })
-            ] })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "flex items-center gap-1.5 overflow-x-auto scrollbar-none pb-0.5", children: CATEGORY_TABS.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-            "button",
-            {
-              type: "button",
-              onClick: () => {
-                setSelectedCategory(tab.value);
-                setCurrentPage(1);
-              },
-              className: cn(
-                "rounded-lg px-2.5 py-1 text-xs font-semibold whitespace-nowrap transition-all duration-200 cursor-pointer border",
-                selectedCategory === tab.value ? "bg-indigo-600 text-white border-indigo-600 shadow-2xs" : "bg-background border-border/80 text-muted-foreground hover:text-foreground hover:bg-muted/40"
-              ),
-              children: tab.label
-            },
-            tab.value
-          )) })
+            ] }),
+            (onClose || onBack) && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+              "button",
+              {
+                type: "button",
+                onClick: onClose || onBack,
+                className: "p-2 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
+                title: "Close",
+                children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.X, { className: "h-4 w-4" })
+              }
+            )
+          ] })
         ] }),
-        selectedIds.size > 0 && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center justify-between bg-indigo-500/10 border-b border-indigo-200/40 px-4 py-2 text-xs", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("span", { className: "font-semibold text-indigo-700 dark:text-indigo-300", children: [
-            selectedIds.size,
-            " files selected"
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-2 px-4 pt-3 pb-2 shrink-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2 overflow-x-auto py-0.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
               Button,
               {
-                size: "sm",
                 variant: "outline",
-                onClick: handleBulkDownload,
-                className: "h-7 text-xs gap-1 bg-background",
+                size: "sm",
+                className: "h-8 gap-1.5 text-xs font-bold text-muted-foreground rounded-xl border-border px-3 shrink-0",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Download, { className: "h-3 w-3" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Download" })
+                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.ArrowLeftRight, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+                  "LTR"
                 ]
               }
             ),
-            onDeleteFile && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
               Button,
               {
+                variant: "outline",
                 size: "sm",
-                variant: "destructive",
-                onClick: handleBulkDelete,
-                className: "h-7 text-xs gap-1",
+                className: "h-8 gap-1.5 text-xs font-bold text-muted-foreground rounded-xl border-border px-3 shrink-0",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Trash2, { className: "h-3 w-3" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Delete" })
+                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Filter, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+                  "FILTER"
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenu, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
+                Button,
+                {
+                  variant: "outline",
+                  size: "sm",
+                  className: "h-8 gap-1.5 text-xs font-bold text-muted-foreground rounded-xl border-border px-3 shrink-0",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.ArrowUpDown, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+                    "SORT"
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(DropdownMenuContent, { align: "start", className: "w-40 rounded-xl p-1 shadow-lg", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuItem, { onClick: () => setSortBy("date"), className: "text-xs", children: "Date Modified" }),
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuItem, { onClick: () => setSortBy("name"), className: "text-xs", children: "File Name" }),
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(DropdownMenuItem, { onClick: () => setSortBy("size"), className: "text-xs", children: "File Size" })
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
               Button,
               {
+                variant: "outline",
                 size: "sm",
-                variant: "ghost",
-                onClick: () => setSelectedIds(/* @__PURE__ */ new Set()),
-                className: "h-7 text-xs",
-                children: "Clear"
+                className: "h-8 gap-1.5 text-xs font-bold text-muted-foreground rounded-xl border-border px-3 shrink-0",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.SlidersHorizontal, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+                  "SHORT"
+                ]
               }
             )
-          ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+            Button,
+            {
+              onClick: () => setViewMode(viewMode === "grid" ? "table" : "grid"),
+              size: "sm",
+              className: "h-8 gap-1.5 text-xs font-bold rounded-xl bg-indigo-600 hover:bg-indigo-700 text-white shadow-xs px-3.5 shrink-0 cursor-pointer",
+              children: viewMode === "grid" ? /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(import_jsx_runtime97.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.LayoutGrid, { className: "h-3.5 w-3.5" }),
+                "VIEW: CARD"
+              ] }) : /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(import_jsx_runtime97.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.List, { className: "h-3.5 w-3.5" }),
+                "VIEW: TABLE"
+              ] })
+            }
+          )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto p-4", children: paginatedFiles.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex h-64 flex-col items-center justify-center gap-3 text-center text-muted-foreground border-2 border-dashed border-border/60 rounded-2xl bg-muted/5 p-8", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.FolderOpen, { className: "h-10 w-10 text-muted-foreground/40" }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("p", { className: "text-sm font-bold text-foreground", children: "No files found" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("p", { className: "text-xs text-muted-foreground mt-0.5", children: searchQuery ? "No documents match your search criteria" : "This folder is currently empty. Upload your first document." })
+        /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "px-4 pb-2 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Search, { className: "absolute left-3.5 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+            Input,
+            {
+              value: searchQuery,
+              onChange: (e) => {
+                setSearchQuery(e.target.value);
+                setCurrentPage(1);
+              },
+              placeholder: "Search files by name, format, or sender...",
+              className: "h-10 pl-10 pr-9 text-sm rounded-xl bg-background border-border/80 focus-visible:ring-1 focus-visible:ring-indigo-500"
+            }
+          ),
+          searchQuery && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setSearchQuery(""),
+              className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+              children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.X, { className: "h-4 w-4" })
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center justify-between px-4 py-2 text-xs text-muted-foreground font-medium shrink-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("span", { children: [
+            filteredFiles.length,
+            " files"
           ] }),
-          onUploadClick && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Button, { size: "sm", onClick: onUploadClick, className: "gap-1.5 text-xs mt-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Upload, { className: "h-3.5 w-3.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Upload New File" })
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("span", { children: sortedFiles.length === 0 ? "0 of 0" : `${(currentPage - 1) * itemsPerPage + 1}\u2013${Math.min(
+              currentPage * itemsPerPage,
+              sortedFiles.length
+            )} of ${sortedFiles.length}` }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex items-center gap-0.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  disabled: currentPage <= 1,
+                  onClick: () => setCurrentPage((p) => Math.max(1, p - 1)),
+                  className: "h-6 w-6 rounded-md text-muted-foreground hover:text-foreground",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.ChevronLeft, { className: "h-3.5 w-3.5" })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  disabled: currentPage >= totalPages,
+                  onClick: () => setCurrentPage((p) => Math.min(totalPages, p + 1)),
+                  className: "h-6 w-6 rounded-md text-muted-foreground hover:text-foreground",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.ChevronRight, { className: "h-3.5 w-3.5" })
+                }
+              )
+            ] })
           ] })
-        ] }) : viewMode === "grid" ? /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3.5", children: paginatedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-          FileCardItem,
-          {
-            file,
-            isSelected: file.id === selectedFileId || selectedIds.has(file.id),
-            viewMode: "grid",
-            onSelect: () => onSelectFileForPreview?.(file),
-            onPreview: () => onSelectFileForPreview?.(file),
-            onDownload: () => onDownloadFile?.(file),
-            onCopyLink: () => onCopyLink?.(file),
-            onRename: () => onRenameFile?.(file),
-            onDelete: () => onDeleteFile?.(file),
-            onShare: () => onShareFile?.(file)
-          },
-          file.id
-        )) }) : /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "overflow-hidden rounded-2xl border border-border/80 bg-card shadow-2xs", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("table", { className: "w-full text-left text-xs border-collapse", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("thead", { className: "border-b border-border/80 bg-muted/30 text-muted-foreground font-bold", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("tr", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("th", { className: "py-2.5 px-4", children: "Name" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("th", { className: "py-2.5 px-4", children: "Category" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("th", { className: "py-2.5 px-4", children: "Size" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("th", { className: "py-2.5 px-4 hidden sm:table-cell", children: "Updated" }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("th", { className: "py-2.5 px-4 text-right", children: "Actions" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto p-4", children: paginatedFiles.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex flex-col items-center justify-center h-64 text-center p-6 rounded-2xl border border-dashed border-border/80 bg-muted/5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "flex h-12 w-12 items-center justify-center rounded-2xl bg-indigo-500/10 text-indigo-600 mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.FolderOpen, { className: "h-6 w-6" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("h3", { className: "text-sm font-bold text-foreground", children: "No files found" }),
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("p", { className: "text-xs text-muted-foreground max-w-xs mt-1", children: searchQuery ? `No files match your query "${searchQuery}" in this folder.` : "This folder is currently empty. Upload documents or media to get started." }),
+          onUploadClick && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
+            Button,
+            {
+              size: "sm",
+              onClick: onUploadClick,
+              className: "mt-4 gap-1.5 text-xs font-semibold bg-indigo-600 hover:bg-indigo-700 text-white rounded-xl shadow-xs",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react51.Upload, { className: "h-3.5 w-3.5" }),
+                "Upload First File"
+              ]
+            }
+          )
+        ] }) : viewMode === "table" ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "overflow-x-auto rounded-2xl border border-border/80 bg-card shadow-2xs", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("table", { className: "w-full text-left text-xs border-collapse", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("tr", { className: "border-b border-border/60 bg-muted/20 text-muted-foreground font-semibold", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("th", { className: "py-2.5 px-3", children: "File Name" }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("th", { className: "py-2.5 px-3", children: "Storage Space" }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("th", { className: "py-2.5 px-3", children: "Size" }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("th", { className: "py-2.5 px-3", children: "Updated" }),
+            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("th", { className: "py-2.5 px-3 text-right", children: "Actions" })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: paginatedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("tbody", { children: paginatedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
             FileCardItem,
             {
               file,
-              isSelected: file.id === selectedFileId || selectedIds.has(file.id),
               viewMode: "table",
-              onSelect: () => onSelectFileForPreview?.(file),
-              onPreview: () => onSelectFileForPreview?.(file),
-              onDownload: () => onDownloadFile?.(file),
-              onCopyLink: () => onCopyLink?.(file),
-              onRename: () => onRenameFile?.(file),
-              onDelete: () => onDeleteFile?.(file),
-              onShare: () => onShareFile?.(file)
+              isSelected: selectedIds.has(file.id),
+              onSelect: () => {
+                setSelectedIds((prev) => {
+                  const next = new Set(prev);
+                  if (next.has(file.id)) next.delete(file.id);
+                  else next.add(file.id);
+                  return next;
+                });
+              },
+              onPreview: onSelectFileForPreview,
+              onDownload: onDownloadFile,
+              onDelete: onDeleteFile,
+              onCopyLink,
+              onRename: onRenameFile,
+              onShare: onShareFile
             },
             file.id
           )) })
-        ] }) }) }),
-        totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center justify-between border-t border-border bg-background px-4 py-2.5 shrink-0 text-xs text-muted-foreground", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("span", { children: [
-            "Showing ",
-            (currentPage - 1) * itemsPerPage + 1,
-            " -",
-            " ",
-            Math.min(currentPage * itemsPerPage, sortedFiles.length),
-            " of ",
-            sortedFiles.length
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-              Button,
-              {
-                variant: "outline",
-                size: "sm",
-                onClick: () => setCurrentPage((p) => Math.max(1, p - 1)),
-                disabled: currentPage === 1,
-                className: "h-7 w-7 p-0 rounded-lg",
-                children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ChevronLeft, { className: "h-3.5 w-3.5" })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("span", { className: "px-2 font-mono font-bold text-foreground", children: [
-              currentPage,
-              " / ",
-              totalPages
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
-              Button,
-              {
-                variant: "outline",
-                size: "sm",
-                onClick: () => setCurrentPage((p) => Math.min(totalPages, p + 1)),
-                disabled: currentPage === totalPages,
-                className: "h-7 w-7 p-0 rounded-lg",
-                children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ChevronRight, { className: "h-3.5 w-3.5" })
-              }
-            )
-          ] })
-        ] })
+        ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", children: paginatedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+          FileCardItem,
+          {
+            file,
+            viewMode: "grid",
+            isSelected: selectedIds.has(file.id),
+            onPreview: onSelectFileForPreview,
+            onDownload: onDownloadFile,
+            onDelete: onDeleteFile,
+            onCopyLink,
+            onRename: onRenameFile,
+            onShare: onShareFile
+          },
+          file.id
+        )) }) })
       ]
     }
   );
 }
 
 // src/design-system/components/files/file-upload-form.tsx
-var import_react19 = require("react");
-var import_lucide_react53 = require("lucide-react");
-var import_jsx_runtime99 = require("react/jsx-runtime");
+var import_react18 = require("react");
+var import_lucide_react52 = require("lucide-react");
+var import_jsx_runtime98 = require("react/jsx-runtime");
 var TEMPLATE_OPTIONS = [
-  { id: "1", name: "Standard Document" },
-  { id: "2", name: "Financial Invoice" },
-  { id: "3", name: "Report & Spreadsheet" },
-  { id: "4", name: "Contract & Legal" }
+  { id: "standard", name: "Standard Document" },
+  { id: "invoice", name: "Financial Invoice" },
+  { id: "report", name: "Report & Spreadsheet" },
+  { id: "contract", name: "Contract & Legal" }
 ];
 var FOLDER_OPTIONS = ["Finance", "Chat", "Files", "Email", "AI Chat", "Order"];
 var SUB_FOLDER_OPTIONS = [
@@ -12653,19 +12338,20 @@ function FileUploadForm({
   initialSubFolder = "Pdf",
   onClose,
   onSave,
+  onSaveDraft,
   onUploadSuccess,
   onPreviewAttachment,
   className
 }) {
-  const [template, setTemplate] = (0, import_react19.useState)(TEMPLATE_OPTIONS[0].id);
-  const [subject, setSubject] = (0, import_react19.useState)(initialSubject);
-  const [folder, setFolder] = (0, import_react19.useState)(initialFolder);
-  const [subFolder, setSubFolder] = (0, import_react19.useState)(initialSubFolder);
-  const [remarks, setRemarks] = (0, import_react19.useState)("");
-  const [body, setBody] = (0, import_react19.useState)("");
-  const [attachments, setAttachments] = (0, import_react19.useState)([]);
-  const [isSaving, setIsSaving] = (0, import_react19.useState)(false);
-  const fileInputRef = (0, import_react19.useRef)(null);
+  const [template, setTemplate] = (0, import_react18.useState)("standard");
+  const [subject, setSubject] = (0, import_react18.useState)(initialSubject);
+  const [folder, setFolder] = (0, import_react18.useState)(initialFolder);
+  const [subFolder, setSubFolder] = (0, import_react18.useState)(initialSubFolder);
+  const [remarks, setRemarks] = (0, import_react18.useState)("");
+  const [body, setBody] = (0, import_react18.useState)("");
+  const [attachments, setAttachments] = (0, import_react18.useState)([]);
+  const [isSaving, setIsSaving] = (0, import_react18.useState)(false);
+  const fileInputRef = (0, import_react18.useRef)(null);
   const handleFileChange = (e) => {
     const files = e.target.files;
     if (!files || files.length === 0) return;
@@ -12685,7 +12371,7 @@ function FileUploadForm({
     setAttachments((prev) => prev.filter((a) => a.id !== id));
   };
   const handleFormSubmit = async (e) => {
-    e.preventDefault();
+    if (e) e.preventDefault();
     setIsSaving(true);
     try {
       if (onSave) {
@@ -12703,7 +12389,21 @@ function FileUploadForm({
       setIsSaving(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+  const handleDraftSubmit = async () => {
+    if (onSaveDraft) {
+      await onSaveDraft({
+        subject,
+        folder,
+        subFolder,
+        remarks,
+        body,
+        attachments
+      });
+    } else {
+      await handleFormSubmit();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
     "div",
     {
       className: cn(
@@ -12711,247 +12411,230 @@ function FileUploadForm({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center justify-between border-b border-border bg-background px-4 py-3 shrink-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center gap-2.5 min-w-0", children: [
-            onClose && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-              "button",
-              {
-                type: "button",
-                onClick: onClose,
-                className: "flex h-8 w-8 items-center justify-center rounded-xl text-muted-foreground hover:bg-muted hover:text-foreground transition-colors cursor-pointer",
-                title: "Back",
-                children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.ArrowLeft, { className: "h-4 w-4" })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-xl bg-indigo-500/10 text-indigo-600 dark:text-indigo-400 border border-indigo-200/50 shrink-0 shadow-2xs", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.FileText, { className: "h-5 w-5" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "min-w-0", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("h2", { className: "truncate text-sm font-bold text-foreground tracking-tight", children: "Create & Upload Document" }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("p", { className: "truncate text-xs text-muted-foreground", children: "Add metadata, descriptions, and attach files to your cloud storage" })
-            ] })
+        /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center justify-between border-b border-border bg-background px-6 py-4 shrink-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("h2", { className: "text-xl font-bold text-foreground tracking-tight", children: "New File Upload" }),
+          onClose && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: onClose,
+              className: "flex items-center gap-1.5 text-sm font-semibold text-muted-foreground hover:text-foreground transition-colors cursor-pointer",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ArrowLeft, { className: "h-4 w-4" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Back to Storage" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "min-h-0 flex-1 overflow-y-auto p-6 space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Select Template" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "w-full max-w-sm", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Select, { value: template, onValueChange: setTemplate, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectTrigger, { className: "h-10 text-sm rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectValue, { placeholder: "Select template" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: TEMPLATE_OPTIONS.map((t) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectItem, { value: t.id, className: "text-sm", children: t.name }, t.id)) })
+            ] }) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center gap-2 shrink-0", children: [
-            onClose && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Button, { variant: "ghost", size: "sm", onClick: onClose, className: "h-8 text-xs", children: "Cancel" }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
-              Button,
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Document Title / Subject" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+              Input,
               {
-                size: "sm",
-                onClick: handleFormSubmit,
-                disabled: isSaving || !subject && attachments.length === 0,
-                className: "h-8 gap-1.5 text-xs font-semibold shadow-xs bg-indigo-600 hover:bg-indigo-700 text-white",
-                children: [
-                  isSaving ? /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Loader2, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Save, { className: "h-3.5 w-3.5" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("span", { children: "Save & Upload" })
-                ]
+                value: subject,
+                onChange: (e) => setSubject(e.target.value),
+                placeholder: "Enter document title or reference name",
+                className: "h-10 text-sm rounded-xl bg-background border-border/80"
               }
             )
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "min-h-0 flex-1 overflow-y-auto p-4 space-y-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-3 p-3.5 rounded-2xl border border-border/80 bg-muted/10", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Document Template" }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Select, { value: template, onValueChange: setTemplate, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectTrigger, { className: "h-8.5 text-xs rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectValue, { placeholder: "Select template" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: TEMPLATE_OPTIONS.map((t) => /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectItem, { value: t.id, className: "text-xs", children: t.name }, t.id)) })
-              ] })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Target Space" }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Select, { value: folder, onValueChange: setFolder, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectTrigger, { className: "h-8.5 text-xs rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectValue, { placeholder: "Select space" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: (folders || FOLDER_OPTIONS.map((f) => ({ id: f, name: f }))).map((f) => /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectItem, { value: f.name, className: "text-xs", children: f.name }, f.id)) })
-              ] })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Category Subfolder" }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Select, { value: subFolder, onValueChange: setSubFolder, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectTrigger, { className: "h-8.5 text-xs rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectValue, { placeholder: "Select category" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: SUB_FOLDER_OPTIONS.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(SelectItem, { value: cat, className: "text-xs", children: cat }, cat)) })
-              ] })
-            ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Document Title / Subject" }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-              Input,
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Folder" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "w-full max-w-xs", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Select, { value: folder, onValueChange: setFolder, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectTrigger, { className: "h-10 text-sm rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Folder, { className: "h-4 w-4 text-amber-500 fill-amber-500" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectValue, { placeholder: "Select folder" })
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: (folders || FOLDER_OPTIONS.map((f) => ({ id: f, name: f }))).map((f) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectItem, { value: f.name, className: "text-sm", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Folder, { className: "h-3.5 w-3.5 text-amber-500 fill-amber-500" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: f.name })
+              ] }) }, f.id)) })
+            ] }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Sub folder" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "w-full max-w-xs", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Select, { value: subFolder, onValueChange: setSubFolder, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectTrigger, { className: "h-10 text-sm rounded-xl bg-background border-border/80", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Folder, { className: "h-4 w-4 text-amber-500 fill-amber-500" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectValue, { placeholder: "Select subfolder" })
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectContent, { className: "rounded-xl shadow-lg", children: SUB_FOLDER_OPTIONS.map((sf) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectItem, { value: sf, className: "text-sm", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Folder, { className: "h-3.5 w-3.5 text-amber-500 fill-amber-500" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: sf })
+              ] }) }, sf)) })
+            ] }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Remarks" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+              Textarea,
               {
-                value: subject,
-                onChange: (e) => setSubject(e.target.value),
-                placeholder: "e.g. Q3 Sales & Performance Report",
-                className: "h-9 text-xs rounded-xl bg-background border-border/80"
+                value: remarks,
+                onChange: (e) => setRemarks(e.target.value),
+                placeholder: "Add a note about these attachments...",
+                className: "min-h-[80px] text-sm rounded-xl bg-background border-border/80 resize-y"
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Document Content / Notes" }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "rounded-2xl border border-border/80 overflow-hidden bg-background", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center gap-1 border-b border-border/60 bg-muted/20 p-1.5", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Description / Notes" }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "overflow-hidden rounded-xl border border-border/80 bg-background focus-within:ring-1 focus-within:ring-indigo-500", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-1 p-2 border-b border-border/60 bg-muted/20", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
-                    className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors",
                     title: "Bold",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Bold, { className: "h-3.5 w-3.5" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Bold, { className: "h-3.5 w-3.5" })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
-                    className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors",
                     title: "Italic",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Italic, { className: "h-3.5 w-3.5" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Italic, { className: "h-3.5 w-3.5" })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
-                    className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors",
                     title: "Underline",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Underline, { className: "h-3.5 w-3.5" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Underline, { className: "h-3.5 w-3.5" })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "h-4 w-px bg-border/80 mx-1" }),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "h-4 w-[1px] bg-border mx-1" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
-                    className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors",
                     title: "Bullet List",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.List, { className: "h-3.5 w-3.5" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.List, { className: "h-3.5 w-3.5" })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
-                    className: "p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors",
                     title: "Numbered List",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.ListOrdered, { className: "h-3.5 w-3.5" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.ListOrdered, { className: "h-3.5 w-3.5" })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "h-4 w-px bg-border/80 mx-1" }),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "h-4 w-[1px] bg-border mx-1" }),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                   "button",
                   {
                     type: "button",
                     onClick: () => fileInputRef.current?.click(),
-                    className: "p-1.5 rounded-lg hover:bg-muted text-indigo-600 dark:text-indigo-400 font-semibold flex items-center gap-1 text-xs",
+                    className: "flex h-7 w-7 items-center justify-center rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground text-xs font-bold transition-colors cursor-pointer",
                     title: "Attach Files",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Paperclip, { className: "h-3.5 w-3.5" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("span", { children: "Attach" })
-                    ]
+                    children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Paperclip, { className: "h-3.5 w-3.5" })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+                  "input",
+                  {
+                    ref: fileInputRef,
+                    type: "file",
+                    multiple: true,
+                    className: "hidden",
+                    onChange: handleFileChange
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
                 "textarea",
                 {
                   value: body,
                   onChange: (e) => setBody(e.target.value),
-                  placeholder: "Write or paste your document notes and text here...",
+                  placeholder: "Type description, remarks, or notes here...",
                   rows: 4,
-                  className: "w-full p-3 text-xs bg-transparent border-0 focus:outline-hidden resize-y min-h-[90px]"
+                  className: "w-full bg-transparent p-3 text-sm outline-none resize-y border-0 focus:ring-0"
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Label, { className: "text-xs font-semibold text-foreground", children: [
-                "Attachments (",
-                attachments.length,
-                ")"
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-                "input",
-                {
-                  type: "file",
-                  multiple: true,
-                  ref: fileInputRef,
-                  onChange: handleFileChange,
-                  className: "hidden"
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
-                Button,
-                {
-                  type: "button",
-                  variant: "outline",
-                  size: "sm",
-                  onClick: () => fileInputRef.current?.click(),
-                  className: "h-7 text-xs gap-1.5 rounded-xl border-dashed",
-                  children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Paperclip, { className: "h-3 w-3" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("span", { children: "Browse Files" })
-                  ]
-                }
-              )
+          attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "space-y-2 pt-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Label, { className: "text-xs font-semibold text-foreground", children: [
+              "Attached Files (",
+              attachments.length,
+              ")"
             ] }),
-            attachments.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
-              "div",
-              {
-                onClick: () => fileInputRef.current?.click(),
-                className: "flex flex-col items-center justify-center gap-2 p-6 border-2 border-dashed border-border/80 rounded-2xl bg-muted/10 text-muted-foreground hover:border-indigo-400 hover:bg-indigo-50/20 dark:hover:bg-indigo-950/20 transition-all cursor-pointer text-center",
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.UploadCloud, { className: "h-8 w-8 text-indigo-500" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("p", { className: "text-xs font-bold text-foreground", children: "Click to upload or drag and drop" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("p", { className: "text-[11px] text-muted-foreground mt-0.5", children: "PDF, DOCX, XLSX, PNG, JPG, MP4 or ZIP up to 50MB" })
-                  ] })
-                ]
-              }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-2", children: attachments.map((att) => /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "flex flex-wrap gap-2", children: attachments.map((att) => /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
               "div",
               {
-                className: "flex items-center justify-between gap-2 p-2.5 rounded-xl border border-border/80 bg-card shadow-2xs",
+                className: "flex items-center gap-2 px-3 py-1.5 rounded-xl border border-border/80 bg-muted/30 text-xs text-foreground font-medium",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center gap-2.5 min-w-0", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-indigo-500/10 text-indigo-600 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.FileText, { className: "h-4 w-4" }) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "min-w-0", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("p", { className: "truncate text-xs font-semibold text-foreground", children: att.name }),
-                      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("p", { className: "text-[10px] text-muted-foreground font-mono", children: att.size })
-                    ] })
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Paperclip, { className: "h-3.5 w-3.5 text-indigo-500" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { className: "max-w-[200px] truncate", children: att.name }),
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("span", { className: "text-[10px] text-muted-foreground", children: [
+                    "(",
+                    att.size,
+                    ")"
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex items-center gap-1 shrink-0", children: [
-                    onPreviewAttachment && att.url && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: () => onPreviewAttachment({ name: att.name, url: att.url }),
-                        className: "p-1 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
-                        title: "Preview",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.Eye, { className: "h-3.5 w-3.5" })
-                      }
-                    ),
-                    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: () => handleRemoveAttachment(att.id),
-                        className: "p-1 rounded-lg hover:bg-rose-50 dark:hover:bg-rose-950/30 text-rose-500 hover:text-rose-600",
-                        title: "Remove",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_lucide_react53.X, { className: "h-3.5 w-3.5" })
-                      }
-                    )
-                  ] })
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => handleRemoveAttachment(att.id),
+                      className: "text-muted-foreground hover:text-destructive cursor-pointer ml-1",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.X, { className: "h-3.5 w-3.5" })
+                    }
+                  )
                 ]
               },
               att.id
             )) })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Label, { className: "text-xs font-semibold text-foreground", children: "Remarks / Tags" }),
-            /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
-              Input,
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center justify-between border-t border-border bg-background px-6 py-4 shrink-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+            Button,
+            {
+              variant: "outline",
+              onClick: onClose,
+              className: "h-9 px-4 rounded-xl text-sm font-semibold border-border/80 cursor-pointer",
+              children: "Cancel"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+              Button,
               {
-                value: remarks,
-                onChange: (e) => setRemarks(e.target.value),
-                placeholder: "e.g. Confidential, Q3 Approved, Client Copy",
-                className: "h-8.5 text-xs rounded-xl bg-background border-border/80"
+                variant: "outline",
+                onClick: handleDraftSubmit,
+                disabled: isSaving,
+                className: "h-9 px-4 rounded-xl text-sm font-semibold border-border/80 gap-2 cursor-pointer",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Save, { className: "h-4 w-4 text-muted-foreground" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Save as Draft" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+              Button,
+              {
+                onClick: () => handleFormSubmit(),
+                disabled: isSaving,
+                className: "h-9 px-5 rounded-xl text-sm font-semibold gap-2 bg-indigo-600 hover:bg-indigo-700 text-white shadow-xs cursor-pointer",
+                children: [
+                  isSaving ? /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react52.Save, { className: "h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("span", { children: "Save" })
+                ]
               }
             )
           ] })
@@ -12962,7 +12645,7 @@ function FileUploadForm({
 }
 
 // src/design-system/templates/list-template.tsx
-var import_jsx_runtime100 = require("react/jsx-runtime");
+var import_jsx_runtime99 = require("react/jsx-runtime");
 function ListTemplate({
   title,
   description,
@@ -12982,8 +12665,8 @@ function ListTemplate({
   ...props
 }) {
   const hasFilterBar = Boolean(onSearchChange) || Boolean(filters) || activeFilters && activeFilters.length > 0 || Boolean(filterActions);
-  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
       PageHeader,
       {
         title,
@@ -12993,7 +12676,7 @@ function ListTemplate({
         actions
       }
     ),
-    hasFilterBar && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+    hasFilterBar && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
       FilterBar,
       {
         searchPlaceholder,
@@ -13005,14 +12688,14 @@ function ListTemplate({
         actions: filterActions
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "flex-1", children }),
-    footer && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "pt-2", children: footer })
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "flex-1", children }),
+    footer && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", { className: "pt-2", children: footer })
   ] });
 }
 
 // src/design-system/templates/detail-template.tsx
-var import_lucide_react54 = require("lucide-react");
-var import_jsx_runtime101 = require("react/jsx-runtime");
+var import_lucide_react53 = require("lucide-react");
+var import_jsx_runtime100 = require("react/jsx-runtime");
 function DetailTemplate({
   title,
   description,
@@ -13027,9 +12710,9 @@ function DetailTemplate({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      onBack && /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      onBack && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
         Button,
         {
           variant: "ghost",
@@ -13037,12 +12720,12 @@ function DetailTemplate({
           onClick: onBack,
           className: "w-fit gap-1.5 px-0 text-xs text-muted-foreground hover:bg-transparent hover:text-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react54.ArrowLeft, { className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_lucide_react53.ArrowLeft, { className: "h-3.5 w-3.5" }),
             backLabel
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
         PageHeader,
         {
           title,
@@ -13053,8 +12736,8 @@ function DetailTemplate({
         }
       )
     ] }),
-    highlights && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: highlights }),
-    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
+    highlights && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: highlights }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
       "div",
       {
         className: cn(
@@ -13062,8 +12745,8 @@ function DetailTemplate({
           sidebar ? "grid-cols-1 lg:grid-cols-3" : "grid-cols-1"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: cn(sidebar ? "lg:col-span-2 space-y-6" : "space-y-6"), children }),
-          sidebar && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("aside", { className: "space-y-6 lg:col-span-1", children: sidebar })
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: cn(sidebar ? "lg:col-span-2 space-y-6" : "space-y-6"), children }),
+          sidebar && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("aside", { className: "space-y-6 lg:col-span-1", children: sidebar })
         ]
       }
     )
@@ -13071,8 +12754,8 @@ function DetailTemplate({
 }
 
 // src/design-system/templates/form-template.tsx
-var import_lucide_react55 = require("lucide-react");
-var import_jsx_runtime102 = require("react/jsx-runtime");
+var import_lucide_react54 = require("lucide-react");
+var import_jsx_runtime101 = require("react/jsx-runtime");
 function FormTemplate({
   title,
   description,
@@ -13091,9 +12774,9 @@ function FormTemplate({
   onSubmit,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: "flex flex-col gap-6 p-4 sm:p-6 md:p-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      onBack && /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex flex-col gap-6 p-4 sm:p-6 md:p-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      onBack && /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
         Button,
         {
           type: "button",
@@ -13102,12 +12785,12 @@ function FormTemplate({
           onClick: onBack,
           className: "w-fit gap-1.5 px-0 text-xs text-muted-foreground hover:bg-transparent hover:text-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react55.ArrowLeft, { className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react54.ArrowLeft, { className: "h-3.5 w-3.5" }),
             backLabel
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
         PageHeader,
         {
           title,
@@ -13117,9 +12800,9 @@ function FormTemplate({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("form", { onSubmit, className: cn("space-y-8", className), ...props, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: "space-y-6", children }),
-      /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("form", { onSubmit, className: cn("space-y-8", className), ...props, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: "space-y-6", children }),
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
         "div",
         {
           className: cn(
@@ -13127,9 +12810,9 @@ function FormTemplate({
             stickyFooter && "sticky bottom-0 -mx-4 -mb-4 bg-background/95 p-4 backdrop-blur border-t sm:-mx-6 sm:-mb-6 sm:p-6 md:-mx-8 md:-mb-8 md:p-8"
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { children: secondaryActions }),
-            /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: "flex items-center gap-3", children: [
-              onCancel && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { children: secondaryActions }),
+            /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex items-center gap-3", children: [
+              onCancel && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
                 Button,
                 {
                   type: "button",
@@ -13139,7 +12822,7 @@ function FormTemplate({
                   children: cancelLabel
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? "Saving..." : submitLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? "Saving..." : submitLabel })
             ] })
           ]
         }
@@ -13149,8 +12832,8 @@ function FormTemplate({
 }
 
 // src/design-system/templates/wizard-template.tsx
-var import_lucide_react56 = require("lucide-react");
-var import_jsx_runtime103 = require("react/jsx-runtime");
+var import_lucide_react55 = require("lucide-react");
+var import_jsx_runtime102 = require("react/jsx-runtime");
 function WizardTemplate({
   title,
   description,
@@ -13171,18 +12854,18 @@ function WizardTemplate({
 }) {
   const isLastStep = currentStepIndex === steps.length - 1;
   const isFirstStep = currentStepIndex === 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(PageHeader, { title, description }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("nav", { "aria-label": "Wizard Progress", className: "py-2", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("ol", { className: "flex items-center justify-between gap-2 overflow-x-auto pb-2", children: steps.map((step, idx) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(PageHeader, { title, description }),
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("nav", { "aria-label": "Wizard Progress", className: "py-2", children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("ol", { className: "flex items-center justify-between gap-2 overflow-x-auto pb-2", children: steps.map((step, idx) => {
       const isCompleted = idx < currentStepIndex;
       const isCurrent = idx === currentStepIndex;
       const isClickable = onStepChange && idx < currentStepIndex;
-      return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
         "li",
         {
           className: "flex flex-1 items-center gap-2.5 min-w-[120px]",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
               "button",
               {
                 type: "button",
@@ -13193,7 +12876,7 @@ function WizardTemplate({
                   isClickable && "cursor-pointer hover:opacity-80"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                     "span",
                     {
                       className: cn(
@@ -13202,10 +12885,10 @@ function WizardTemplate({
                         isCurrent && "border-2 border-primary bg-primary/10 text-primary font-bold",
                         !isCompleted && !isCurrent && "border border-border bg-muted text-muted-foreground"
                       ),
-                      children: isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_lucide_react56.Check, { className: "h-4 w-4" }) : idx + 1
+                      children: isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react55.Check, { className: "h-4 w-4" }) : idx + 1
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "hidden sm:block", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: "hidden sm:block", children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                     "div",
                     {
                       className: cn(
@@ -13218,7 +12901,7 @@ function WizardTemplate({
                 ]
               }
             ),
-            idx < steps.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+            idx < steps.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
               "div",
               {
                 className: cn(
@@ -13232,9 +12915,9 @@ function WizardTemplate({
         step.id
       );
     }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "flex-1 rounded-lg border bg-card p-4 sm:p-6", children }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex items-center justify-between pt-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: "flex-1 rounded-lg border bg-card p-4 sm:p-6", children }),
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: "flex items-center justify-between pt-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
         Button,
         {
           type: "button",
@@ -13242,12 +12925,12 @@ function WizardTemplate({
           disabled: isFirstStep || isSubmitting,
           onClick: onPrevious,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_lucide_react56.ChevronLeft, { className: "mr-1 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react55.ChevronLeft, { className: "mr-1 h-4 w-4" }),
             previousLabel
           ]
         }
       ),
-      isLastStep ? /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+      isLastStep ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
         Button,
         {
           type: "button",
@@ -13255,7 +12938,7 @@ function WizardTemplate({
           onClick: onSubmit,
           children: isSubmitting ? "Submitting..." : submitLabel
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
         Button,
         {
           type: "button",
@@ -13263,7 +12946,7 @@ function WizardTemplate({
           onClick: onNext,
           children: [
             nextLabel,
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_lucide_react56.ChevronRight, { className: "ml-1 h-4 w-4" })
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react55.ChevronRight, { className: "ml-1 h-4 w-4" })
           ]
         }
       )
@@ -13272,7 +12955,7 @@ function WizardTemplate({
 }
 
 // src/design-system/templates/dashboard-template.tsx
-var import_jsx_runtime104 = require("react/jsx-runtime");
+var import_jsx_runtime103 = require("react/jsx-runtime");
 function DashboardTemplate({
   title,
   description,
@@ -13286,8 +12969,8 @@ function DashboardTemplate({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: cn("flex flex-col gap-6 p-4 sm:p-6 md:p-8", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
       PageHeader,
       {
         title,
@@ -13297,15 +12980,15 @@ function DashboardTemplate({
         actions
       }
     ),
-    metrics && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("section", { "aria-label": "Key Metrics", className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: metrics }),
-    charts && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("section", { "aria-label": "Charts and Visualizations", className: "grid gap-4 md:grid-cols-2 lg:grid-cols-7", children: charts }),
-    activity && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("section", { "aria-label": "Recent Activity", className: "space-y-4", children: activity }),
-    children && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "space-y-6", children })
+    metrics && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("section", { "aria-label": "Key Metrics", className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: metrics }),
+    charts && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("section", { "aria-label": "Charts and Visualizations", className: "grid gap-4 md:grid-cols-2 lg:grid-cols-7", children: charts }),
+    activity && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("section", { "aria-label": "Recent Activity", className: "space-y-4", children: activity }),
+    children && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "space-y-6", children })
   ] });
 }
 
 // src/design-system/templates/workspace-template.tsx
-var import_jsx_runtime105 = require("react/jsx-runtime");
+var import_jsx_runtime104 = require("react/jsx-runtime");
 function WorkspaceTemplate({
   header,
   leftSidebar,
@@ -13315,7 +12998,7 @@ function WorkspaceTemplate({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
     "div",
     {
       className: cn(
@@ -13324,29 +13007,29 @@ function WorkspaceTemplate({
       ),
       ...props,
       children: [
-        header && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("header", { className: "flex h-14 shrink-0 items-center border-b px-4 bg-background z-10", children: header }),
-        /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: "flex flex-1 overflow-hidden", children: [
-          leftSidebar && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("aside", { className: "hidden md:flex w-64 shrink-0 flex-col border-r bg-sidebar p-3 overflow-y-auto", children: leftSidebar }),
-          /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("main", { className: "flex flex-1 flex-col overflow-y-auto p-4 sm:p-6 bg-muted/20", children }),
-          rightSidebar && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("aside", { className: "hidden lg:flex w-80 shrink-0 flex-col border-l bg-background p-4 overflow-y-auto", children: rightSidebar })
+        header && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("header", { className: "flex h-14 shrink-0 items-center border-b px-4 bg-background z-10", children: header }),
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex flex-1 overflow-hidden", children: [
+          leftSidebar && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("aside", { className: "hidden md:flex w-64 shrink-0 flex-col border-r bg-sidebar p-3 overflow-y-auto", children: leftSidebar }),
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("main", { className: "flex flex-1 flex-col overflow-y-auto p-4 sm:p-6 bg-muted/20", children }),
+          rightSidebar && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("aside", { className: "hidden lg:flex w-80 shrink-0 flex-col border-l bg-background p-4 overflow-y-auto", children: rightSidebar })
         ] }),
-        footer && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("footer", { className: "flex h-10 shrink-0 items-center border-t px-4 text-xs text-muted-foreground bg-background", children: footer })
+        footer && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("footer", { className: "flex h-10 shrink-0 items-center border-t px-4 text-xs text-muted-foreground bg-background", children: footer })
       ]
     }
   );
 }
 
 // src/design-system/templates/app-header.tsx
-var import_react21 = require("react");
-var import_lucide_react58 = require("lucide-react");
+var import_react20 = require("react");
+var import_lucide_react57 = require("lucide-react");
 var import_navigation2 = require("next/navigation");
 
 // src/components/layout/header.tsx
-var import_react20 = require("react");
-var import_jsx_runtime106 = require("react/jsx-runtime");
+var import_react19 = require("react");
+var import_jsx_runtime105 = require("react/jsx-runtime");
 function Header({ className, fixed, children, ...props }) {
-  const [offset, setOffset] = (0, import_react20.useState)(0);
-  (0, import_react20.useEffect)(() => {
+  const [offset, setOffset] = (0, import_react19.useState)(0);
+  (0, import_react19.useEffect)(() => {
     const onScroll = () => {
       setOffset(document.body.scrollTop || document.documentElement.scrollTop);
     };
@@ -13355,7 +13038,7 @@ function Header({ className, fixed, children, ...props }) {
   }, []);
   return (
     // Page header container: fixed mode me top par sticky behavior deta hai.
-    /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
       "header",
       {
         className: cn(
@@ -13365,7 +13048,7 @@ function Header({ className, fixed, children, ...props }) {
           className
         ),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
           "div",
           {
             className: cn(
@@ -13374,7 +13057,7 @@ function Header({ className, fixed, children, ...props }) {
               offset > 10 && fixed && "after:absolute after:inset-0 after:-z-10 after:bg-background/20 after:backdrop-blur-lg"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(AppLogo, { className: "shrink-0 md:hidden" }),
+              /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(AppLogo, { className: "shrink-0 md:hidden" }),
               children
             ]
           }
@@ -13385,8 +13068,8 @@ function Header({ className, fixed, children, ...props }) {
 }
 
 // src/components/search.tsx
-var import_lucide_react57 = require("lucide-react");
-var import_jsx_runtime107 = require("react/jsx-runtime");
+var import_lucide_react56 = require("lucide-react");
+var import_jsx_runtime106 = require("react/jsx-runtime");
 function Search7({
   className = "",
   placeholder = "Search",
@@ -13399,7 +13082,7 @@ function Search7({
       search.setOpen(true);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
     Button,
     {
       ...props,
@@ -13409,7 +13092,7 @@ function Search7({
       "aria-label": "Search",
       "aria-keyshortcuts": "Meta+K Control+K",
       onClick: openSearch,
-      children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react57.SearchIcon, { className: "size-5", "aria-hidden": "true" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react56.SearchIcon, { className: "size-5", "aria-hidden": "true" })
     }
   );
 }
@@ -13438,6 +13121,7 @@ function createClient2() {
 
 // src/stores/notification-store.ts
 var activeChannel = null;
+var activeUserId = null;
 var useNotificationStore = (0, import_zustand2.create)((set, get) => ({
   notifications: [],
   unreadCount: 0,
@@ -13578,7 +13262,7 @@ var useNotificationStore = (0, import_zustand2.create)((set, get) => ({
 }));
 
 // src/design-system/templates/app-header.tsx
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 function AppHeader({
   title,
   fixed = true,
@@ -13588,7 +13272,7 @@ function AppHeader({
   const router = (0, import_navigation2.useRouter)();
   const currentUser = useAuthStore((state) => state.auth.user);
   const { unreadCount, fetchNotifications, subscribeToNotifications, unsubscribe } = useNotificationStore();
-  (0, import_react21.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (currentUser) {
       fetchNotifications(currentUser.accountNo);
       subscribeToNotifications(currentUser.accountNo);
@@ -13597,12 +13281,12 @@ function AppHeader({
       unsubscribe();
     };
   }, [currentUser, fetchNotifications, subscribeToNotifications, unsubscribe]);
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Header, { fixed, className: "border-b bg-background", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-1 items-center justify-between w-full", children: iconsPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 min-w-0", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("h1", { className: "min-w-0 truncate text-base font-semibold sm:text-lg", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-1 sm:gap-2 shrink-0 ml-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Search7, { iconOnly: true }),
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Header, { fixed, className: "border-b bg-background", children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex flex-1 items-center justify-between w-full", children: iconsPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 min-w-0", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("h1", { className: "min-w-0 truncate text-base font-semibold sm:text-lg", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex items-center gap-1 sm:gap-2 shrink-0 ml-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Search7, { iconOnly: true }),
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
         Button,
         {
           variant: "ghost",
@@ -13611,18 +13295,18 @@ function AppHeader({
           "aria-label": "Notifications",
           onClick: () => router.push("/notification"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react58.Bell, { className: "size-5" }),
-            unreadCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium text-white shadow-xs", children: unreadCount > 5 ? "5+" : unreadCount })
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react57.Bell, { className: "size-5" }),
+            unreadCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium text-white shadow-xs", children: unreadCount > 5 ? "5+" : unreadCount })
           ]
         }
       )
     ] })
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_jsx_runtime108.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("h1", { className: "min-w-0 truncate text-base font-semibold sm:text-lg", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "ml-auto flex items-center gap-2 sm:gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Search7, { iconOnly: true }),
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(import_jsx_runtime107.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("h1", { className: "min-w-0 truncate text-base font-semibold sm:text-lg", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "ml-auto flex items-center gap-2 sm:gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Search7, { iconOnly: true }),
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
         Button,
         {
           variant: "ghost",
@@ -13631,8 +13315,8 @@ function AppHeader({
           "aria-label": "Notifications",
           onClick: () => router.push("/notification"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react58.Bell, { className: "size-5" }),
-            unreadCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium text-white shadow-xs", children: unreadCount > 5 ? "5+" : unreadCount })
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react57.Bell, { className: "size-5" }),
+            unreadCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium text-white shadow-xs", children: unreadCount > 5 ? "5+" : unreadCount })
           ]
         }
       )
@@ -13641,7 +13325,7 @@ function AppHeader({
 }
 
 // src/design-system/templates/data/sidebar-data.ts
-var import_lucide_react59 = require("lucide-react");
+var import_lucide_react58 = require("lucide-react");
 var sidebarData2 = {
   user: {
     name: "satnaing",
@@ -13651,7 +13335,7 @@ var sidebarData2 = {
   teams: [
     {
       name: "Amoga App",
-      logo: import_lucide_react59.Command,
+      logo: import_lucide_react58.Command,
       plan: "Demo Company"
     }
   ],
@@ -13662,52 +13346,52 @@ var sidebarData2 = {
         {
           title: "Message",
           url: "/message",
-          icon: import_lucide_react59.Mail
+          icon: import_lucide_react58.Mail
         },
         {
           title: "Email Settings",
           url: "/email-settings",
-          icon: import_lucide_react59.Settings
+          icon: import_lucide_react58.Settings
         },
         {
           title: "Design System",
           url: "/",
-          icon: import_lucide_react59.Settings
+          icon: import_lucide_react58.Settings
         },
         {
           title: "Vouchers",
           url: "/vouchers",
-          icon: import_lucide_react59.Ticket
+          icon: import_lucide_react58.Ticket
         },
         {
           title: "AI Chat",
           url: "/ai_chat",
-          icon: import_lucide_react59.Bot
+          icon: import_lucide_react58.Bot
         },
         {
           title: "AI Search",
           url: "/ai_search",
-          icon: import_lucide_react59.SearchIcon
+          icon: import_lucide_react58.SearchIcon
         },
         {
           title: "Chart Template",
           url: "/charttemplate",
-          icon: import_lucide_react59.ChartArea
+          icon: import_lucide_react58.ChartArea
         },
         {
           title: "Map Template",
           url: "/map",
-          icon: import_lucide_react59.Map
+          icon: import_lucide_react58.Map
         },
         {
           title: "Route Doc",
           url: "/routedoc",
-          icon: import_lucide_react59.Route
+          icon: import_lucide_react58.Route
         },
         {
           title: "Link Maker",
           url: "/link-maker",
-          icon: import_lucide_react59.Link
+          icon: import_lucide_react58.Link
         }
       ]
     },
@@ -13716,7 +13400,7 @@ var sidebarData2 = {
       items: [
         {
           title: "Settings",
-          icon: import_lucide_react59.Settings,
+          icon: import_lucide_react58.Settings,
           items: [
             // Add settings pages here
           ]
@@ -13724,7 +13408,7 @@ var sidebarData2 = {
         {
           title: "Help Center",
           url: "/help-center",
-          icon: import_lucide_react59.HelpCircle
+          icon: import_lucide_react58.HelpCircle
         }
       ]
     }
@@ -13732,7 +13416,7 @@ var sidebarData2 = {
 };
 
 // src/design-system/templates/app-logo.tsx
-var import_jsx_runtime109 = require("react/jsx-runtime");
+var import_jsx_runtime108 = require("react/jsx-runtime");
 function AppLogo({ className, onClick }) {
   const { toggleSidebar, setOpenMobile, isMobile } = useSidebar();
   const team = sidebarData2.teams[0];
@@ -13749,7 +13433,7 @@ function AppLogo({ className, onClick }) {
       toggleSidebar();
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     Button,
     {
       type: "button",
@@ -13760,30 +13444,30 @@ function AppLogo({ className, onClick }) {
         className
       ),
       "aria-label": "Open sidebar menu",
-      children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex size-full items-center justify-center rounded-lg bg-primary text-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(Logo, { className: "size-4" }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex size-full items-center justify-center rounded-lg bg-primary text-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Logo, { className: "size-4" }) })
     }
   );
 }
 
 // src/context/layout-provider.tsx
-var import_react22 = require("react");
-var import_jsx_runtime110 = require("react/jsx-runtime");
+var import_react21 = require("react");
+var import_jsx_runtime109 = require("react/jsx-runtime");
 var LAYOUT_COLLAPSIBLE_COOKIE_NAME = "layout_collapsible";
 var LAYOUT_VARIANT_COOKIE_NAME = "layout_variant";
 var LAYOUT_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var DEFAULT_VARIANT = "inset";
 var DEFAULT_COLLAPSIBLE = "icon";
-var LayoutContext = (0, import_react22.createContext)(null);
+var LayoutContext = (0, import_react21.createContext)(null);
 function LayoutProvider({ children }) {
-  const [collapsible, _setCollapsible] = (0, import_react22.useState)(() => {
+  const [collapsible, _setCollapsible] = (0, import_react21.useState)(() => {
     const saved = getCookie(LAYOUT_COLLAPSIBLE_COOKIE_NAME);
     return saved || DEFAULT_COLLAPSIBLE;
   });
-  const [variant, _setVariant] = (0, import_react22.useState)(() => {
+  const [variant, _setVariant] = (0, import_react21.useState)(() => {
     const saved = getCookie(LAYOUT_VARIANT_COOKIE_NAME);
     return saved || DEFAULT_VARIANT;
   });
-  const [showInlineNotFound, setShowInlineNotFound] = (0, import_react22.useState)(false);
+  const [showInlineNotFound, setShowInlineNotFound] = (0, import_react21.useState)(false);
   const setCollapsible = (newCollapsible) => {
     _setCollapsible(newCollapsible);
     setCookie(
@@ -13811,10 +13495,10 @@ function LayoutProvider({ children }) {
     showInlineNotFound,
     setShowInlineNotFound
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(LayoutContext, { value: contextValue, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(LayoutContext, { value: contextValue, children });
 }
 function useLayout() {
-  const context = (0, import_react22.useContext)(LayoutContext);
+  const context = (0, import_react21.useContext)(LayoutContext);
   if (!context) {
     return {
       resetLayout: () => {
@@ -13838,13 +13522,13 @@ function useLayout() {
 // src/design-system/templates/nav-group.tsx
 var import_link = __toESM(require("next/link"));
 var import_navigation3 = require("next/navigation");
-var import_lucide_react60 = require("lucide-react");
-var import_jsx_runtime111 = require("react/jsx-runtime");
+var import_lucide_react59 = require("lucide-react");
+var import_jsx_runtime110 = require("react/jsx-runtime");
 function NavGroup({ title, items }) {
   const { state, isMobile, openMobile, setOpenMobile } = useSidebar();
   const href = (0, import_navigation3.usePathname)();
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(SidebarGroup, { className: cn(title === "Menu" && "pt-0"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(SidebarGroup, { className: cn(title === "Menu" && "pt-0"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
       SidebarGroupLabel,
       {
         className: cn(
@@ -13852,8 +13536,8 @@ function NavGroup({ title, items }) {
           title === "Menu" && state !== "collapsed" && "sticky top-0 z-20 bg-sidebar py-1.5"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: title }),
-          title === "Menu" && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: title }),
+          title === "Menu" && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
             SidebarTrigger,
             {
               variant: "ghost",
@@ -13861,7 +13545,7 @@ function NavGroup({ title, items }) {
               "aria-label": "Toggle sidebar"
             }
           ),
-          title === "Menu" && isMobile && openMobile && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+          title === "Menu" && isMobile && openMobile && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
             Button,
             {
               type: "button",
@@ -13870,37 +13554,37 @@ function NavGroup({ title, items }) {
               className: "size-6 shrink-0",
               "aria-label": "Close sidebar",
               onClick: () => setOpenMobile(false),
-              children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_lucide_react60.X, { className: "size-4", "aria-hidden": "true" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_lucide_react59.X, { className: "size-4", "aria-hidden": "true" })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenu, { children: items.map((item) => {
+    /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenu, { children: items.map((item) => {
       const key = `${item.title}-${item.url}`;
       if (!item.items)
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuLink, { item, href }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuLink, { item, href }, key);
       if (item.title === "Settings" && item.items.length === 0)
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuSettings, { item }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuSettings, { item }, key);
       if (state === "collapsed" && !isMobile)
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuCollapsedDropdown, { item, href }, key);
-      return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuCollapsible, { item, href }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuCollapsedDropdown, { item, href }, key);
+      return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuCollapsible, { item, href }, key);
     }) })
   ] });
 }
 function NavBadge({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(Badge, { className: "rounded-full px-1 py-0 text-xs", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(Badge, { className: "rounded-full px-1 py-0 text-xs", children });
 }
 function SidebarMenuLink({ item, href }) {
   const { setOpenMobile } = useSidebar();
   const { setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
     SidebarMenuButton,
     {
       asChild: true,
       isActive: checkIsActive(href, item),
       tooltip: item.title,
-      children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
         import_link.default,
         {
           href: item.url,
@@ -13909,9 +13593,9 @@ function SidebarMenuLink({ item, href }) {
             setOpenMobile(false);
           },
           children: [
-            item.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(item.icon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: item.title }),
-            item.badge && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(NavBadge, { children: item.badge })
+            item.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(item.icon, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: item.title }),
+            item.badge && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(NavBadge, { children: item.badge })
           ]
         }
       )
@@ -13921,7 +13605,7 @@ function SidebarMenuLink({ item, href }) {
 function SidebarMenuSettings({ item }) {
   const { setOpenMobile } = useSidebar();
   const { showInlineNotFound, setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
     SidebarMenuButton,
     {
       tooltip: item.title,
@@ -13931,8 +13615,8 @@ function SidebarMenuSettings({ item }) {
         setOpenMobile(false);
       },
       children: [
-        item.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(item.icon, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: item.title })
+        item.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(item.icon, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: item.title })
       ]
     }
   ) });
@@ -13943,25 +13627,25 @@ function SidebarMenuCollapsible({
 }) {
   const { setOpenMobile } = useSidebar();
   const { setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
     Collapsible,
     {
       asChild: true,
       defaultOpen: checkIsActive(href, item, true),
       className: "group/collapsible",
-      children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(SidebarMenuItem, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(SidebarMenuButton, { tooltip: item.title, children: [
-          item.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(item.icon, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: item.title }),
-          item.badge && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(NavBadge, { children: item.badge }),
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_lucide_react60.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 rtl:rotate-180" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(SidebarMenuItem, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(SidebarMenuButton, { tooltip: item.title, children: [
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(item.icon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: item.title }),
+          item.badge && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(NavBadge, { children: item.badge }),
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_lucide_react59.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 rtl:rotate-180" })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(CollapsibleContent, { className: "CollapsibleContent", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuSub, { children: item.items.map((subItem) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuSubItem, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(CollapsibleContent, { className: "CollapsibleContent", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuSub, { children: item.items.map((subItem) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuSubItem, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
           SidebarMenuSubButton,
           {
             asChild: true,
             isActive: checkIsActive(href, subItem),
-            children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
               import_link.default,
               {
                 href: subItem.url,
@@ -13970,9 +13654,9 @@ function SidebarMenuCollapsible({
                   setOpenMobile(false);
                 },
                 children: [
-                  subItem.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(subItem.icon, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: subItem.title }),
-                  subItem.badge && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(NavBadge, { children: subItem.badge })
+                  subItem.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(subItem.icon, {}),
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: subItem.title }),
+                  subItem.badge && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(NavBadge, { children: subItem.badge })
                 ]
               }
             )
@@ -13986,36 +13670,36 @@ function SidebarMenuCollapsedDropdown({
   item,
   href
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
       SidebarMenuButton,
       {
         tooltip: item.title,
         isActive: checkIsActive(href, item),
         children: [
-          item.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(item.icon, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { children: item.title }),
-          item.badge && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(NavBadge, { children: item.badge }),
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_lucide_react60.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(item.icon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: item.title }),
+          item.badge && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(NavBadge, { children: item.badge }),
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_lucide_react59.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(DropdownMenuContent, { side: "right", align: "start", sideOffset: 4, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(DropdownMenuLabel, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(DropdownMenuContent, { side: "right", align: "start", sideOffset: 4, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(DropdownMenuLabel, { children: [
         item.title,
         " ",
         item.badge ? `(${item.badge})` : ""
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(DropdownMenuSeparator, {}),
-      item.items.map((sub) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(DropdownMenuSeparator, {}),
+      item.items.map((sub) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
         import_link.default,
         {
           href: sub.url,
           className: `${checkIsActive(href, sub) ? "bg-secondary" : ""}`,
           children: [
-            sub.icon && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(sub.icon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "max-w-52 text-wrap", children: sub.title }),
-            sub.badge && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "ms-auto text-xs", children: sub.badge })
+            sub.icon && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(sub.icon, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { className: "max-w-52 text-wrap", children: sub.title }),
+            sub.badge && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { className: "ms-auto text-xs", children: sub.badge })
           ]
         }
       ) }, `${sub.title}-${sub.url}`))
@@ -14030,20 +13714,20 @@ function checkIsActive(href, item, mainNav = false) {
 }
 
 // src/design-system/templates/team-switcher.tsx
-var import_jsx_runtime112 = require("react/jsx-runtime");
+var import_jsx_runtime111 = require("react/jsx-runtime");
 function TeamSwitcher({ teams }) {
   useSidebar();
   const activeTeam = teams[0];
-  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
     SidebarMenuButton,
     {
       size: "lg",
       className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(activeTeam.logo, { className: "size-4" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("span", { className: "truncate font-semibold", children: activeTeam.name }),
-          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("span", { className: "truncate text-xs", children: activeTeam.plan })
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(activeTeam.logo, { className: "size-4" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "truncate font-semibold", children: activeTeam.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "truncate text-xs", children: activeTeam.plan })
         ] })
       ]
     }
@@ -14051,25 +13735,25 @@ function TeamSwitcher({ teams }) {
 }
 
 // src/design-system/templates/nav-user.tsx
-var import_lucide_react62 = require("lucide-react");
+var import_lucide_react61 = require("lucide-react");
 
 // src/hooks/use-dialog-state.tsx
-var import_react23 = require("react");
+var import_react22 = require("react");
 function useDialogState(initialState2 = null) {
-  const [open, _setOpen] = (0, import_react23.useState)(initialState2);
+  const [open, _setOpen] = (0, import_react22.useState)(initialState2);
   const setOpen = (str) => _setOpen((prev) => prev === str ? null : str);
   return [open, setOpen];
 }
 
 // src/components/config-drawer.tsx
-var import_react24 = require("react");
+var import_react23 = require("react");
 var import_react_radio_group = require("@radix-ui/react-radio-group");
-var import_lucide_react61 = require("lucide-react");
+var import_lucide_react60 = require("lucide-react");
 
 // src/assets/custom/icon-theme-dark.tsx
-var import_jsx_runtime113 = require("react/jsx-runtime");
+var import_jsx_runtime112 = require("react/jsx-runtime");
 function IconThemeDark(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
     "svg",
     {
       "data-name": "icon-theme-dark",
@@ -14077,27 +13761,27 @@ function IconThemeDark(props) {
       viewBox: "0 0 79.86 51.14",
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { fill: "#1d2b3f", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("rect", { x: 0.53, y: 0.5, width: 78.83, height: 50.14, rx: 3.5, ry: 3.5 }),
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("path", { d: "M75.86 1c1.65 0 3 1.35 3 3v43.14c0 1.65-1.35 3-3 3H4.03c-1.65 0-3-1.35-3-3V4c0-1.65 1.35-3 3-3h71.83m0-1H4.03c-2.21 0-4 1.79-4 4v43.14c0 2.21 1.79 4 4 4h71.83c2.21 0 4-1.79 4-4V4c0-2.21-1.79-4-4-4z" })
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("g", { fill: "#1d2b3f", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("rect", { x: 0.53, y: 0.5, width: 78.83, height: 50.14, rx: 3.5, ry: 3.5 }),
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("path", { d: "M75.86 1c1.65 0 3 1.35 3 3v43.14c0 1.65-1.35 3-3 3H4.03c-1.65 0-3-1.35-3-3V4c0-1.65 1.35-3 3-3h71.83m0-1H4.03c-2.21 0-4 1.79-4 4v43.14c0 2.21 1.79 4 4 4h71.83c2.21 0 4-1.79 4-4V4c0-2.21-1.79-4-4-4z" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "path",
           {
             d: "M22.88 0h52.97c2.21 0 4 1.79 4 4v43.14c0 2.21-1.79 4-4 4H22.88V0z",
             fill: "#0d1628"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("circle", { cx: 6.7, cy: 7.04, r: 3.54, fill: "#426187" }),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("circle", { cx: 6.7, cy: 7.04, r: 3.54, fill: "#426187" }),
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "path",
           {
             d: "M18.12 6.39h-5.87c-.6 0-1.09-.45-1.09-1s.49-1 1.09-1h5.87c.6 0 1.09.45 1.09 1s-.49 1-1.09 1zM16.55 9.77h-4.24c-.55 0-1-.45-1-1s.45-1 1-1h4.24c.55 0 1 .45 1 1s-.45 1-1 1zM18.32 17.37H4.59c-.69 0-1.25-.47-1.25-1.05s.56-1.05 1.25-1.05h13.73c.69 0 1.25.47 1.25 1.05s-.56 1.05-1.25 1.05zM15.34 21.26h-11c-.55 0-1-.41-1-.91s.45-.91 1-.91h11c.55 0 1 .41 1 .91s-.45.91-1 .91zM16.46 25.57H4.43c-.6 0-1.09-.44-1.09-.98s.49-.98 1.09-.98h12.03c.6 0 1.09.44 1.09.98s-.49.98-1.09.98z",
             fill: "#426187"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { fill: "#2a62bc", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("g", { fill: "#2a62bc", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
             "rect",
             {
               x: 33.36,
@@ -14109,7 +13793,7 @@ function IconThemeDark(props) {
               opacity: 0.32
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
             "rect",
             {
               x: 29.64,
@@ -14121,7 +13805,7 @@ function IconThemeDark(props) {
               opacity: 0.44
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
             "rect",
             {
               x: 37.16,
@@ -14133,7 +13817,7 @@ function IconThemeDark(props) {
               opacity: 0.53
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
             "rect",
             {
               x: 41.19,
@@ -14146,8 +13830,8 @@ function IconThemeDark(props) {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, fill: "#2f5491", opacity: 0.5 }),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, fill: "#2f5491", opacity: 0.5 }),
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "path",
           {
             d: "M62.74 16.32l4.1-6.87c1.19.71 2.18 1.72 2.86 2.92s1.04 2.57 1.04 3.95h-8z",
@@ -14155,7 +13839,7 @@ function IconThemeDark(props) {
             opacity: 0.74
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "rect",
           {
             x: 29.64,
@@ -14173,9 +13857,9 @@ function IconThemeDark(props) {
 }
 
 // src/assets/custom/icon-theme-light.tsx
-var import_jsx_runtime114 = require("react/jsx-runtime");
+var import_jsx_runtime113 = require("react/jsx-runtime");
 function IconThemeLight(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
     "svg",
     {
       "data-name": "icon-theme-light",
@@ -14183,27 +13867,27 @@ function IconThemeLight(props) {
       viewBox: "0 0 79.86 51.14",
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { fill: "#d9d9d9", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("rect", { x: 0.53, y: 0.5, width: 78.83, height: 50.14, rx: 3.5, ry: 3.5 }),
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("path", { d: "M75.86 1c1.65 0 3 1.35 3 3v43.14c0 1.65-1.35 3-3 3H4.03c-1.65 0-3-1.35-3-3V4c0-1.65 1.35-3 3-3h71.83m0-1H4.03c-2.21 0-4 1.79-4 4v43.14c0 2.21 1.79 4 4 4h71.83c2.21 0 4-1.79 4-4V4c0-2.21-1.79-4-4-4z" })
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { fill: "#d9d9d9", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("rect", { x: 0.53, y: 0.5, width: 78.83, height: 50.14, rx: 3.5, ry: 3.5 }),
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("path", { d: "M75.86 1c1.65 0 3 1.35 3 3v43.14c0 1.65-1.35 3-3 3H4.03c-1.65 0-3-1.35-3-3V4c0-1.65 1.35-3 3-3h71.83m0-1H4.03c-2.21 0-4 1.79-4 4v43.14c0 2.21 1.79 4 4 4h71.83c2.21 0 4-1.79 4-4V4c0-2.21-1.79-4-4-4z" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
           "path",
           {
             d: "M22.88 0h52.97c2.21 0 4 1.79 4 4v43.14c0 2.21-1.79 4-4 4H22.88V0z",
             fill: "#ecedef"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("circle", { cx: 6.7, cy: 7.04, r: 3.54, fill: "#fff" }),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("circle", { cx: 6.7, cy: 7.04, r: 3.54, fill: "#fff" }),
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
           "path",
           {
             d: "M18.12 6.39h-5.87c-.6 0-1.09-.45-1.09-1s.49-1 1.09-1h5.87c.6 0 1.09.45 1.09 1s-.49 1-1.09 1zM16.55 9.77h-4.24c-.55 0-1-.45-1-1s.45-1 1-1h4.24c.55 0 1 .45 1 1s-.45 1-1 1zM18.32 17.37H4.59c-.69 0-1.25-.47-1.25-1.05s.56-1.05 1.25-1.05h13.73c.69 0 1.25.47 1.25 1.05s-.56 1.05-1.25 1.05zM15.34 21.26h-11c-.55 0-1-.41-1-.91s.45-.91 1-.91h11c.55 0 1 .41 1 .91s-.45.91-1 .91zM16.46 25.57H4.43c-.6 0-1.09-.44-1.09-.98s.49-.98 1.09-.98h12.03c.6 0 1.09.44 1.09.98s-.49.98-1.09.98z",
             fill: "#fff"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { fill: "#c0c4c4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { fill: "#c0c4c4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
             "rect",
             {
               x: 33.36,
@@ -14215,7 +13899,7 @@ function IconThemeLight(props) {
               opacity: 0.32
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
             "rect",
             {
               x: 29.64,
@@ -14227,7 +13911,7 @@ function IconThemeLight(props) {
               opacity: 0.44
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
             "rect",
             {
               x: 37.16,
@@ -14239,7 +13923,7 @@ function IconThemeLight(props) {
               opacity: 0.53
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
             "rect",
             {
               x: 41.19,
@@ -14252,12 +13936,12 @@ function IconThemeLight(props) {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, fill: "#fff" }),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { fill: "#d9d9d9", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("path", { d: "M63.62 15.82L67 10.15c.93.64 1.7 1.48 2.26 2.47.56.98.89 2.08.96 3.21h-6.6z" }),
-          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("path", { d: "M67.14 10.88a6.977 6.977 0 012.52 4.44h-5.17l2.65-4.44m-.31-1.43l-4.1 6.87h8c0-1.39-.36-2.75-1.04-3.95s-1.67-2.21-2.86-2.92z" })
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, fill: "#fff" }),
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { fill: "#d9d9d9", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("path", { d: "M63.62 15.82L67 10.15c.93.64 1.7 1.48 2.26 2.47.56.98.89 2.08.96 3.21h-6.6z" }),
+          /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("path", { d: "M67.14 10.88a6.977 6.977 0 012.52 4.44h-5.17l2.65-4.44m-.31-1.43l-4.1 6.87h8c0-1.39-.36-2.75-1.04-3.95s-1.67-2.21-2.86-2.92z" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
           "rect",
           {
             x: 29.64,
@@ -14275,12 +13959,12 @@ function IconThemeLight(props) {
 }
 
 // src/assets/custom/icon-theme-system.tsx
-var import_jsx_runtime115 = require("react/jsx-runtime");
+var import_jsx_runtime114 = require("react/jsx-runtime");
 function IconThemeSystem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(
     "svg",
     {
       "data-name": "icon-theme-system",
@@ -14293,8 +13977,8 @@ function IconThemeSystem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("path", { opacity: 0.2, d: "M0 0.03H22.88V51.17H0z" }),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("path", { opacity: 0.2, d: "M0 0.03H22.88V51.17H0z" }),
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "circle",
           {
             cx: 6.7,
@@ -14307,7 +13991,7 @@ function IconThemeSystem({
             strokeMiterlimit: 10
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "path",
           {
             d: "M18.12 6.39h-5.87c-.6 0-1.09-.45-1.09-1s.49-1 1.09-1h5.87c.6 0 1.09.45 1.09 1s-.49 1-1.09 1zM16.55 9.77h-4.24c-.55 0-1-.45-1-1s.45-1 1-1h4.24c.55 0 1 .45 1 1s-.45 1-1 1z",
@@ -14316,7 +14000,7 @@ function IconThemeSystem({
             opacity: 0.75
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "path",
           {
             d: "M18.32 17.37H4.59c-.69 0-1.25-.47-1.25-1.05s.56-1.05 1.25-1.05h13.73c.69 0 1.25.47 1.25 1.05s-.56 1.05-1.25 1.05z",
@@ -14325,7 +14009,7 @@ function IconThemeSystem({
             opacity: 0.72
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "path",
           {
             d: "M15.34 21.26h-11c-.55 0-1-.41-1-.91s.45-.91 1-.91h11c.55 0 1 .41 1 .91s-.45.91-1 .91z",
@@ -14334,7 +14018,7 @@ function IconThemeSystem({
             opacity: 0.55
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "path",
           {
             d: "M16.46 25.57H4.43c-.6 0-1.09-.44-1.09-.98s.49-.98 1.09-.98h12.03c.6 0 1.09.44 1.09.98s-.49.98-1.09.98z",
@@ -14343,7 +14027,7 @@ function IconThemeSystem({
             opacity: 0.67
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "rect",
           {
             x: 33.36,
@@ -14356,7 +14040,7 @@ function IconThemeSystem({
             stroke: "none"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "rect",
           {
             x: 29.64,
@@ -14369,7 +14053,7 @@ function IconThemeSystem({
             stroke: "none"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "rect",
           {
             x: 37.16,
@@ -14382,7 +14066,7 @@ function IconThemeSystem({
             stroke: "none"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "rect",
           {
             x: 41.19,
@@ -14395,9 +14079,9 @@ function IconThemeSystem({
             stroke: "none"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, opacity: 0.25 }),
-          /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("circle", { cx: 62.74, cy: 16.32, r: 8, opacity: 0.25 }),
+          /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
             "path",
             {
               d: "M62.74 16.32l4.1-6.87c1.19.71 2.18 1.72 2.86 2.92s1.04 2.57 1.04 3.95h-8z",
@@ -14405,7 +14089,7 @@ function IconThemeSystem({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
           "rect",
           {
             x: 29.64,
@@ -14426,7 +14110,7 @@ function IconThemeSystem({
 }
 
 // src/components/config-drawer.tsx
-var import_jsx_runtime116 = require("react/jsx-runtime");
+var import_jsx_runtime115 = require("react/jsx-runtime");
 function ConfigDrawer({
   trigger
 }) {
@@ -14436,27 +14120,27 @@ function ConfigDrawer({
     resetTheme();
     resetColorTheme();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(Sheet, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SheetTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(Sheet, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(SheetTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       Button,
       {
         size: "icon",
         variant: "ghost",
         "aria-label": "Open theme settings",
         className: "rounded-full",
-        children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.Settings, { "aria-hidden": "true" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react60.Settings, { "aria-hidden": "true" })
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(SheetContent, { className: "flex flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(SheetHeader, { className: "pb-0 text-start", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SheetTitle, { children: "Theme Settings" }),
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SheetDescription, { children: "Customize the look and feel of your dashboard." })
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(SheetContent, { className: "flex flex-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(SheetHeader, { className: "pb-0 text-start", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(SheetTitle, { children: "Theme Settings" }),
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(SheetDescription, { children: "Customize the look and feel of your dashboard." })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex flex-1 flex-col gap-6 overflow-hidden px-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(ThemeConfig, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(ThemeListSelector, {})
+      /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex flex-1 flex-col gap-6 overflow-hidden px-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(ThemeConfig, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(ThemeListSelector, {})
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SheetFooter, { className: "gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(SheetFooter, { className: "gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
         Button,
         {
           variant: "destructive",
@@ -14474,7 +14158,7 @@ function SectionTitle({
   resetAriaLabel,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
     "div",
     {
       className: cn(
@@ -14483,7 +14167,7 @@ function SectionTitle({
       ),
       children: [
         title,
-        showReset && onReset && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        showReset && onReset && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
           Button,
           {
             type: "button",
@@ -14492,7 +14176,7 @@ function SectionTitle({
             className: "size-4 rounded-full",
             onClick: onReset,
             "aria-label": resetAriaLabel,
-            children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.RotateCcw, { className: "size-3" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react60.RotateCcw, { className: "size-3" })
           }
         )
       ]
@@ -14503,7 +14187,7 @@ function RadioGroupItem2({
   item,
   isTheme = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
     import_react_radio_group.Item,
     {
       value: item.value,
@@ -14511,7 +14195,7 @@ function RadioGroupItem2({
       "aria-label": `Select ${item.label.toLowerCase()}`,
       "aria-describedby": `${item.value}-description`,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
           "div",
           {
             className: cn(
@@ -14523,8 +14207,8 @@ function RadioGroupItem2({
             "aria-hidden": "false",
             "aria-label": `${item.label} option preview`,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
-                import_lucide_react61.CircleCheck,
+              /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                import_lucide_react60.CircleCheck,
                 {
                   className: cn(
                     "size-6 fill-primary stroke-white",
@@ -14534,7 +14218,7 @@ function RadioGroupItem2({
                   "aria-hidden": "true"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
                 item.icon,
                 {
                   className: cn(
@@ -14546,7 +14230,7 @@ function RadioGroupItem2({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
           "div",
           {
             className: "mt-1 text-xs",
@@ -14561,8 +14245,8 @@ function RadioGroupItem2({
 }
 function ThemeConfig() {
   const { defaultTheme, theme, setTheme } = useTheme2();
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       SectionTitle,
       {
         title: "Theme",
@@ -14571,7 +14255,7 @@ function ThemeConfig() {
         resetAriaLabel: "Reset theme preference to default"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       import_react_radio_group.Root,
       {
         value: theme,
@@ -14595,20 +14279,20 @@ function ThemeConfig() {
             label: "Dark",
             icon: IconThemeDark
           }
-        ].map((item) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(RadioGroupItem2, { item, isTheme: true }, item.value))
+        ].map((item) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(RadioGroupItem2, { item, isTheme: true }, item.value))
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { id: "theme-description", className: "sr-only", children: "Choose between system preference, light mode, or dark mode" })
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { id: "theme-description", className: "sr-only", children: "Choose between system preference, light mode, or dark mode" })
   ] });
 }
 function ThemeListSelector() {
-  const [search, setSearch] = (0, import_react24.useState)("");
+  const [search, setSearch] = (0, import_react23.useState)("");
   const { colorTheme, setColorTheme } = useColorTheme();
   const filtered = colorThemes.filter(
     (t) => t.label.toLowerCase().includes(search.toLowerCase())
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex min-h-0 flex-1 flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex min-h-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       SectionTitle,
       {
         title: "Color Theme",
@@ -14617,9 +14301,9 @@ function ThemeListSelector() {
         resetAriaLabel: "Reset color theme to default"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "relative mb-2.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.Search, { className: "pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "relative mb-2.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react60.Search, { className: "pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
+      /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
         "input",
         {
           type: "text",
@@ -14635,21 +14319,21 @@ function ThemeListSelector() {
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("p", { className: "mb-2 text-xs text-muted-foreground font-medium", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("p", { className: "mb-2 text-xs text-muted-foreground font-medium", children: [
       filtered.length,
       " theme",
       filtered.length !== 1 ? "s" : "",
       " available"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
       "div",
       {
         className: "flex-1 space-y-1 overflow-y-auto rounded-lg pr-1",
         role: "radiogroup",
         "aria-label": "Select color theme",
         children: [
-          filtered.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("p", { className: "py-8 text-center text-sm text-muted-foreground", children: "No themes found" }),
-          filtered.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+          filtered.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("p", { className: "py-8 text-center text-sm text-muted-foreground", children: "No themes found" }),
+          filtered.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
             "button",
             {
               onClick: () => setColorTheme(ct.name),
@@ -14661,7 +14345,7 @@ function ThemeListSelector() {
                 colorTheme === ct.name ? "bg-primary text-primary-foreground shadow-md" : "hover:bg-accent/80 hover:text-foreground border border-transparent hover:border-border/40"
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { className: "flex gap-1.5 shrink-0", children: ct.colors.map((color, i) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { className: "flex gap-1.5 shrink-0", children: ct.colors.map((color, i) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
                   "span",
                   {
                     className: cn(
@@ -14672,9 +14356,9 @@ function ThemeListSelector() {
                   },
                   i
                 )) }),
-                /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex items-center gap-1.5 truncate", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "text-sm font-medium truncate", children: ct.label }),
-                  ct.category === "tweakcn" && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex items-center gap-1.5 truncate", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("span", { className: "text-sm font-medium truncate", children: ct.label }),
+                  ct.category === "tweakcn" && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
                     "span",
                     {
                       className: cn(
@@ -14684,7 +14368,7 @@ function ThemeListSelector() {
                     }
                   )
                 ] }),
-                colorTheme === ct.name && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.Check, { className: "ml-auto size-4 shrink-0", strokeWidth: 3 })
+                colorTheme === ct.name && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react60.Check, { className: "ml-auto size-4 shrink-0", strokeWidth: 3 })
               ]
             },
             ct.name
@@ -14696,7 +14380,7 @@ function ThemeListSelector() {
 }
 
 // src/design-system/templates/nav-user.tsx
-var import_jsx_runtime117 = require("react/jsx-runtime");
+var import_jsx_runtime116 = require("react/jsx-runtime");
 function NavUser({ user: fallbackUser }) {
   const { isMobile } = useSidebar();
   const [open, setOpen] = useDialogState();
@@ -14705,28 +14389,28 @@ function NavUser({ user: fallbackUser }) {
   const userEmail = auth.user?.email || fallbackUser.email;
   const userAvatar = auth.user?.picture || fallbackUser.avatar;
   const userInitials = userName.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(import_jsx_runtime117.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(import_jsx_runtime116.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(DropdownMenu, { modal: false, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
         SidebarMenuButton,
         {
           size: "lg",
           tooltip: userName,
           className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "truncate font-semibold", children: userName }),
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "truncate font-semibold", children: userName }),
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_lucide_react62.ChevronsUpDown, { className: "ml-auto size-4 shrink-0" })
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.ChevronsUpDown, { className: "ml-auto size-4 shrink-0" })
           ]
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
         DropdownMenuContent,
         {
           className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg",
@@ -14734,43 +14418,43 @@ function NavUser({ user: fallbackUser }) {
           align: "end",
           sideOffset: 4,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(DropdownMenuLabel, { className: "p-0 font-normal", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "flex items-center gap-2 px-1 py-1.5 text-start text-sm", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
-                /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DropdownMenuLabel, { className: "p-0 font-normal", children: /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex items-center gap-2 px-1 py-1.5 text-start text-sm", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
+                /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "truncate font-semibold", children: userName }),
-                /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "truncate font-semibold", children: userName }),
+                /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
               ] })
             ] }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
               ConfigDrawer,
               {
-                trigger: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_lucide_react62.Palette, { className: "mr-2 h-4 w-4" }),
+                trigger: /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.Palette, { className: "mr-2 h-4 w-4" }),
                   "Theme"
                 ] })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
               ConfigDrawer,
               {
-                trigger: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_lucide_react62.Settings, { className: "mr-2 h-4 w-4" }),
+                trigger: /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.Settings, { className: "mr-2 h-4 w-4" }),
                   "Setting"
                 ] })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
               DropdownMenuItem,
               {
                 variant: "destructive",
                 onClick: () => setOpen(true),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_lucide_react62.LogOut, { className: "mr-2 h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react61.LogOut, { className: "mr-2 h-4 w-4" }),
                   "Sign out"
                 ]
               }
@@ -14779,19 +14463,19 @@ function NavUser({ user: fallbackUser }) {
         }
       )
     ] }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(SignOutDialog, { open: !!open, onOpenChange: setOpen })
+    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(SignOutDialog, { open: !!open, onOpenChange: setOpen })
   ] });
 }
 
 // src/design-system/templates/app-sidebar.tsx
-var import_jsx_runtime118 = require("react/jsx-runtime");
+var import_jsx_runtime117 = require("react/jsx-runtime");
 function AppSidebar() {
   const { collapsible } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(Sidebar, { collapsible, variant: "sidebar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(SidebarHeader, { className: "p-2 pb-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { className: "flex items-center justify-between gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(TeamSwitcher, { teams: sidebarData2.teams }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "group-data-[collapsible=icon]:hidden shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(Sidebar, { collapsible, variant: "sidebar", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(SidebarHeader, { className: "p-2 pb-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "flex items-center justify-between gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TeamSwitcher, { teams: sidebarData2.teams }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "group-data-[collapsible=icon]:hidden shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
           SidebarTrigger,
           {
             variant: "ghost",
@@ -14800,7 +14484,7 @@ function AppSidebar() {
           }
         ) })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "hidden group-data-[collapsible=icon]:flex justify-center pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "hidden group-data-[collapsible=icon]:flex justify-center pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         SidebarTrigger,
         {
           variant: "ghost",
@@ -14809,37 +14493,37 @@ function AppSidebar() {
         }
       ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(SidebarContent, { children: sidebarData2.navGroups.map((props) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(NavGroup, { ...props }, props.title)) }),
-    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(NavUser, { user: sidebarData2.user }) })
+    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(SidebarContent, { children: sidebarData2.navGroups.map((props) => /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(NavGroup, { ...props }, props.title)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(NavUser, { user: sidebarData2.user }) })
   ] });
 }
 
 // src/design-system/templates/app-title.tsx
 var import_link2 = __toESM(require("next/link"));
-var import_lucide_react63 = require("lucide-react");
-var import_jsx_runtime119 = require("react/jsx-runtime");
+var import_lucide_react62 = require("lucide-react");
+var import_jsx_runtime118 = require("react/jsx-runtime");
 function AppTitle() {
   const { setOpenMobile } = useSidebar();
-  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     SidebarMenuButton,
     {
       size: "lg",
       className: "gap-0 py-0 hover:bg-transparent active:bg-transparent",
       asChild: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
           import_link2.default,
           {
             href: "/",
             onClick: () => setOpenMobile(false),
             className: "grid flex-1 text-start text-sm leading-tight",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { className: "truncate font-bold", children: "Shadcn-Admin" }),
-              /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { className: "truncate text-xs", children: "Vite + ShadcnUI" })
+              /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("span", { className: "truncate font-bold", children: "Shadcn-Admin" }),
+              /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("span", { className: "truncate text-xs", children: "Vite + ShadcnUI" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(ToggleSidebar, {})
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(ToggleSidebar, {})
       ] })
     }
   ) }) });
@@ -14850,7 +14534,7 @@ function ToggleSidebar({
   ...props
 }) {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
     Button,
     {
       "data-sidebar": "trigger",
@@ -14864,31 +14548,31 @@ function ToggleSidebar({
       },
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_lucide_react63.X, { className: "md:hidden" }),
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_lucide_react63.Menu, { className: "max-md:hidden" }),
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_lucide_react62.X, { className: "md:hidden" }),
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_lucide_react62.Menu, { className: "max-md:hidden" }),
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
       ]
     }
   );
 }
 
 // src/design-system/templates/authenticated-layout.tsx
-var import_react26 = require("react");
+var import_react25 = require("react");
 var import_navigation6 = require("next/navigation");
 
 // src/components/layout/app-sidebar.tsx
-var import_react25 = require("react");
+var import_react24 = require("react");
 
 // src/components/layout/nav-group.tsx
 var import_link3 = __toESM(require("next/link"));
 var import_navigation4 = require("next/navigation");
-var import_lucide_react64 = require("lucide-react");
-var import_jsx_runtime120 = require("react/jsx-runtime");
+var import_lucide_react63 = require("lucide-react");
+var import_jsx_runtime119 = require("react/jsx-runtime");
 function NavGroup2({ title, items }) {
   const { state, isMobile, openMobile, setOpenMobile } = useSidebar();
   const href = (0, import_navigation4.usePathname)();
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(SidebarGroup, { className: cn(title === "Menu" && "pt-0"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(SidebarGroup, { className: cn(title === "Menu" && "pt-0"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
       SidebarGroupLabel,
       {
         className: cn(
@@ -14896,8 +14580,8 @@ function NavGroup2({ title, items }) {
           title === "Menu" && state !== "collapsed" && "sticky top-0 z-20 bg-sidebar py-1.5"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: title }),
-          title === "Menu" && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: title }),
+          title === "Menu" && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
             SidebarTrigger,
             {
               variant: "ghost",
@@ -14905,7 +14589,7 @@ function NavGroup2({ title, items }) {
               "aria-label": "Toggle sidebar"
             }
           ),
-          title === "Menu" && isMobile && openMobile && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+          title === "Menu" && isMobile && openMobile && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
             Button,
             {
               type: "button",
@@ -14914,37 +14598,37 @@ function NavGroup2({ title, items }) {
               className: "size-6 shrink-0",
               "aria-label": "Close sidebar",
               onClick: () => setOpenMobile(false),
-              children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.X, { className: "size-4", "aria-hidden": "true" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_lucide_react63.X, { className: "size-4", "aria-hidden": "true" })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenu, { children: items.map((item) => {
+    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenu, { children: items.map((item) => {
       const key = `${item.title}-${item.url}`;
       if (!item.items)
-        return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuLink2, { item, href }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuLink2, { item, href }, key);
       if (item.title === "Settings" && item.items.length === 0)
-        return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuSettings2, { item }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuSettings2, { item }, key);
       if (state === "collapsed" && !isMobile)
-        return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuCollapsedDropdown2, { item, href }, key);
-      return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuCollapsible2, { item, href }, key);
+        return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuCollapsedDropdown2, { item, href }, key);
+      return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuCollapsible2, { item, href }, key);
     }) })
   ] });
 }
 function NavBadge2({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(Badge, { className: "rounded-full px-1 py-0 text-xs", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Badge, { className: "rounded-full px-1 py-0 text-xs", children });
 }
 function SidebarMenuLink2({ item, href }) {
   const { setOpenMobile } = useSidebar();
   const { setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
     SidebarMenuButton,
     {
       asChild: true,
       isActive: checkIsActive2(href, item),
       tooltip: item.title,
-      children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
         import_link3.default,
         {
           href: item.url,
@@ -14953,9 +14637,9 @@ function SidebarMenuLink2({ item, href }) {
             setOpenMobile(false);
           },
           children: [
-            item.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(item.icon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: item.title }),
-            item.badge && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(NavBadge2, { children: item.badge })
+            item.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(item.icon, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: item.title }),
+            item.badge && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(NavBadge2, { children: item.badge })
           ]
         }
       )
@@ -14965,7 +14649,7 @@ function SidebarMenuLink2({ item, href }) {
 function SidebarMenuSettings2({ item }) {
   const { setOpenMobile } = useSidebar();
   const { showInlineNotFound, setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
     SidebarMenuButton,
     {
       tooltip: item.title,
@@ -14975,8 +14659,8 @@ function SidebarMenuSettings2({ item }) {
         setOpenMobile(false);
       },
       children: [
-        item.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(item.icon, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: item.title })
+        item.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(item.icon, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: item.title })
       ]
     }
   ) });
@@ -14987,25 +14671,25 @@ function SidebarMenuCollapsible2({
 }) {
   const { setOpenMobile } = useSidebar();
   const { setShowInlineNotFound } = useLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
     Collapsible,
     {
       asChild: true,
       defaultOpen: checkIsActive2(href, item, true),
       className: "group/collapsible",
-      children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(SidebarMenuItem, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(SidebarMenuButton, { tooltip: item.title, children: [
-          item.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(item.icon, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: item.title }),
-          item.badge && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(NavBadge2, { children: item.badge }),
-          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 rtl:rotate-180" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(SidebarMenuItem, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(SidebarMenuButton, { tooltip: item.title, children: [
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(item.icon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: item.title }),
+          item.badge && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(NavBadge2, { children: item.badge }),
+          /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_lucide_react63.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 rtl:rotate-180" })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(CollapsibleContent, { className: "CollapsibleContent", children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuSub, { children: item.items.map((subItem) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuSubItem, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(CollapsibleContent, { className: "CollapsibleContent", children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuSub, { children: item.items.map((subItem) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuSubItem, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
           SidebarMenuSubButton,
           {
             asChild: true,
             isActive: checkIsActive2(href, subItem),
-            children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
               import_link3.default,
               {
                 href: subItem.url,
@@ -15014,9 +14698,9 @@ function SidebarMenuCollapsible2({
                   setOpenMobile(false);
                 },
                 children: [
-                  subItem.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(subItem.icon, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: subItem.title }),
-                  subItem.badge && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(NavBadge2, { children: subItem.badge })
+                  subItem.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(subItem.icon, {}),
+                  /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: subItem.title }),
+                  subItem.badge && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(NavBadge2, { children: subItem.badge })
                 ]
               }
             )
@@ -15030,36 +14714,36 @@ function SidebarMenuCollapsedDropdown2({
   item,
   href
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
       SidebarMenuButton,
       {
         tooltip: item.title,
         isActive: checkIsActive2(href, item),
         children: [
-          item.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(item.icon, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: item.title }),
-          item.badge && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(NavBadge2, { children: item.badge }),
-          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(item.icon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { children: item.title }),
+          item.badge && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(NavBadge2, { children: item.badge }),
+          /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_lucide_react63.ChevronRight, { className: "ms-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuContent, { side: "right", align: "start", sideOffset: 4, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuLabel, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(DropdownMenuContent, { side: "right", align: "start", sideOffset: 4, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(DropdownMenuLabel, { children: [
         item.title,
         " ",
         item.badge ? `(${item.badge})` : ""
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuSeparator, {}),
-      item.items.map((sub) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(DropdownMenuSeparator, {}),
+      item.items.map((sub) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
         import_link3.default,
         {
           href: sub.url,
           className: `${checkIsActive2(href, sub) ? "bg-secondary" : ""}`,
           children: [
-            sub.icon && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(sub.icon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "max-w-52 text-wrap", children: sub.title }),
-            sub.badge && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "ms-auto text-xs", children: sub.badge })
+            sub.icon && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(sub.icon, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { className: "max-w-52 text-wrap", children: sub.title }),
+            sub.badge && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { className: "ms-auto text-xs", children: sub.badge })
           ]
         }
       ) }, `${sub.title}-${sub.url}`))
@@ -15074,9 +14758,9 @@ function checkIsActive2(href, item, mainNav = false) {
 }
 
 // src/components/layout/nav-user.tsx
-var import_lucide_react65 = require("lucide-react");
+var import_lucide_react64 = require("lucide-react");
 var import_link4 = __toESM(require("next/link"));
-var import_jsx_runtime121 = require("react/jsx-runtime");
+var import_jsx_runtime120 = require("react/jsx-runtime");
 function NavUser2({ user: fallbackUser }) {
   const { isMobile } = useSidebar();
   const [open, setOpen] = useDialogState();
@@ -15086,28 +14770,28 @@ function NavUser2({ user: fallbackUser }) {
   const userEmail = auth.user?.email || fallbackUser.email;
   const userAvatar = auth.user?.picture || fallbackUser.avatar;
   const userInitials = userName.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_jsx_runtime121.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenu, { modal: false, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
         SidebarMenuButton,
         {
           size: "lg",
           tooltip: userName,
           className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "truncate font-semibold", children: userName }),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "truncate font-semibold", children: userName }),
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.ChevronsUpDown, { className: "ml-auto size-4 shrink-0" })
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.ChevronsUpDown, { className: "ml-auto size-4 shrink-0" })
           ]
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
         DropdownMenuContent,
         {
           className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg",
@@ -15115,59 +14799,59 @@ function NavUser2({ user: fallbackUser }) {
           align: "end",
           sideOffset: 4,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuLabel, { className: "p-0 font-normal", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "flex items-center gap-2 px-1 py-1.5 text-start text-sm", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
-                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuLabel, { className: "p-0 font-normal", children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { className: "flex items-center gap-2 px-1 py-1.5 text-start text-sm", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(AvatarImage, { src: userAvatar, alt: userName }),
+                /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(AvatarFallback, { className: "rounded-lg", children: userInitials })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "truncate font-semibold", children: userName }),
-                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { className: "grid flex-1 text-start text-sm leading-tight", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "truncate font-semibold", children: userName }),
+                /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: userEmail })
               ] })
             ] }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.User, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.User, { className: "mr-2 h-4 w-4" }),
               "My Profile"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.Bell, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.Bell, { className: "mr-2 h-4 w-4" }),
               "Notifications"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.MessageCircle, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.MessageCircle, { className: "mr-2 h-4 w-4" }),
               "Help & Support"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.CreditCard, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.CreditCard, { className: "mr-2 h-4 w-4" }),
               "Subscriptions"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_link4.default, { href: "/apps", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.ShoppingBag, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_link4.default, { href: "/apps", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.ShoppingBag, { className: "mr-2 h-4 w-4" }),
               "Buy Apps"
             ] }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
               ConfigDrawer,
               {
-                trigger: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.Palette, { className: "mr-2 h-4 w-4" }),
+                trigger: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onSelect: (e) => e.preventDefault(), children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.Palette, { className: "mr-2 h-4 w-4" }),
                   "Theme Settings"
                 ] })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.Settings, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(DropdownMenuItem, { onClick: () => setShowInlineNotFound(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.Settings, { className: "mr-2 h-4 w-4" }),
               "Settings"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
               DropdownMenuItem,
               {
                 variant: "destructive",
                 onClick: () => setOpen(true),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_lucide_react65.LogOut, { className: "mr-2 h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_lucide_react64.LogOut, { className: "mr-2 h-4 w-4" }),
                   "Sign out"
                 ]
               }
@@ -15176,12 +14860,12 @@ function NavUser2({ user: fallbackUser }) {
         }
       )
     ] }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SignOutDialog, { open: !!open, onOpenChange: setOpen })
+    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(SignOutDialog, { open: !!open, onOpenChange: setOpen })
   ] });
 }
 
 // src/components/layout/app-sidebar.tsx
-var import_jsx_runtime122 = (
+var import_jsx_runtime121 = (
   // Sidebar ko fixed "sidebar" variant par lock kiya gaya hai (floating remove).
   require("react/jsx-runtime")
 );
@@ -15189,7 +14873,7 @@ function AppSidebar2() {
   const { collapsible } = useLayout();
   const currentUser = useAuthStore((state) => state.auth.user);
   const { unreadCount, fetchNotifications, subscribeToNotifications, unsubscribe } = useNotificationStore();
-  (0, import_react25.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (currentUser) {
       fetchNotifications(currentUser.accountNo);
       subscribeToNotifications(currentUser.accountNo);
@@ -15213,9 +14897,9 @@ function AppSidebar2() {
       })
     }))
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(Sidebar, { collapsible, variant: "sidebar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(SidebarHeader, { className: "pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(TeamSwitcher, { teams: dynamicSidebarData.teams }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { className: "hidden group-data-[state=collapsed]:flex justify-center py-2", children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(Sidebar, { collapsible, variant: "sidebar", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SidebarHeader, { className: "pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(TeamSwitcher, { teams: dynamicSidebarData.teams }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "hidden group-data-[state=collapsed]:flex justify-center py-2", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
       SidebarTrigger,
       {
         variant: "ghost",
@@ -15223,15 +14907,15 @@ function AppSidebar2() {
         "aria-label": "Toggle sidebar"
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(SidebarContent, { children: dynamicSidebarData.navGroups.map((props) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(NavGroup2, { ...props }, props.title)) }),
-    /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(NavUser2, { user: dynamicSidebarData.user }) })
+    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SidebarContent, { children: dynamicSidebarData.navGroups.map((props) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(NavGroup2, { ...props }, props.title)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(NavUser2, { user: dynamicSidebarData.user }) })
   ] });
 }
 
 // src/components/skip-to-main.tsx
-var import_jsx_runtime123 = require("react/jsx-runtime");
+var import_jsx_runtime122 = require("react/jsx-runtime");
 function SkipToMain() {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
     "a",
     {
       className: `fixed inset-s-44 z-999 -translate-y-52 bg-primary px-4 py-2 text-sm font-medium whitespace-nowrap text-primary-foreground opacity-95 shadow-sm transition hover:bg-primary/90 focus:translate-y-3 focus:transform focus-visible:ring-1 focus-visible:ring-ring`,
@@ -15243,7 +14927,7 @@ function SkipToMain() {
 
 // src/features/errors/not-found-error.tsx
 var import_navigation5 = require("next/navigation");
-var import_jsx_runtime124 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 function NotFoundError({
   className,
   embedded = false,
@@ -15261,8 +14945,8 @@ function NotFoundError({
     if (onDismiss) onDismiss();
     router.push("/");
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className: cn(embedded ? "min-h-96 w-full py-8" : "h-svh", className), children: /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { className: "m-auto flex h-full w-full flex-col items-center justify-center gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { className: cn(embedded ? "min-h-96 w-full py-8" : "h-svh", className), children: /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)("div", { className: "m-auto flex h-full w-full flex-col items-center justify-center gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
       "h1",
       {
         className: cn(
@@ -15272,31 +14956,31 @@ function NotFoundError({
         children: "404"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("span", { className: "font-medium", children: "Oops! Page Not Found :-(!" }),
-    /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("p", { className: "text-center text-muted-foreground", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("span", { className: "font-medium", children: "Oops! Page Not Found :-(!" }),
+    /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)("p", { className: "text-center text-muted-foreground", children: [
       "It seems like the page you're looking for ",
-      /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("br", {}),
+      /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("br", {}),
       "does not exist or might have been removed."
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { className: "mt-6 flex gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Button, { variant: "outline", onClick: handleGoBack, children: "Go Back" }),
-      /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Button, { onClick: handleGoHome, children: "Back to Home" })
+    /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)("div", { className: "mt-6 flex gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Button, { variant: "outline", onClick: handleGoBack, children: "Go Back" }),
+      /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Button, { onClick: handleGoHome, children: "Back to Home" })
     ] })
   ] }) });
 }
 
 // src/design-system/templates/authenticated-layout.tsx
-var import_jsx_runtime125 = require("react/jsx-runtime");
+var import_jsx_runtime124 = require("react/jsx-runtime");
 function AuthenticatedLayoutContent({ children }) {
   const { showInlineNotFound, setShowInlineNotFound } = useLayout();
   const pathname = (0, import_navigation6.usePathname)();
-  (0, import_react26.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     setShowInlineNotFound(false);
   }, [pathname, setShowInlineNotFound]);
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(import_jsx_runtime125.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(SkipToMain, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(AppSidebar2, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(import_jsx_runtime124.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(SkipToMain, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(AppSidebar2, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
       SidebarInset,
       {
         className: cn(
@@ -15304,7 +14988,7 @@ function AuthenticatedLayoutContent({ children }) {
           "has-[[data-layout=fixed]]:h-svh has-data-[layout=fixed]:h-svh",
           "peer-data-[variant=inset]:has-data-[layout=fixed]:h-[calc(100svh-(var(--spacing)*4))]"
         ),
-        children: showInlineNotFound ? /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
+        children: showInlineNotFound ? /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
           NotFoundError,
           {
             embedded: true,
@@ -15316,24 +15000,24 @@ function AuthenticatedLayoutContent({ children }) {
   ] });
 }
 function AuthenticatedLayout({ children }) {
-  const [defaultOpen, setDefaultOpen] = (0, import_react26.useState)(true);
-  const [isMounted, setIsMounted] = (0, import_react26.useState)(false);
-  (0, import_react26.useEffect)(() => {
+  const [defaultOpen, setDefaultOpen] = (0, import_react25.useState)(true);
+  const [isMounted, setIsMounted] = (0, import_react25.useState)(false);
+  (0, import_react25.useEffect)(() => {
     setDefaultOpen(getCookie("sidebar_state") !== "false");
     setIsMounted(true);
   }, []);
   if (!isMounted) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(SearchProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(LayoutProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(SidebarProvider, { defaultOpen, children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(AuthenticatedLayoutContent, { children }) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(SearchProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(LayoutProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(SidebarProvider, { defaultOpen, children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(AuthenticatedLayoutContent, { children }) }) }) });
 }
 
 // src/design-system/templates/header.tsx
-var import_react27 = require("react");
-var import_jsx_runtime126 = require("react/jsx-runtime");
+var import_react26 = require("react");
+var import_jsx_runtime125 = require("react/jsx-runtime");
 function Header2({ className, fixed, children, ...props }) {
-  const [offset, setOffset] = (0, import_react27.useState)(0);
-  (0, import_react27.useEffect)(() => {
+  const [offset, setOffset] = (0, import_react26.useState)(0);
+  (0, import_react26.useEffect)(() => {
     const onScroll = () => {
       setOffset(document.body.scrollTop || document.documentElement.scrollTop);
     };
@@ -15342,7 +15026,7 @@ function Header2({ className, fixed, children, ...props }) {
   }, []);
   return (
     // Page header container: fixed mode me top par sticky behavior deta hai.
-    /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
       "header",
       {
         className: cn(
@@ -15352,7 +15036,7 @@ function Header2({ className, fixed, children, ...props }) {
           className
         ),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(
           "div",
           {
             className: cn(
@@ -15361,7 +15045,7 @@ function Header2({ className, fixed, children, ...props }) {
               offset > 10 && fixed && "after:absolute after:inset-0 after:-z-10 after:bg-background/20 after:backdrop-blur-lg"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(AppLogo, { className: "shrink-0 md:hidden" }),
+              /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(AppLogo, { className: "shrink-0 md:hidden" }),
               children
             ]
           }
@@ -15372,9 +15056,9 @@ function Header2({ className, fixed, children, ...props }) {
 }
 
 // src/design-system/templates/main.tsx
-var import_jsx_runtime127 = require("react/jsx-runtime");
+var import_jsx_runtime126 = require("react/jsx-runtime");
 function Main({ fixed, className, fluid, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "main",
     {
       "data-layout": fixed ? "fixed" : "auto",
@@ -15392,21 +15076,21 @@ function Main({ fixed, className, fluid, ...props }) {
 }
 
 // src/design-system/templates/sidebar-search.tsx
-var import_lucide_react66 = require("lucide-react");
-var import_jsx_runtime128 = require("react/jsx-runtime");
+var import_lucide_react65 = require("lucide-react");
+var import_jsx_runtime127 = require("react/jsx-runtime");
 function SidebarSearch() {
   const { setOpen } = useSearch();
-  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(
     SidebarMenuButton,
     {
       onClick: () => setOpen(true),
       tooltip: "Search (\u2318K)",
       className: "bg-sidebar-accent/50 hover:bg-sidebar-accent border border-sidebar-border/60 text-muted-foreground hover:text-foreground",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_lucide_react66.SearchIcon, { className: "size-4 shrink-0" }),
-        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("span", { className: "flex-1 text-left text-xs font-normal group-data-[collapsible=icon]:hidden", children: "Search..." }),
-        /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("kbd", { className: "pointer-events-none hidden h-4 select-none items-center gap-0.5 rounded border bg-muted px-1.5 font-mono text-[10px] font-medium opacity-100 group-data-[collapsible=icon]:hidden sm:flex", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("span", { className: "text-[10px]", children: "\u2318" }),
+        /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(import_lucide_react65.SearchIcon, { className: "size-4 shrink-0" }),
+        /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("span", { className: "flex-1 text-left text-xs font-normal group-data-[collapsible=icon]:hidden", children: "Search..." }),
+        /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)("kbd", { className: "pointer-events-none hidden h-4 select-none items-center gap-0.5 rounded border bg-muted px-1.5 font-mono text-[10px] font-medium opacity-100 group-data-[collapsible=icon]:hidden sm:flex", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("span", { className: "text-[10px]", children: "\u2318" }),
           "K"
         ] })
       ]
@@ -15416,8 +15100,8 @@ function SidebarSearch() {
 
 // src/design-system/templates/top-nav.tsx
 var import_link5 = __toESM(require("next/link"));
-var import_lucide_react67 = require("lucide-react");
-var import_jsx_runtime129 = require("react/jsx-runtime");
+var import_lucide_react66 = require("lucide-react");
+var import_jsx_runtime128 = require("react/jsx-runtime");
 function TopNav({ className, links, ...props }) {
   const renderLink = ({
     title,
@@ -15428,7 +15112,7 @@ function TopNav({ className, links, ...props }) {
   }) => {
     const className2 = `text-sm font-medium transition-colors hover:text-primary ${isActive ? "" : "text-muted-foreground"}`;
     if (onClick) {
-      return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
         "button",
         {
           type: "button",
@@ -15440,7 +15124,7 @@ function TopNav({ className, links, ...props }) {
         title
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
       import_link5.default,
       {
         href,
@@ -15451,9 +15135,9 @@ function TopNav({ className, links, ...props }) {
       title
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(import_jsx_runtime128.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(DropdownMenu, { modal: false, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
         Button,
         {
           size: "icon",
@@ -15463,18 +15147,18 @@ function TopNav({ className, links, ...props }) {
             className
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_lucide_react67.Menu, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("span", { className: "sr-only", children: "Toggle navigation menu" })
+            /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_lucide_react66.Menu, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("span", { className: "sr-only", children: "Toggle navigation menu" })
           ]
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DropdownMenuContent, { side: "bottom", align: "start", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DropdownMenuContent, { side: "bottom", align: "start", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
         DropdownMenuItem,
         {
           disabled: link.disabled,
           onClick: link.onClick,
           asChild: !link.onClick,
-          children: link.onClick ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("span", { className: !link.isActive ? "text-muted-foreground" : "", children: link.title }) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+          children: link.onClick ? /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("span", { className: !link.isActive ? "text-muted-foreground" : "", children: link.title }) : /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
             import_link5.default,
             {
               href: link.href,
@@ -15487,7 +15171,7 @@ function TopNav({ className, links, ...props }) {
         link.title
       )) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
       "nav",
       {
         className: cn(
@@ -15862,6 +15546,7 @@ function TopNav({ className, links, ...props }) {
   buttonVariants,
   downloadQrCode,
   formatBytes,
+  formatTimeAgo,
   getFileCategoryTheme,
   navigationMenuTriggerStyle,
   sidebarData,