@datatechsolutions/ui 3.11.2 → 3.12.1

package/dist/{chunk-6R5Z2IQ5.js → chunk-ULKZGM2T.js}

@@ -1,8 +1,8 @@
 "use client";
 'use strict';
 
-var chunkYXN2K77G_js = require('./chunk-YXN2K77G.js');
 var chunk22XPYFHJ_js = require('./chunk-22XPYFHJ.js');
+var chunkYXN2K77G_js = require('./chunk-YXN2K77G.js');
 var chunkBHOT22QL_js = require('./chunk-BHOT22QL.js');
 var chunkUZ3CMNUJ_js = require('./chunk-UZ3CMNUJ.js');
 var chunkS7KHTUHA_js = require('./chunk-S7KHTUHA.js');
@@ -3044,7 +3044,7 @@ function SearchBar({
     inputRef.current?.blur();
     onCancel?.();
   }, [onSearchChange, onCancel]);
-  const containerClasses = noBorder ? "flex flex-wrap items-center gap-2 p-3 bg-transparent" : `liquid-surface flex flex-wrap items-center gap-2 p-3 rounded-2xl
+  const containerClasses = noBorder ? "flex flex-wrap items-center gap-2 px-2 py-1 bg-transparent" : `liquid-surface flex flex-wrap items-center gap-2 px-2 py-1 rounded-2xl
        transition-all duration-200
        ${isFocused ? "ring-2 ring-indigo-500/70 ring-offset-1" : ""}`;
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -3084,7 +3084,7 @@ function SearchBar({
                   onFocus: handleFocus,
                   onBlur: handleBlur,
                   "data-testid": "search-input",
-                  className: "w-full h-11 pl-10 pr-10 text-base bg-transparent\n                text-slate-900 dark:text-white\n                placeholder:text-slate-400 dark:placeholder:text-slate-500\n                focus:outline-none"
+                  className: "w-full h-10 pl-10 pr-10 text-base bg-transparent\n                text-slate-900 dark:text-white\n                placeholder:text-slate-400 dark:placeholder:text-slate-500\n                focus:outline-none"
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: searchTerm && /* @__PURE__ */ jsxRuntime.jsx(
@@ -3122,7 +3122,7 @@ function SearchBar({
           type: "button",
           onClick: filtersModal.onOpen,
           outline: true,
-          className: "h-12",
+          className: "h-10",
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.FunnelIcon, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { children: resolvedFiltersTitle }),
@@ -3756,21 +3756,33 @@ function Spinner({
 }
 function LoadingOverlay({ show, message, blur = true }) {
   if (!show) return null;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     framerMotion.motion.div,
     {
+      role: "status",
+      "aria-live": "polite",
       initial: { opacity: 0 },
       animate: { opacity: 1 },
       exit: { opacity: 0 },
       className: clsx4.clsx(
         "fixed inset-0 z-50 flex flex-col items-center justify-center",
-        "bg-white/80 dark:bg-slate-900/80",
-        blur && "backdrop-blur-sm"
+        "bg-slate-900/25 dark:bg-slate-950/45",
+        blur && "backdrop-blur-md"
       ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: "lg", color: "blue", variant: "circle" }),
-        message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-slate-600 dark:text-slate-300 font-medium", children: message })
-      ]
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        framerMotion.motion.div,
+        {
+          initial: { opacity: 0, scale: 0.92, y: 8 },
+          animate: { opacity: 1, scale: 1, y: 0 },
+          exit: { opacity: 0, scale: 0.92, y: 8 },
+          transition: { type: "spring", stiffness: 320, damping: 28 },
+          className: "liquid-surface-strong flex flex-col items-center gap-3 rounded-2xl px-7 py-6 min-w-[160px]",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: "lg", color: "blue", variant: "circle" }),
+            message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-slate-700 dark:text-slate-200", children: message })
+          ]
+        }
+      )
     }
   );
 }
@@ -6695,11 +6707,11 @@ function ChipPicker({
     }
   }, [draft, commitDraft, items, removeUserCreated]);
   if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 text-center text-sm text-gray-500 dark:text-gray-400", children: loadingLabel });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 text-center text-sm text-slate-500 dark:text-slate-400", children: loadingLabel });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
     showActions && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: [
         selectedIds.length,
         " ",
         selectedLabel
@@ -6714,13 +6726,13 @@ function ChipPicker({
             children: selectAllLabel
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400 dark:text-gray-500", children: "|" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-400 dark:text-slate-500", children: "|" }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             type: "button",
             onClick: clearAll,
-            className: "text-xs text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500/70 focus-visible:rounded",
+            className: "text-xs text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500/70 focus-visible:rounded",
             children: clearLabel
           }
         )
@@ -6739,7 +6751,15 @@ function ChipPicker({
             return /* @__PURE__ */ jsxRuntime.jsxs(
               "span",
               {
-                className: `inline-flex items-center gap-1.5 rounded-full border text-xs font-medium transition ${isSelected ? `${style.bg} ${style.text} border-transparent ring-2 ring-offset-1 ring-current` : "border-gray-200 bg-white/70 text-gray-700 hover:border-gray-300 dark:border-white/10 dark:bg-white/5 dark:text-gray-200"}`,
+                style: {
+                  // Crystal chrome — same recipe as Badge / StatusBadge /
+                  // ActiveFilterChips. Keeps every chip-shaped primitive
+                  // visually identical (translucent jewel, not flat tile).
+                  backdropFilter: "blur(12px) saturate(1.5)",
+                  WebkitBackdropFilter: "blur(12px) saturate(1.5)",
+                  boxShadow: "inset 0 1px 1.5px rgba(255,255,255,0.45), 0 1px 3px -1px rgba(15,23,42,0.12)"
+                },
+                className: `inline-flex items-center gap-1.5 rounded-full border text-xs font-medium transition ${isSelected ? `${style.bg} ${style.text} border-current/30 ring-2 ring-offset-1 ring-current` : "liquid-surface text-slate-700 hover:bg-white/55 dark:text-slate-200 dark:hover:bg-white/[0.10]"}`,
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsxs(
                     "label",
@@ -6776,7 +6796,7 @@ function ChipPicker({
               item.id
             );
           }),
-          allowCustom && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 rounded-full border border-dashed border-slate-300 bg-white/50 px-2 py-1 text-xs dark:border-white/15 dark:bg-white/5", children: [
+          allowCustom && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 rounded-full border border-dashed border-slate-400/50 bg-white/45 px-2 py-1 text-xs backdrop-blur-md dark:border-white/20 dark:bg-white/[0.06]", children: [
             /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.PlusIcon, { className: "h-3 w-3 text-slate-500 dark:text-slate-400", "aria-hidden": "true" }),
             /* @__PURE__ */ jsxRuntime.jsx(
               "input",
@@ -6796,7 +6816,7 @@ function ChipPicker({
         ]
       }
     ),
-    items.length === 0 && !allowCustom && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-6 text-center text-sm text-gray-500 dark:text-gray-400", children: emptyLabel })
+    items.length === 0 && !allowCustom && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-6 text-center text-sm text-slate-500 dark:text-slate-400", children: emptyLabel })
   ] });
 }
 var DEFAULT_COPYABLE_CLASSNAME = "liquid-surface-strong text-gray-500 dark:text-gray-400";
@@ -8603,7 +8623,7 @@ function CardGridSkeleton({ count = 8, columns = 4 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `grid ${gridCols[columns]} gap-3`, role: "status", "aria-label": "Loading content", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: "rounded-xl border border-gray-200 dark:border-white/10 bg-white dark:bg-gray-800 p-4 shadow-sm",
+      className: "liquid-surface rounded-xl p-4",
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 mb-3", children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-8 w-12 rounded" }),
@@ -8616,7 +8636,7 @@ function CardGridSkeleton({ count = 8, columns = 4 }) {
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-5 w-5 rounded-full" }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-4 w-20 rounded" })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-3 border-t border-gray-200 dark:border-white/10", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-3 w-32 rounded" }) })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-3 border-t liquid-divider", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-3 w-32 rounded" }) })
       ]
     },
     i
@@ -8626,7 +8646,7 @@ function RegionFilterSkeleton({ count = 9 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-4 sm:grid-cols-6 lg:grid-cols-9 gap-2", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: "rounded-lg border border-gray-200 dark:border-white/10 bg-white dark:bg-gray-800 p-2 flex flex-col items-center gap-1",
+      className: "liquid-surface rounded-lg p-2 flex flex-col items-center gap-1",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-6 w-9 rounded" }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-4 w-6 rounded" }),
@@ -8640,7 +8660,7 @@ function BrandFilterSkeleton({ count = 4 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3 grid-cols-2 sm:grid-cols-3 lg:grid-cols-4", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: "rounded-xl border border-gray-200 dark:border-white/10 bg-white dark:bg-gray-800 p-3 flex items-center gap-3",
+      className: "liquid-surface rounded-xl p-3 flex items-center gap-3",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-10 w-10 rounded-lg" }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-2", children: [
@@ -8658,9 +8678,9 @@ function AnalysisSkeleton() {
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-7 w-48 rounded" }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-4 w-96 rounded" })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border border-gray-200 dark:border-white/10 bg-white dark:bg-gray-800 p-6 shadow-sm space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface rounded-xl p-6 space-y-4", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-10 w-32 rounded-lg" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-gray-200 dark:border-white/10 p-4 bg-gray-50/50 dark:bg-gray-900/50", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-white/30 dark:border-white/10 p-4 bg-white/40 dark:bg-white/[0.04] backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-8 w-8 rounded-lg" }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-2", children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shimmer h-4 w-24 rounded" }),
@@ -8676,8 +8696,8 @@ function AnalysisSkeleton() {
 }
 
 // src/components/skeletons/shimmer.tsx
-var shimmerClass = "bg-gradient-to-r from-gray-200 via-gray-100 to-gray-200 dark:from-gray-700 dark:via-gray-600 dark:to-gray-700 animate-shimmer motion-reduce:animate-none bg-[length:200%_100%]";
-var shimmerWhiteClass = "bg-white/20 animate-pulse motion-reduce:animate-none";
+var shimmerClass = "bg-gradient-to-r from-slate-500/12 via-slate-500/24 to-slate-500/12 dark:from-white/8 dark:via-white/14 dark:to-white/8 animate-shimmer motion-reduce:animate-none bg-[length:200%_100%]";
+var shimmerWhiteClass = "bg-white/25 dark:bg-white/15 animate-pulse motion-reduce:animate-none backdrop-blur-sm";
 function SectionHeaderSkeleton() {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-10 w-10 rounded-lg ${shimmerClass}` }),
@@ -9433,16 +9453,28 @@ var APP_COLORS = {
   astrlabe: "bg-sky-500/30 text-sky-100 ring-sky-400/30",
   windsock: "bg-indigo-500/30 text-indigo-100 ring-indigo-400/30"
 };
+function readEnv(key) {
+  try {
+    const viteEnv = undefined;
+    if (viteEnv && viteEnv[key]) return viteEnv[key];
+  } catch {
+  }
+  if (typeof process !== "undefined" && process.env) {
+    return process.env[key];
+  }
+  return void 0;
+}
 function detectApp() {
-  const appName = process.env.NEXT_PUBLIC_APP_NAME ?? process.env.NEXT_PUBLIC_AUTH_CLIENT_ID ?? "unknown";
+  const appName = readEnv("VITE_APP_NAME") ?? readEnv("NEXT_PUBLIC_APP_NAME") ?? readEnv("NEXT_PUBLIC_AUTH_CLIENT_ID") ?? "unknown";
   const port = typeof window !== "undefined" ? window.location.port : "";
-  const gateway = process.env.NEXT_PUBLIC_API_GATEWAY_URL ?? process.env.NEXT_PUBLIC_LAMBDA_CLIENT_BASE ?? "";
+  const gateway = readEnv("VITE_API_URL") ?? readEnv("NEXT_PUBLIC_API_GATEWAY_URL") ?? readEnv("NEXT_PUBLIC_LAMBDA_CLIENT_BASE") ?? "";
   return { name: appName, port, gateway };
 }
 function DevModeBanner({
   user,
   devModeLabel = "DEV",
-  devModeMessage = "Local development mode"
+  devModeMessage = "Local development mode",
+  forceShow = false
 }) {
   const [glassTest, setGlassTest] = React9.useState(false);
   const toggleGlassTest = React9.useCallback(() => {
@@ -9451,7 +9483,7 @@ function DevModeBanner({
     html.classList.toggle("glass-test", next);
     setGlassTest(next);
   }, [glassTest]);
-  if (process.env.NEXT_PUBLIC_DEV_MODE !== "true") {
+  if (!forceShow && readEnv("VITE_DEV_MODE") !== "true" && readEnv("NEXT_PUBLIC_DEV_MODE") !== "true") {
     return null;
   }
   const app = detectApp();
@@ -9640,24 +9672,25 @@ function FlyoutQuickActions({
     onClose?.();
     action();
   };
+  const tileBase = "liquid-surface m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-slate-900 dark:text-white transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md active:scale-[0.985] focus:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500/70 focus-visible:ring-offset-1";
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-3 my-3 h-px bg-gradient-to-r from-transparent via-gray-200/80 to-transparent dark:via-white/10" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-3 my-3 h-px bg-gradient-to-r from-transparent via-slate-200/80 to-transparent dark:via-white/10" }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-1.5 sm:gap-2 px-1", children: [
       onNotifications ? /* @__PURE__ */ jsxRuntime.jsxs(
         "button",
         {
           type: "button",
           onClick: () => handleAction(onNotifications),
-          className: "liquid-surface m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-slate-900 dark:text-white",
+          className: tileBase,
           children: [
-            /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BellIcon, { className: "size-5 flex-none text-slate-400 dark:text-slate-500" }),
+            /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BellIcon, { className: "size-5 flex-none text-slate-500 dark:text-slate-300" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: t("notifications") }),
             notificationCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex min-w-[18px] items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-semibold text-white", children: notificationCount > 99 ? "99+" : notificationCount })
           ]
         }
       ) : null,
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-slate-900 dark:text-white", children: [
-        isDark ? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.MoonIcon, { className: "size-5 flex-none text-slate-400 dark:text-slate-500" }) : /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.SunIcon, { className: "size-5 flex-none text-slate-400 dark:text-slate-500" }),
+        isDark ? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.MoonIcon, { className: "size-5 flex-none text-slate-500 dark:text-slate-300" }) : /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.SunIcon, { className: "size-5 flex-none text-slate-500 dark:text-slate-300" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: t("theme") }),
         /* @__PURE__ */ jsxRuntime.jsx(ThemeSwitch, { checked: isDark, onChange: onToggleTheme, label: t("theme") })
       ] }),
@@ -9666,9 +9699,9 @@ function FlyoutQuickActions({
         {
           type: "button",
           onClick: () => handleAction(onProfile),
-          className: "liquid-surface m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-slate-900 dark:text-white",
+          className: tileBase,
           children: [
-            userInitial ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-5 w-5 items-center justify-center rounded-full bg-slate-200 text-[10px] font-semibold text-slate-700 dark:bg-slate-700 dark:text-slate-100", children: userInitial }) : /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.UserCircleIcon, { className: "size-5 flex-none text-slate-400 dark:text-slate-500" }),
+            userInitial ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-5 w-5 items-center justify-center rounded-full bg-slate-500/15 text-[10px] font-semibold text-slate-700 dark:bg-white/15 dark:text-slate-100", children: userInitial }) : /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.UserCircleIcon, { className: "size-5 flex-none text-slate-500 dark:text-slate-300" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: userName || t("profile") })
           ]
         }
@@ -9678,9 +9711,9 @@ function FlyoutQuickActions({
         {
           type: "button",
           onClick: () => handleAction(onSignOut),
-          className: "liquid-button liquid-button-red m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-red-600 dark:text-red-400",
+          className: "liquid-button liquid-button-red m-1 flex items-center justify-center gap-x-2 rounded-xl p-2.5 text-xs font-semibold sm:gap-x-2.5 sm:p-3 sm:text-sm text-red-700 dark:text-red-300 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md active:scale-[0.985] focus:outline-none focus-visible:ring-2 focus-visible:ring-red-500/70 focus-visible:ring-offset-1",
           children: [
-            /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.ArrowRightOnRectangleIcon, { className: "size-5 flex-none text-slate-400 dark:text-slate-500" }),
+            /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.ArrowRightOnRectangleIcon, { className: "size-5 flex-none text-red-600/70 dark:text-red-300/80" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: t("signOut") })
           ]
         }
@@ -9727,7 +9760,7 @@ function FlyoutNavGrid({
         {
           type: "button",
           onClick: () => item.onClick ? item.onClick() : onNavigate(item.href),
-          className: `group relative flex w-full items-start gap-x-3 sm:gap-x-4 rounded-xl sm:rounded-2xl p-2.5 sm:p-3 text-left transition ${isSelected ? "selected liquid-surface liquid-surface-active" : `liquid-surface hover:shadow-md ${item.hoverClass ?? ""}`}`,
+          className: `group relative flex w-full items-start gap-x-3 sm:gap-x-4 rounded-xl sm:rounded-2xl p-2.5 sm:p-3 text-left transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500/70 focus-visible:ring-offset-1 active:scale-[0.985] ${isSelected ? "selected liquid-surface liquid-surface-active shadow-md" : `liquid-surface hover:-translate-y-0.5 hover:shadow-md ${item.hoverClass ?? ""}`}`,
           style: isSelected && getAccentRgb ? { "--glass-accent": getAccentRgb(item.href) } : void 0,
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative mt-0.5 flex h-11 w-11 sm:h-14 sm:w-14 flex-none items-center justify-center overflow-hidden rounded-xl sm:rounded-2xl border border-white/40 bg-white/35 shadow-[inset_0_1px_0_rgba(255,255,255,0.85),0_12px_20px_-14px_rgba(15,23,42,0.55)] dark:border-white/14 dark:bg-white/10 dark:shadow-[inset_0_1px_0_rgba(255,255,255,0.2),0_12px_22px_-16px_rgba(0,0,0,0.8)]", children: [
@@ -19545,7 +19578,11 @@ var usePlatformShellStore = zustand.create((set, get) => ({
     locale: "en",
     theme: "system",
     resolvedTheme: "dark",
-    dockPosition: "left",
+    // Canonical default — floating iOS-style dock at the bottom of
+    // the viewport for non-launchpad / "standard content" pages.
+    // User preference (`Settings → Preferences → Dock position`)
+    // overrides per-user once set.
+    dockPosition: "bottom",
     dockAutoHide: false,
     dockEnabled: true
   },
@@ -19613,7 +19650,13 @@ function PlatformShell({
   user,
   authStatus,
   onSignOut,
-  dockPosition = "left",
+  // `bottom` is the canonical default for "standard content" pages
+  // (every non-launchpad route) — the dock floats at the bottom of
+  // the viewport like an iOS home dock. User preference (`Settings →
+  // Preferences → Dock position`) can override per-user; the
+  // PlatformShell store also defaults to `bottom` to keep first-time
+  // users on the canonical layout.
+  dockPosition = "bottom",
   dockAutoHide = false,
   dockEnabled = true,
   resolvedTheme,
@@ -20759,5 +20802,5 @@ exports.useSocialProviders = useSocialProviders;
 exports.validateDashboardSpec = validateDashboardSpec;
 exports.xScale = xScale;
 exports.yScale = yScale;
-//# sourceMappingURL=chunk-6R5Z2IQ5.js.map
-//# sourceMappingURL=chunk-6R5Z2IQ5.js.map
+//# sourceMappingURL=chunk-ULKZGM2T.js.map
+//# sourceMappingURL=chunk-ULKZGM2T.js.map