npm - @datatechsolutions/ui - Versions diffs - 2.7.131 → 2.7.133 - Mend

@datatechsolutions/ui 2.7.131 → 2.7.133

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/dist/{chunk-7ZO5L4QH.mjs → chunk-2GNFQ5OX.mjs} +177 -165
package/dist/chunk-2GNFQ5OX.mjs.map +1 -0
package/dist/{chunk-M6KOYLMA.js → chunk-AH5D2SNG.js} +52 -52
package/dist/{chunk-M6KOYLMA.js.map → chunk-AH5D2SNG.js.map} +1 -1
package/dist/{chunk-5NRV2PE4.js → chunk-W224TQQY.js} +177 -165
package/dist/chunk-W224TQQY.js.map +1 -0
package/dist/{chunk-7WR44JRN.mjs → chunk-XBCR5VZH.mjs} +3 -3
package/dist/{chunk-7WR44JRN.mjs.map → chunk-XBCR5VZH.mjs.map} +1 -1
package/dist/index.js +336 -336
package/dist/index.mjs +1 -1
package/dist/workflow/index.js +119 -119
package/dist/workflow/index.mjs +3 -3
package/dist/workflow/workflow-canvas.js +3 -3
package/dist/workflow/workflow-canvas.mjs +2 -2
package/package.json +1 -1
package/dist/chunk-5NRV2PE4.js.map +0 -1
package/dist/chunk-7ZO5L4QH.mjs.map +0 -1

package/dist/{chunk-7ZO5L4QH.mjs → chunk-2GNFQ5OX.mjs} RENAMED Viewed

@@ -732,7 +732,7 @@ function IconButton({
       isIosColor && finalColor === "ios-purple" && "bg-[#AF52DE] dark:bg-[#BF5AF2]"
     ),
     ghost: clsx(
-      "bg-transparent hover:bg-gray-100 dark:hover:bg-gray-800",
+      "bg-transparent hover:bg-white/40 dark:hover:bg-white/[0.08]",
       isIosColor && finalColor === "ios-blue" && "text-[#007AFF] dark:text-[#0A84FF]",
       isIosColor && finalColor === "ios-red" && "text-[#FF3B30] dark:text-[#FF453A]",
       isIosColor && finalColor === "ios-green" && "text-[#34C759] dark:text-[#30D158]",
@@ -817,10 +817,10 @@ function CardHeader({ className = "", ...props }) {
   return /* @__PURE__ */ jsx("div", { className: `flex flex-col space-y-1.5 p-4 sm:p-6 ${className}`, ...props });
 }
 function CardTitle({ className = "", ...props }) {
-  return /* @__PURE__ */ jsx("h3", { className: `text-lg font-semibold leading-none tracking-tight text-gray-900 dark:text-white ${className}`, ...props });
+  return /* @__PURE__ */ jsx("h3", { className: `text-lg font-semibold leading-none tracking-tight text-slate-900 dark:text-white ${className}`, ...props });
 }
 function CardDescription({ className = "", ...props }) {
-  return /* @__PURE__ */ jsx("p", { className: `text-sm text-gray-500 dark:text-gray-400 ${className}`, ...props });
+  return /* @__PURE__ */ jsx("p", { className: `text-sm text-slate-500 dark:text-slate-400 ${className}`, ...props });
 }
 function CardContent({ className = "", ...props }) {
   return /* @__PURE__ */ jsx("div", { className: `p-4 sm:p-6 pt-0 ${className}`, ...props });
@@ -850,8 +850,8 @@ function SectionCard({
           }
         ),
         /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx("h3", { className: "text-base sm:text-lg font-semibold text-gray-900 dark:text-white", children: title }),
-          subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs sm:text-sm text-gray-500 dark:text-gray-400", children: subtitle })
+          /* @__PURE__ */ jsx("h3", { className: "text-base sm:text-lg font-semibold text-slate-900 dark:text-white", children: title }),
+          subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs sm:text-sm text-slate-500 dark:text-slate-400", children: subtitle })
         ] })
       ] }),
       rightContent
@@ -958,15 +958,15 @@ var Input = forwardRef(
     const baseClasses = isFilled ? `
         liquid-surface h-12 w-full rounded-xl border-0
         px-4 py-3 text-base
-        text-gray-900 dark:text-white
-        placeholder:text-gray-400 dark:placeholder:text-gray-500
+        text-slate-900 dark:text-white
+        placeholder:text-slate-400 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       ` : `
         liquid-surface h-11 w-full rounded-xl
         px-3.5 py-2.5 text-base
-        text-gray-900 dark:text-white
-        placeholder:text-gray-400 dark:placeholder:text-gray-500
+        text-slate-900 dark:text-white
+        placeholder:text-slate-400 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       `;
@@ -994,7 +994,7 @@ var Input = forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: togglePassword,
-          className: "p-1 rounded-full text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors",
+          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
           "aria-label": showPassword ? t("hidePassword") : t("showPassword"),
           children: showPassword ? /* @__PURE__ */ jsx(EyeSlashIcon, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(EyeIcon, { className: "h-5 w-5" })
         }
@@ -1008,7 +1008,7 @@ var Input = forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: handleClear,
-          className: "p-1 rounded-full text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors",
+          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
           children: /* @__PURE__ */ jsx(XMarkIcon, { className: "h-5 w-5" })
         }
       ) })
@@ -1036,12 +1036,12 @@ var Input = forwardRef(
             children: successMessage
           }
         ),
-        !error && !successMessage && helperText && /* @__PURE__ */ jsx("p", { id: helperId, className: "text-sm text-gray-500 dark:text-gray-400", children: helperText })
+        !error && !successMessage && helperText && /* @__PURE__ */ jsx("p", { id: helperId, className: "text-sm text-slate-500 dark:text-slate-400", children: helperText })
       ] }),
       showCharacterCount && /* @__PURE__ */ jsxs(
         "span",
         {
-          className: `text-xs ml-2 ${isOverLimit ? "text-ios-red" : characterCount > 0 ? "text-gray-500 dark:text-gray-400" : "text-gray-400 dark:text-gray-500"}`,
+          className: `text-xs ml-2 ${isOverLimit ? "text-ios-red" : characterCount > 0 ? "text-slate-500 dark:text-slate-400" : "text-slate-400 dark:text-slate-500"}`,
           children: [
             characterCount,
             maxCharacters ? `/${maxCharacters}` : ""
@@ -1052,7 +1052,7 @@ var Input = forwardRef(
     if (floatingLabel && label) {
       return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
         /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-          icon && /* @__PURE__ */ jsx("div", { className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-gray-400 dark:text-gray-500 z-10", children: icon }),
+          icon && /* @__PURE__ */ jsx("div", { className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-400 dark:text-slate-500 z-10", children: icon }),
           /* @__PURE__ */ jsx(
             "input",
             {
@@ -1085,7 +1085,7 @@ var Input = forwardRef(
               htmlFor: inputId,
               className: `
                 absolute left-3.5 pointer-events-none
-                text-gray-500 dark:text-gray-400
+                text-slate-500 dark:text-slate-400
                 transition-all duration-200
                 ${icon ? "left-11" : ""}
               `,
@@ -1104,9 +1104,9 @@ var Input = forwardRef(
       ] });
     }
     return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
-      label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "block text-sm font-medium text-gray-700 dark:text-gray-300", children: label }),
+      label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "block text-sm font-medium text-slate-700 dark:text-slate-300", children: label }),
       /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-        icon && /* @__PURE__ */ jsx("div", { className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-gray-400 dark:text-gray-500", children: icon }),
+        icon && /* @__PURE__ */ jsx("div", { className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-400 dark:text-slate-500", children: icon }),
         /* @__PURE__ */ jsx(
           "input",
           {
@@ -1245,8 +1245,8 @@ function Sheet({
                 className: isRight ? `pointer-events-auto w-full ${rightSizeClass} h-full liquid-surface !rounded-none !rounded-l-3xl !shadow-2xl overflow-hidden` : `pointer-events-auto w-full max-w-lg liquid-surface !rounded-none !rounded-t-3xl !shadow-2xl overflow-hidden`,
                 ...!isRight ? { initial: { height: maxHeight } } : {},
                 children: [
-                  showHandle && !isRight && /* @__PURE__ */ jsx("div", { className: "flex justify-center pt-3 pb-2 cursor-grab active:cursor-grabbing", children: /* @__PURE__ */ jsx("div", { className: "h-1 w-10 rounded-full bg-gray-400/50 dark:bg-gray-500/50" }) }),
-                  title && /* @__PURE__ */ jsx(DialogTitle, { className: "px-6 py-3 text-lg font-semibold text-gray-900 dark:text-white border-b border-gray-200/50 dark:border-white/10", children: title }),
+                  showHandle && !isRight && /* @__PURE__ */ jsx("div", { className: "flex justify-center pt-3 pb-2 cursor-grab active:cursor-grabbing", children: /* @__PURE__ */ jsx("div", { className: "h-1 w-10 rounded-full bg-slate-400/50 dark:bg-slate-500/50" }) }),
+                  title && /* @__PURE__ */ jsx(DialogTitle, { className: "px-6 py-3 text-lg font-semibold text-slate-900 dark:text-white border-b border-white/30 dark:border-white/10", children: title }),
                   /* @__PURE__ */ jsx(
                     "div",
                     {
@@ -1281,8 +1281,8 @@ function ActionSheet({
   };
   return /* @__PURE__ */ jsx(Sheet, { open, onClose, showHandle: false, children: /* @__PURE__ */ jsxs("div", { className: "px-4 pt-4 pb-2", children: [
     (title || message) && /* @__PURE__ */ jsxs("div", { className: "text-center mb-4", children: [
-      title && /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-gray-500 dark:text-gray-400", children: title }),
-      message && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 dark:text-gray-400 mt-1", children: message })
+      title && /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-slate-500 dark:text-slate-400", children: title }),
+      message && /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500 dark:text-slate-400 mt-1", children: message })
     ] }),
     /* @__PURE__ */ jsx("div", { className: "space-y-2", children: actions.map((action, index) => /* @__PURE__ */ jsx(
       "button",
@@ -1305,7 +1305,7 @@ function ActionSheet({
       {
         type: "button",
         onClick: onClose,
-        className: "w-full mt-2 py-3 px-4 rounded-xl text-center font-semibold\n            text-gray-600 dark:text-gray-300\n            bg-gray-100 dark:bg-gray-800\n            hover:bg-gray-200 dark:hover:bg-gray-700\n            transition-colors duration-150",
+        className: "w-full mt-2 py-3 px-4 rounded-xl text-center font-semibold\n            text-slate-600 dark:text-slate-300\n            bg-white/40 dark:bg-white/[0.08] backdrop-blur-sm\n            hover:bg-white/40 dark:hover:bg-white/[0.08]\n            transition-colors duration-150",
         children: tCommon("cancelDelete")
       }
     )
@@ -1536,7 +1536,7 @@ var Select = forwardRef(
       border-white/55 dark:border-white/14
       bg-white/68 dark:bg-slate-900/44 backdrop-blur-xl
       px-3.5 py-2.5 text-base
-      text-gray-900 dark:text-white
+      text-slate-900 dark:text-white
       shadow-[inset_0_1px_0_rgba(255,255,255,0.88),0_10px_24px_-22px_rgba(15,23,42,0.72)]
       transition-all duration-200
       disabled:cursor-not-allowed disabled:opacity-50
@@ -1545,7 +1545,7 @@ var Select = forwardRef(
     const errorClasses = error ? "border-ios-red ring-4 ring-ios-red/10" : "";
     if (useMobilePicker && normalizedOptions.length > 0) {
       return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
-        label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300", children: label }),
+        label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-slate-700 dark:text-slate-300", children: label }),
         /* @__PURE__ */ jsxs(
           "button",
           {
@@ -1560,11 +1560,11 @@ var Select = forwardRef(
               cursor-pointer
             `,
             children: [
-              /* @__PURE__ */ jsx("span", { className: selectedOption ? "" : "text-gray-400", children: selectedOption?.label || placeholder }),
+              /* @__PURE__ */ jsx("span", { className: selectedOption ? "" : "text-slate-400", children: selectedOption?.label || placeholder }),
               /* @__PURE__ */ jsx(
                 ChevronDownIcon,
                 {
-                  className: `h-5 w-5 text-gray-400 transition-transform duration-200
+                  className: `h-5 w-5 text-slate-400 transition-transform duration-200
                 ${isOpen ? "rotate-180" : ""}`
                 }
               )
@@ -1605,7 +1605,7 @@ var Select = forwardRef(
       ] });
     }
     return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
-      label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300", children: label }),
+      label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-slate-700 dark:text-slate-300", children: label }),
       /* @__PURE__ */ jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxs(
           "select",
@@ -1633,7 +1633,7 @@ var Select = forwardRef(
         /* @__PURE__ */ jsx(
           ChevronDownIcon,
           {
-            className: "absolute right-3 top-1/2 -translate-y-1/2 h-5 w-5 text-gray-400 pointer-events-none"
+            className: "absolute right-3 top-1/2 -translate-y-1/2 h-5 w-5 text-slate-400 pointer-events-none"
           }
         )
       ] }),
@@ -1659,7 +1659,7 @@ function DropdownSelect({
     setIsOpen(false);
   };
   return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 relative", children: [
-    label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300", children: label }),
+    label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-slate-700 dark:text-slate-300", children: label }),
     /* @__PURE__ */ jsxs(
       "button",
       {
@@ -1676,7 +1676,7 @@ function DropdownSelect({
           rounded-xl border border-white/55 dark:border-white/14
           bg-white/68 dark:bg-slate-900/44 backdrop-blur-xl
           px-3.5 py-2.5 text-base
-          text-gray-900 dark:text-white
+          text-slate-900 dark:text-white
           shadow-[inset_0_1px_0_rgba(255,255,255,0.88),0_10px_24px_-22px_rgba(15,23,42,0.72)]
           transition-all duration-200
           hover:bg-white/74 dark:hover:bg-slate-900/54
@@ -1685,13 +1685,13 @@ function DropdownSelect({
           ${error ? "border-ios-red ring-4 ring-ios-red/10" : ""}
         `,
         children: [
-          /* @__PURE__ */ jsx("span", { className: selectedOption ? "" : "text-gray-400", children: selectedOption?.label || placeholder }),
+          /* @__PURE__ */ jsx("span", { className: selectedOption ? "" : "text-slate-400", children: selectedOption?.label || placeholder }),
           /* @__PURE__ */ jsx(
             motion.div,
             {
               animate: { rotate: isOpen ? 180 : 0 },
               transition: { duration: 0.2 },
-              children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-5 w-5 text-gray-400" })
+              children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-5 w-5 text-slate-400" })
             }
           )
         ]
@@ -1722,7 +1722,7 @@ function DropdownSelect({
               className: `
                       w-full flex items-center justify-between px-4 py-3 text-left
                       transition-colors duration-150
-                      ${option.value === value ? "bg-ios-blue/10 text-ios-blue" : "text-gray-900 dark:text-white hover:bg-white/55 dark:hover:bg-white/8"}
+                      ${option.value === value ? "bg-ios-blue/10 text-ios-blue" : "text-slate-900 dark:text-white hover:bg-white/40 dark:hover:bg-white/[0.08]"}
                       ${option.disabled ? "opacity-50 cursor-not-allowed" : ""}
                     `,
               children: [
@@ -2066,7 +2066,7 @@ var defaultFilterTypeConfig = {
   },
   default: {
     icon: MapIcon,
-    className: "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-300"
+    className: "bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-300"
   }
 };
 function SearchBar({
@@ -2107,9 +2107,9 @@ function SearchBar({
     onCancel?.();
   }, [onSearchChange, onCancel]);
   const containerClasses = noBorder ? "flex flex-wrap items-center gap-2 p-3 bg-transparent" : `flex flex-wrap items-center gap-2 p-3
-       bg-white/80 dark:bg-gray-800/80 backdrop-blur-xl
-       border border-gray-200/50 dark:border-gray-700/50
-       rounded-2xl shadow-sm
+       bg-white/40 dark:bg-white/[0.04] backdrop-blur-xl
+       border border-white/30 dark:border-white/10
+       rounded-2xl
        transition-all duration-200
        ${isFocused ? "ring-4 ring-[#007AFF]/10 border-[#007AFF]/30" : ""}`;
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -2134,7 +2134,7 @@ function SearchBar({
               MagnifyingGlassIcon,
               {
                 className: `absolute left-3 top-1/2 -translate-y-1/2 h-5 w-5 transition-colors duration-200
-              ${isFocused ? "text-[#007AFF]" : "text-gray-400"}`
+              ${isFocused ? "text-[#007AFF]" : "text-slate-400"}`
               }
             ),
             /* @__PURE__ */ jsx(
@@ -2147,7 +2147,7 @@ function SearchBar({
                 onChange: (e) => onSearchChange(e.target.value),
                 onFocus: handleFocus,
                 onBlur: handleBlur,
-                className: "w-full h-11 pl-10 pr-10 text-base bg-transparent\n              text-gray-900 dark:text-white\n              placeholder:text-gray-400 dark:placeholder:text-gray-500\n              focus:outline-none"
+                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"
               }
             ),
             /* @__PURE__ */ jsx(AnimatePresence, { children: searchTerm && /* @__PURE__ */ jsx(
@@ -2158,7 +2158,7 @@ function SearchBar({
                 exit: { opacity: 0, scale: 0.8 },
                 transition: { duration: 0.15 },
                 onClick: handleClear,
-                className: "absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-full\n                  bg-gray-200 dark:bg-gray-600\n                  text-gray-500 dark:text-gray-300\n                  hover:bg-gray-300 dark:hover:bg-gray-500\n                  transition-colors",
+                className: "absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-full\n                  bg-white/40 dark:bg-white/[0.08]\n                  text-slate-500 dark:text-slate-300\n                  hover:bg-white/60 dark:hover:bg-white/[0.12]\n                  transition-colors",
                 children: /* @__PURE__ */ jsx(XMarkIcon$1, { className: "h-4 w-4" })
               }
             ) })
@@ -2171,7 +2171,7 @@ function SearchBar({
                 triggerHaptic("light");
                 onClearAll();
               },
-              className: "p-2 rounded-xl text-gray-400 hover:text-gray-600 dark:hover:text-white\n              hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors",
+              className: "p-2 rounded-xl text-slate-400 hover:text-slate-600 dark:hover:text-white\n              hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
               title: t("clearFilters"),
               children: /* @__PURE__ */ jsx(XMarkIcon$1, { className: "h-5 w-5" })
             }
@@ -2209,21 +2209,21 @@ var colorClasses = {
     iconBg: "bg-emerald-100 text-emerald-600 dark:bg-emerald-900/50 dark:text-emerald-400",
     activeGradient: "from-emerald-500 to-teal-600",
     activeRing: "ring-emerald-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/50 dark:text-emerald-300"
   },
   blue: {
     iconBg: "bg-blue-100 text-blue-600 dark:bg-blue-900/50 dark:text-blue-400",
     activeGradient: "from-blue-500 to-indigo-600",
     activeRing: "ring-blue-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-blue-100 text-blue-700 dark:bg-blue-900/50 dark:text-blue-300"
   },
   amber: {
     iconBg: "bg-amber-100 text-amber-600 dark:bg-amber-900/50 dark:text-amber-400",
     activeGradient: "from-amber-500 to-orange-600",
     activeRing: "ring-amber-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-amber-100 text-amber-700 dark:bg-amber-900/50 dark:text-amber-300",
     urgentValueColor: "text-amber-600 dark:text-amber-400"
   },
@@ -2231,21 +2231,21 @@ var colorClasses = {
     iconBg: "bg-orange-100 text-orange-600 dark:bg-orange-900/50 dark:text-orange-400",
     activeGradient: "from-orange-500 to-amber-600",
     activeRing: "ring-orange-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-orange-100 text-orange-700 dark:bg-orange-900/50 dark:text-orange-300"
   },
   indigo: {
     iconBg: "bg-indigo-100 text-indigo-600 dark:bg-indigo-900/50 dark:text-indigo-400",
     activeGradient: "from-indigo-500 to-blue-600",
     activeRing: "ring-indigo-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-indigo-100 text-indigo-700 dark:bg-indigo-900/50 dark:text-indigo-300"
   },
   purple: {
     iconBg: "bg-purple-100 text-purple-600 dark:bg-purple-900/50 dark:text-purple-400",
     activeGradient: "from-purple-500 to-indigo-600",
     activeRing: "ring-purple-500",
-    valueColor: "text-gray-900 dark:text-white",
+    valueColor: "text-slate-900 dark:text-white",
     badgeBg: "bg-purple-100 text-purple-700 dark:bg-purple-900/50 dark:text-purple-300"
   },
   red: {
@@ -2294,7 +2294,7 @@ function StatCard({
                 {
                   title: info.title ?? "",
                   content: info.content ? info.content : info.blocks ? /* @__PURE__ */ jsx("div", { className: "space-y-2", children: info.blocks.map((block, index) => /* @__PURE__ */ jsxs("div", { children: [
-                    /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-700 dark:text-gray-200", children: block.label }),
+                    /* @__PURE__ */ jsx("p", { className: "font-medium text-slate-700 dark:text-slate-200", children: block.label }),
                     /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap font-mono text-xs mt-1", children: block.content })
                   ] }, index)) }) : void 0
                 }
@@ -2313,7 +2313,7 @@ function StatCard({
           /* @__PURE__ */ jsx(
             "p",
             {
-              className: `mt-1 text-sm ${isActive ? "text-white/75" : "text-gray-500 dark:text-gray-400"}`,
+              className: `mt-1 text-sm ${isActive ? "text-white/75" : "text-slate-500 dark:text-slate-400"}`,
               children: label
             }
           ),
@@ -2487,7 +2487,7 @@ function Pagination({
   };
   const pageNumbers = getPageNumbers2();
   if (totalPages <= 1) return null;
-  return /* @__PURE__ */ jsxs("div", { className: `flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6 dark:border-white/10 dark:bg-gray-800 rounded-b-xl ${className}`, children: [
+  return /* @__PURE__ */ jsxs("div", { className: `flex items-center justify-between border-t border-white/30 dark:border-white/10 bg-white/40 dark:bg-white/[0.04] backdrop-blur-xl px-4 py-3 sm:px-6 rounded-b-xl ${className}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "flex flex-1 justify-between sm:hidden", children: [
       /* @__PURE__ */ jsx(
         "button",
@@ -2495,7 +2495,7 @@ function Pagination({
           type: "button",
           onClick: () => onPageChange(currentPage - 1),
           disabled: currentPage === 1,
-          className: "relative inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed dark:border-white/10 dark:bg-white/5 dark:text-gray-200 dark:hover:bg-white/10",
+          className: "relative inline-flex items-center rounded-md border border-white/30 dark:border-white/10 bg-white/40 dark:bg-white/[0.04] px-4 py-2 text-sm font-medium text-slate-700 hover:bg-white/40 dark:hover:bg-white/[0.08] disabled:opacity-50 disabled:cursor-not-allowed dark:text-slate-200",
           children: t("previous")
         }
       ),
@@ -2505,13 +2505,13 @@ function Pagination({
           type: "button",
           onClick: () => onPageChange(currentPage + 1),
           disabled: currentPage === totalPages,
-          className: "relative ml-3 inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed dark:border-white/10 dark:bg-white/5 dark:text-gray-200 dark:hover:bg-white/10",
+          className: "relative ml-3 inline-flex items-center rounded-md border border-white/30 dark:border-white/10 bg-white/40 dark:bg-white/[0.04] px-4 py-2 text-sm font-medium text-slate-700 hover:bg-white/40 dark:hover:bg-white/[0.08] disabled:opacity-50 disabled:cursor-not-allowed dark:text-slate-200",
           children: t("next")
         }
       )
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "hidden sm:flex sm:flex-1 sm:items-center sm:justify-between", children: [
-      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-700 dark:text-gray-300", children: t("showingRange", { from, to, total: totalItems }) }) }),
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-700 dark:text-slate-300", children: t("showingRange", { from, to, total: totalItems }) }) }),
       /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
         "nav",
         {
@@ -2524,7 +2524,7 @@ function Pagination({
                 type: "button",
                 onClick: () => onPageChange(currentPage - 1),
                 disabled: currentPage === 1,
-                className: "relative inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 disabled:opacity-50 disabled:cursor-not-allowed dark:ring-gray-700 dark:hover:bg-white/5",
+                className: "relative inline-flex items-center rounded-l-md px-2 py-2 text-slate-400 ring-1 ring-inset ring-white/30 dark:ring-white/10 hover:bg-white/40 dark:hover:bg-white/[0.08] focus:z-20 focus:outline-offset-0 disabled:opacity-50 disabled:cursor-not-allowed",
                 children: [
                   /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("previous") }),
                   /* @__PURE__ */ jsx(ChevronLeftIcon, { "aria-hidden": "true", className: "size-5" })
@@ -2535,7 +2535,7 @@ function Pagination({
               (page, index) => page === "ellipsis" ? /* @__PURE__ */ jsx(
                 "span",
                 {
-                  className: "relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-700 ring-1 ring-inset ring-gray-300 focus:outline-offset-0 dark:text-gray-400 dark:ring-gray-700",
+                  className: "relative inline-flex items-center px-4 py-2 text-sm font-semibold text-slate-700 ring-1 ring-inset ring-white/30 dark:ring-white/10 focus:outline-offset-0 dark:text-slate-400",
                   children: "..."
                 },
                 `ellipsis-${index}`
@@ -2545,7 +2545,7 @@ function Pagination({
                   type: "button",
                   onClick: () => onPageChange(page),
                   "aria-current": currentPage === page ? "page" : void 0,
-                  className: currentPage === page ? "relative z-10 inline-flex items-center bg-indigo-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 dark:bg-indigo-500 dark:focus-visible:outline-indigo-500" : "relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 dark:text-gray-200 dark:ring-gray-700 dark:hover:bg-white/5",
+                  className: currentPage === page ? "relative z-10 inline-flex items-center bg-indigo-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 dark:bg-indigo-500 dark:focus-visible:outline-indigo-500" : "relative inline-flex items-center px-4 py-2 text-sm font-semibold text-slate-900 ring-1 ring-inset ring-white/30 dark:ring-white/10 hover:bg-white/40 dark:hover:bg-white/[0.08] focus:z-20 focus:outline-offset-0 dark:text-slate-200",
                   children: page
                 },
                 page
@@ -2557,7 +2557,7 @@ function Pagination({
                 type: "button",
                 onClick: () => onPageChange(currentPage + 1),
                 disabled: currentPage === totalPages,
-                className: "relative inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 disabled:opacity-50 disabled:cursor-not-allowed dark:ring-gray-700 dark:hover:bg-white/5",
+                className: "relative inline-flex items-center rounded-r-md px-2 py-2 text-slate-400 ring-1 ring-inset ring-white/30 dark:ring-white/10 hover:bg-white/40 dark:hover:bg-white/[0.08] focus:z-20 focus:outline-offset-0 disabled:opacity-50 disabled:cursor-not-allowed",
                 children: [
                   /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("next") }),
                   /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "size-5" })
@@ -2599,9 +2599,9 @@ var colorClasses2 = {
     dot: "bg-emerald-600 dark:bg-emerald-400"
   },
   gray: {
-    track: "border-gray-200 dark:border-gray-700",
-    indicator: "border-t-gray-600 dark:border-t-gray-400",
-    dot: "bg-gray-600 dark:bg-gray-400"
+    track: "border-slate-200 dark:border-slate-700",
+    indicator: "border-t-slate-600 dark:border-t-slate-400",
+    dot: "bg-slate-600 dark:bg-slate-400"
   },
   current: {
     track: "border-current/20",
@@ -2695,7 +2695,7 @@ function Spinner({
   if (label) {
     return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
       /* @__PURE__ */ jsx(SpinnerComponent, { size, color, className, ariaLabel }),
-      /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500 dark:text-gray-400", children: label })
+      /* @__PURE__ */ jsx("span", { className: "text-sm text-slate-500 dark:text-slate-400", children: label })
     ] });
   }
   return /* @__PURE__ */ jsx(
@@ -2717,12 +2717,12 @@ function LoadingOverlay({ show, message, blur = true }) {
       exit: { opacity: 0 },
       className: clsx$1(
         "fixed inset-0 z-50 flex flex-col items-center justify-center",
-        "bg-white/80 dark:bg-gray-900/80",
+        "bg-white/80 dark:bg-slate-900/80",
         blur && "backdrop-blur-sm"
       ),
       children: [
         /* @__PURE__ */ jsx(Spinner, { size: "lg", color: "blue", variant: "circle" }),
-        message && /* @__PURE__ */ jsx("p", { className: "mt-4 text-gray-600 dark:text-gray-300 font-medium", children: message })
+        message && /* @__PURE__ */ jsx("p", { className: "mt-4 text-slate-600 dark:text-slate-300 font-medium", children: message })
       ]
     }
   );
@@ -3014,7 +3014,7 @@ function SegmentedControl({
       ref: containerRef,
       className: `
         relative inline-flex items-center rounded-xl
-        bg-gray-100 dark:bg-gray-800
+        bg-white/40 dark:bg-white/[0.08]
         ${styles2.container}
         ${fullWidth ? "w-full" : ""}
         ${disabled ? "opacity-50 pointer-events-none" : ""}
@@ -3023,7 +3023,7 @@ function SegmentedControl({
         /* @__PURE__ */ jsx(
           motion.div,
           {
-            className: "absolute top-1 bottom-1 rounded-lg bg-white dark:bg-gray-700 shadow-sm",
+            className: "absolute top-1 bottom-1 rounded-lg bg-white/75 dark:bg-white/[0.12] shadow-sm backdrop-blur-sm",
             initial: false,
             animate: {
               left: indicatorStyle.left,
@@ -3044,7 +3044,7 @@ function SegmentedControl({
               font-medium rounded-lg transition-colors duration-150
               ${styles2.segment}
               ${fullWidth ? "flex-1" : ""}
-              ${isSelected ? "text-gray-900 dark:text-white" : "text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300"}
+              ${isSelected ? "text-slate-900 dark:text-white" : "text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-300"}
             `,
               children: [
                 segment.icon && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: segment.icon }),
@@ -4081,10 +4081,10 @@ function Table({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(TableContext.Provider, { value: { bleed, dense, grid, striped, loading, emptyState }, children: /* @__PURE__ */ jsx("div", { className: "flow-root", children: /* @__PURE__ */ jsx("div", { ...props, className: clsx(className, "-mx-(--gutter) overflow-x-auto whitespace-nowrap"), children: /* @__PURE__ */ jsx("div", { className: clsx("inline-block min-w-full align-middle", !bleed && "sm:px-(--gutter)"), children: /* @__PURE__ */ jsx("table", { className: "min-w-full text-left text-sm/6 text-zinc-950 dark:text-white", children }) }) }) }) });
+  return /* @__PURE__ */ jsx(TableContext.Provider, { value: { bleed, dense, grid, striped, loading, emptyState }, children: /* @__PURE__ */ jsx("div", { className: "flow-root", children: /* @__PURE__ */ jsx("div", { ...props, className: clsx(className, "-mx-(--gutter) overflow-x-auto whitespace-nowrap"), children: /* @__PURE__ */ jsx("div", { className: clsx("inline-block min-w-full align-middle", !bleed && "sm:px-(--gutter)"), children: /* @__PURE__ */ jsx("table", { className: "min-w-full text-left text-sm/6 text-slate-950 dark:text-white", children }) }) }) }) });
 }
 function TableHead({ className, ...props }) {
-  return /* @__PURE__ */ jsx("thead", { ...props, className: clsx(className, "text-zinc-500 dark:text-zinc-400") });
+  return /* @__PURE__ */ jsx("thead", { ...props, className: clsx(className, "text-slate-500 dark:text-slate-400") });
 }
 function TableBody(props) {
   return /* @__PURE__ */ jsx("tbody", { ...props });
@@ -4109,9 +4109,9 @@ function TableRow({
       className: clsx(
         className,
         href && "has-[[data-row-link][data-focus]]:outline-2 has-[[data-row-link][data-focus]]:-outline-offset-2 has-[[data-row-link][data-focus]]:outline-blue-500 dark:focus-within:bg-white/2.5",
-        striped && "even:bg-zinc-950/2.5 dark:even:bg-white/2.5",
-        href && striped && "hover:bg-zinc-950/5 dark:hover:bg-white/5",
-        href && !striped && "hover:bg-zinc-950/2.5 dark:hover:bg-white/2.5"
+        striped && "even:bg-slate-950/2.5 dark:even:bg-white/2.5",
+        href && striped && "hover:bg-slate-950/5 dark:hover:bg-white/5",
+        href && !striped && "hover:bg-slate-950/2.5 dark:hover:bg-white/2.5"
       )
     }
   ) });
@@ -4124,8 +4124,8 @@ function TableHeader({ className, ...props }) {
       ...props,
       className: clsx(
         className,
-        "border-b border-b-zinc-950/10 px-4 py-2 font-medium first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2)) dark:border-b-white/10",
-        grid && "border-l border-l-zinc-950/5 first:border-l-0 dark:border-l-white/5",
+        "border-b border-b-white/20 dark:border-b-white/10 px-4 py-2 font-medium first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))",
+        grid && "border-l border-l-white/20 first:border-l-0 dark:border-l-white/10",
         !bleed && "sm:first:pl-1 sm:last:pr-1"
       )
     }
@@ -4143,8 +4143,8 @@ function TableCell({ className, children, ...props }) {
       className: clsx(
         className,
         "relative px-4 first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))",
-        !striped && "border-b border-zinc-950/5 dark:border-white/5",
-        grid && "border-l border-l-zinc-950/5 first:border-l-0 dark:border-l-white/5",
+        !striped && "border-b border-white/20 dark:border-white/[0.08]",
+        grid && "border-l border-l-white/20 first:border-l-0 dark:border-l-white/10",
         dense ? "py-2.5" : "py-4",
         !bleed && "sm:first:pl-1 sm:last:pr-1"
       ),
@@ -4194,10 +4194,10 @@ function SortableTableHeader({
       onClick: handleSort,
       className: clsx(
         className,
-        "border-b border-b-zinc-950/10 px-4 py-2 font-medium first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2)) dark:border-b-white/10",
-        grid && "border-l border-l-zinc-950/5 first:border-l-0 dark:border-l-white/5",
+        "border-b border-b-white/20 dark:border-b-white/10 px-4 py-2 font-medium first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))",
+        grid && "border-l border-l-white/20 first:border-l-0 dark:border-l-white/10",
         !bleed && "sm:first:pl-1 sm:last:pr-1",
-        "cursor-pointer select-none hover:bg-zinc-950/5 dark:hover:bg-white/5 transition-colors",
+        "cursor-pointer select-none hover:bg-white/30 dark:hover:bg-white/[0.06] transition-colors",
         isActive && "text-[#007AFF] dark:text-[#0A84FF]"
       ),
       children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
@@ -4226,14 +4226,14 @@ function TableSkeletonRow({
     {
       className: clsx(
         "px-4 first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))",
-        "border-b border-zinc-950/5 dark:border-white/5",
+        "border-b border-white/20 dark:border-white/[0.08]",
         dense ? "py-2.5" : "py-4"
       ),
       children: /* @__PURE__ */ jsx(
         "div",
         {
           className: clsx(
-            "h-4 rounded bg-zinc-200 dark:bg-zinc-700 animate-pulse",
+            "h-4 rounded bg-slate-200 dark:bg-slate-700 animate-pulse",
             i === 0 ? "w-32" : i === columns - 1 ? "w-16" : "w-24"
           )
         }
@@ -4263,10 +4263,10 @@ function TableEmptyState({
       transition: getTransition(springPresets.gentle),
       className: "flex flex-col items-center gap-3",
       children: [
-        icon && /* @__PURE__ */ jsx("div", { className: "h-12 w-12 rounded-full bg-zinc-100 dark:bg-zinc-800 flex items-center justify-center text-zinc-400 dark:text-zinc-500", children: icon }),
+        icon && /* @__PURE__ */ jsx("div", { className: "h-12 w-12 rounded-full bg-white/40 dark:bg-white/[0.04] flex items-center justify-center text-slate-400 dark:text-slate-500", children: icon }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx("h3", { className: "font-medium text-zinc-900 dark:text-white", children: title }),
-          description && /* @__PURE__ */ jsx("p", { className: "text-sm text-zinc-500 dark:text-zinc-400 max-w-sm", children: description })
+          /* @__PURE__ */ jsx("h3", { className: "font-medium text-slate-900 dark:text-white", children: title }),
+          description && /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500 dark:text-slate-400 max-w-sm", children: description })
         ] }),
         action && /* @__PURE__ */ jsx("div", { className: "mt-2", children: action })
       ]
@@ -4297,9 +4297,9 @@ function AnimatedTableRow({
       className: clsx(
         className,
         href && "has-[[data-row-link][data-focus]]:outline-2 has-[[data-row-link][data-focus]]:-outline-offset-2 has-[[data-row-link][data-focus]]:outline-blue-500 dark:focus-within:bg-white/2.5",
-        striped && "even:bg-zinc-950/2.5 dark:even:bg-white/2.5",
-        href && striped && "hover:bg-zinc-950/5 dark:hover:bg-white/5",
-        href && !striped && "hover:bg-zinc-950/2.5 dark:hover:bg-white/2.5"
+        striped && "even:bg-slate-950/2.5 dark:even:bg-white/2.5",
+        href && striped && "hover:bg-slate-950/5 dark:hover:bg-white/5",
+        href && !striped && "hover:bg-slate-950/2.5 dark:hover:bg-white/2.5"
       )
     }
   ) });
@@ -4326,9 +4326,9 @@ function SelectableTableRow({
       className: clsx(
         className,
         href && "has-[[data-row-link][data-focus]]:outline-2 has-[[data-row-link][data-focus]]:-outline-offset-2 has-[[data-row-link][data-focus]]:outline-blue-500 dark:focus-within:bg-white/2.5",
-        striped && "even:bg-zinc-950/2.5 dark:even:bg-white/2.5",
-        href && striped && "hover:bg-zinc-950/5 dark:hover:bg-white/5",
-        href && !striped && "hover:bg-zinc-950/2.5 dark:hover:bg-white/2.5",
+        striped && "even:bg-slate-950/2.5 dark:even:bg-white/2.5",
+        href && striped && "hover:bg-slate-950/5 dark:hover:bg-white/5",
+        href && !striped && "hover:bg-slate-950/2.5 dark:hover:bg-white/2.5",
         selected && "bg-[#007AFF]/5 dark:bg-[#0A84FF]/10"
       ),
       children: [
@@ -4337,7 +4337,7 @@ function SelectableTableRow({
           {
             className: clsx(
               "px-4 first:pl-(--gutter,--spacing(2))",
-              "border-b border-zinc-950/5 dark:border-white/5",
+              "border-b border-white/20 dark:border-white/[0.08]",
               dense ? "py-2.5" : "py-4"
             ),
             children: /* @__PURE__ */ jsx(
@@ -4352,7 +4352,7 @@ function SelectableTableRow({
                 transition: getTransition(springPresets.stiff),
                 className: clsx(
                   "h-5 w-5 rounded-full border-2 flex items-center justify-center transition-colors",
-                  selected ? "bg-[#007AFF] dark:bg-[#0A84FF] border-[#007AFF] dark:border-[#0A84FF]" : "border-zinc-300 dark:border-zinc-600"
+                  selected ? "bg-[#007AFF] dark:bg-[#0A84FF] border-[#007AFF] dark:border-[#0A84FF]" : "border-slate-300 dark:border-slate-600"
                 ),
                 children: /* @__PURE__ */ jsx(AnimatePresence, { children: selected && /* @__PURE__ */ jsx(
                   motion.svg,
@@ -4390,9 +4390,9 @@ function EmptyState({
     action?.onClick();
   };
   const containerClasses = {
-    default: "bg-gray-50 dark:bg-gray-800/50 rounded-xl border border-dashed border-gray-300 dark:border-gray-600",
+    default: "liquid-surface rounded-xl border border-dashed border-white/30 dark:border-white/10",
     minimal: "",
-    card: "bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl rounded-2xl shadow-lg shadow-black/5 border border-white/20 dark:border-gray-700/50"
+    card: "liquid-surface rounded-2xl border border-white/20 dark:border-white/10"
   };
   return /* @__PURE__ */ jsxs(
     "div",
@@ -4406,7 +4406,7 @@ function EmptyState({
             animate: { scale: 1, opacity: 1 },
             transition: springPresets.bouncy,
             className: "mx-auto mb-4",
-            children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-gray-100 dark:bg-gray-700/50", children: /* @__PURE__ */ jsx(Icon, { className: "h-8 w-8 text-gray-400 dark:text-gray-500" }) })
+            children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-white/40 dark:bg-white/[0.04]", children: /* @__PURE__ */ jsx(Icon, { className: "h-8 w-8 text-slate-400 dark:text-slate-500" }) })
           }
         ),
         /* @__PURE__ */ jsxs(
@@ -4416,8 +4416,8 @@ function EmptyState({
             animate: { y: 0, opacity: 1 },
             transition: { ...springPresets.default, delay: 0.1 },
             children: [
-              /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-gray-900 dark:text-white", children: message }),
-              description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto", children: description })
+              /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-slate-900 dark:text-white", children: message }),
+              description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-slate-500 dark:text-slate-400 max-w-sm mx-auto", children: description })
             ]
           }
         ),
@@ -4434,7 +4434,7 @@ function EmptyState({
                 whileTap: { scale: 0.97 },
                 transition: springPresets.stiff,
                 onClick: handleActionClick,
-                className: "inline-flex items-center justify-center rounded-full bg-blue-500 px-6 py-2.5 text-sm font-semibold text-white shadow-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 transition-colors",
+                className: "inline-flex items-center justify-center rounded-full bg-blue-500 px-6 py-2.5 text-sm font-semibold text-white shadow-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-slate-900 transition-colors",
                 children: action.label
               }
             )
@@ -4477,8 +4477,8 @@ var errorTypeConfig = {
     icon: DocumentMagnifyingGlassIcon,
     titleKey: "notFoundTitle",
     messageKey: "notFoundMessage",
-    iconBg: "bg-zinc-100 dark:bg-zinc-800",
-    iconColor: "text-zinc-400 dark:text-zinc-500"
+    iconBg: "bg-white/40 dark:bg-white/[0.04]",
+    iconColor: "text-slate-400 dark:text-slate-500"
   }
 };
 function ErrorState({
@@ -4514,10 +4514,10 @@ function ErrorState({
     setShowErrorDetails(!showErrorDetails);
   };
   const containerClasses = {
-    default: "bg-gray-50 dark:bg-gray-800/50 rounded-xl border border-gray-200 dark:border-gray-700",
+    default: "liquid-surface rounded-xl border border-white/30 dark:border-white/10",
     minimal: "",
-    card: "bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl rounded-2xl shadow-lg shadow-black/5 border border-white/20 dark:border-gray-700/50",
-    fullscreen: "fixed inset-0 flex items-center justify-center bg-white dark:bg-gray-900 z-50"
+    card: "liquid-surface rounded-2xl border border-white/20 dark:border-white/10",
+    fullscreen: "fixed inset-0 flex items-center justify-center bg-white dark:bg-slate-900 z-50"
   };
   const content = /* @__PURE__ */ jsxs("div", { role: "alert", className: variant === "fullscreen" ? "" : `px-6 py-12 text-center ${containerClasses[variant]}`, children: [
     /* @__PURE__ */ jsx(
@@ -4537,9 +4537,9 @@ function ErrorState({
         animate: { y: 0, opacity: 1 },
         transition: { ...getTransition(springPresets.default), delay: 0.1 },
         children: [
-          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: title || t(config.titleKey) }),
-          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto", children: message || t(config.messageKey) }),
-          errorCode && /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-gray-400 dark:text-gray-500 font-mono", children: t("errorCode", { code: errorCode }) })
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-slate-900 dark:text-white", children: title || t(config.titleKey) }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-slate-500 dark:text-slate-400 max-w-sm mx-auto", children: message || t(config.messageKey) }),
+          errorCode && /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-slate-400 dark:text-slate-500 font-mono", children: t("errorCode", { code: errorCode }) })
         ]
       }
     ),
@@ -4558,7 +4558,7 @@ function ErrorState({
               transition: getTransition(springPresets.stiff),
               onClick: handleRetry,
               disabled: isRetrying,
-              className: "inline-flex items-center justify-center gap-2 rounded-full bg-[#007AFF] dark:bg-[#0A84FF] px-6 py-2.5 text-sm font-semibold text-white shadow-md hover:opacity-90 focus:outline-none focus:ring-2 focus:ring-[#007AFF] focus:ring-offset-2 dark:focus:ring-offset-gray-900 transition-all disabled:opacity-50",
+              className: "inline-flex items-center justify-center gap-2 rounded-full bg-[#007AFF] dark:bg-[#0A84FF] px-6 py-2.5 text-sm font-semibold text-white shadow-md hover:opacity-90 focus:outline-none focus:ring-2 focus:ring-[#007AFF] focus:ring-offset-2 dark:focus:ring-offset-slate-900 transition-all disabled:opacity-50",
               children: [
                 /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: isRetrying ? /* @__PURE__ */ jsx(
                   motion.span,
@@ -4593,7 +4593,7 @@ function ErrorState({
                 triggerHaptic("light");
                 secondaryAction.onClick();
               },
-              className: "inline-flex items-center justify-center rounded-full px-6 py-2.5 text-sm font-semibold text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-gray-300 focus:ring-offset-2 dark:focus:ring-offset-gray-900 transition-colors",
+              className: "inline-flex items-center justify-center rounded-full px-6 py-2.5 text-sm font-semibold text-slate-700 dark:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] focus:outline-none focus:ring-2 focus:ring-white/30 dark:ring-white/10 focus:ring-offset-2 dark:focus:ring-offset-slate-900 transition-colors",
               children: secondaryAction.label
             }
           )
@@ -4612,7 +4612,7 @@ function ErrorState({
             "button",
             {
               onClick: toggleDetails,
-              className: "text-xs text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-400 transition-colors",
+              className: "text-xs text-slate-400 dark:text-slate-500 hover:text-slate-600 dark:hover:text-slate-400 transition-colors",
               children: showErrorDetails ? t("hideDetails") : t("showDetails")
             }
           ),
@@ -4624,7 +4624,7 @@ function ErrorState({
               exit: { height: 0, opacity: 0 },
               transition: getTransition(springPresets.gentle),
               className: "overflow-hidden",
-              children: /* @__PURE__ */ jsx("pre", { className: "mt-3 p-3 bg-gray-100 dark:bg-gray-800 rounded-lg text-xs text-left text-gray-600 dark:text-gray-400 font-mono overflow-x-auto max-h-32", children: details })
+              children: /* @__PURE__ */ jsx("pre", { className: "mt-3 p-3 bg-white/40 dark:bg-white/[0.04] rounded-lg text-xs text-left text-slate-600 dark:text-slate-400 font-mono overflow-x-auto max-h-32", children: details })
             }
           ) })
         ]
@@ -4676,7 +4676,7 @@ function NoResultsState({
         animate: { scale: 1, opacity: 1 },
         transition: getTransition(springPresets.bouncy),
         className: "mx-auto mb-4",
-        children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-zinc-100 dark:bg-zinc-800", children: /* @__PURE__ */ jsx(DocumentMagnifyingGlassIcon, { className: "h-8 w-8 text-zinc-400 dark:text-zinc-500" }) })
+        children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-white/40 dark:bg-white/[0.04]", children: /* @__PURE__ */ jsx(DocumentMagnifyingGlassIcon, { className: "h-8 w-8 text-slate-400 dark:text-slate-500" }) })
       }
     ),
     /* @__PURE__ */ jsxs(
@@ -4686,14 +4686,14 @@ function NoResultsState({
         animate: { y: 0, opacity: 1 },
         transition: { ...getTransition(springPresets.default), delay: 0.1 },
         children: [
-          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: t("noResultsFound") }),
-          searchTerm && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-gray-500 dark:text-gray-400", children: t("noResultsFor", { searchTerm }) }),
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-slate-900 dark:text-white", children: t("noResultsFound") }),
+          searchTerm && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-slate-500 dark:text-slate-400", children: t("noResultsFor", { searchTerm }) }),
           suggestions && suggestions.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
-            /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-400 dark:text-gray-500 mb-2", children: t("trySuggestions") }),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-slate-400 dark:text-slate-500 mb-2", children: t("trySuggestions") }),
             /* @__PURE__ */ jsx("div", { className: "flex flex-wrap justify-center gap-2", children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
               "span",
               {
-                className: "px-3 py-1 text-xs rounded-full bg-gray-100 dark:bg-gray-800 text-gray-600 dark:text-gray-400",
+                className: "px-3 py-1 text-xs rounded-full bg-white/40 dark:bg-white/[0.04] text-slate-600 dark:text-slate-400",
                 children: suggestion
               },
               index
@@ -4731,7 +4731,7 @@ function NoDataState({
   const resolvedTitle = title || t("noDataTitle");
   const resolvedMessage = message || t("noDataMessage");
   const resolvedActionLabel = actionLabel || t("createNew");
-  return /* @__PURE__ */ jsxs("div", { className: "px-6 py-12 text-center bg-gray-50 dark:bg-gray-800/50 rounded-xl border border-dashed border-gray-300 dark:border-gray-600", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "px-6 py-12 text-center liquid-surface rounded-xl border border-dashed border-white/30 dark:border-white/10", children: [
     /* @__PURE__ */ jsx(
       motion.div,
       {
@@ -4739,7 +4739,7 @@ function NoDataState({
         animate: { scale: 1, opacity: 1 },
         transition: getTransition(springPresets.bouncy),
         className: "mx-auto mb-4",
-        children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-gray-100 dark:bg-gray-700/50", children: /* @__PURE__ */ jsx(Icon, { className: "h-8 w-8 text-gray-400 dark:text-gray-500" }) })
+        children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-16 w-16 items-center justify-center rounded-full bg-white/40 dark:bg-white/[0.04]", children: /* @__PURE__ */ jsx(Icon, { className: "h-8 w-8 text-slate-400 dark:text-slate-500" }) })
       }
     ),
     /* @__PURE__ */ jsxs(
@@ -4749,8 +4749,8 @@ function NoDataState({
         animate: { y: 0, opacity: 1 },
         transition: { ...getTransition(springPresets.default), delay: 0.1 },
         children: [
-          /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-gray-900 dark:text-white", children: resolvedTitle }),
-          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto", children: resolvedMessage })
+          /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-slate-900 dark:text-white", children: resolvedTitle }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-slate-500 dark:text-slate-400 max-w-sm mx-auto", children: resolvedMessage })
         ]
       }
     ),
@@ -5308,7 +5308,7 @@ var TONE_STYLES = {
   error: { container: "border-red-500/30 bg-red-500/20 text-red-600 dark:text-red-400", dot: "bg-red-500" },
   warning: { container: "border-amber-500/30 bg-amber-500/20 text-amber-600 dark:text-amber-400", dot: "bg-amber-500" },
   info: { container: "border-blue-500/30 bg-blue-500/20 text-blue-600 dark:text-blue-400", dot: "bg-blue-500" },
-  neutral: { container: "border-gray-500/30 bg-gray-500/20 text-gray-600 dark:text-gray-400", dot: "bg-gray-500" },
+  neutral: { container: "border-slate-500/30 bg-slate-500/20 text-slate-600 dark:text-slate-400", dot: "bg-slate-500" },
   success: { container: "border-emerald-500/30 bg-emerald-500/20 text-emerald-600 dark:text-emerald-400", dot: "bg-emerald-500" }
 };
 var LEGACY_STATUS_STYLES = {
@@ -5316,7 +5316,7 @@ var LEGACY_STATUS_STYLES = {
   approved: "border-green-200 bg-green-50 text-green-700 dark:border-green-700/30 dark:bg-green-900/20 dark:text-green-400",
   rejected: "border-red-200 bg-red-50 text-red-700 dark:border-red-700/30 dark:bg-red-900/20 dark:text-red-400",
   active: "border-emerald-200 bg-emerald-50 text-emerald-700 dark:border-emerald-700/30 dark:bg-emerald-900/20 dark:text-emerald-400",
-  inactive: "border-gray-200 bg-gray-50 text-gray-700 dark:border-gray-700/30 dark:bg-gray-900/20 dark:text-gray-400",
+  inactive: "border-white/30 dark:border-white/10 bg-slate-500/10 text-slate-700 dark:bg-slate-900/20 dark:text-slate-400",
   processing: "border-blue-200 bg-blue-50 text-blue-700 dark:border-blue-700/30 dark:bg-blue-900/20 dark:text-blue-400",
   error: "border-red-200 bg-red-50 text-red-700 dark:border-red-700/30 dark:bg-red-900/20 dark:text-red-400",
   success: "border-green-200 bg-green-50 text-green-700 dark:border-green-700/30 dark:bg-green-900/20 dark:text-green-400"
@@ -5326,7 +5326,7 @@ var LEGACY_DOT_STYLES = {
   approved: "bg-green-500",
   rejected: "bg-red-500",
   active: "bg-emerald-500",
-  inactive: "bg-gray-500",
+  inactive: "bg-slate-500",
   processing: "bg-blue-500",
   error: "bg-red-500",
   success: "bg-green-500"
@@ -5335,7 +5335,7 @@ var SIZE_STYLES = {
   sm: "px-2 py-0.5 text-xs",
   md: "px-2.5 py-1 text-xs"
 };
-var DEFAULT_LEGACY_STYLE = "border-gray-200 bg-gray-50 text-gray-700 dark:border-gray-700/30 dark:bg-gray-900/20 dark:text-gray-400";
+var DEFAULT_LEGACY_STYLE = "border-white/30 dark:border-white/10 bg-slate-500/10 text-slate-700 dark:bg-slate-900/20 dark:text-slate-400";
 var StatusBadge = forwardRef(function StatusBadge2({ status, label, size = "md", className = "", ...props }, ref) {
   if ("statusConfig" in props && props.statusConfig) {
     const configuredStatus = props.statusConfig[status];
@@ -5361,7 +5361,7 @@ var StatusBadge = forwardRef(function StatusBadge2({ status, label, size = "md",
     );
   }
   const legacyStyle = LEGACY_STATUS_STYLES[status] ?? DEFAULT_LEGACY_STYLE;
-  const legacyDot = LEGACY_DOT_STYLES[status] ?? "bg-gray-500";
+  const legacyDot = LEGACY_DOT_STYLES[status] ?? "bg-slate-500";
   const resolvedLabel = label ?? status;
   return /* @__PURE__ */ jsxs(
     "div",
@@ -5449,7 +5449,7 @@ function Dialog4({
       Headless6.DialogBackdrop,
       {
         transition: true,
-        className: "fixed inset-0 flex w-screen justify-center overflow-y-auto bg-zinc-950/25 px-2 py-2 transition duration-100 focus:outline-0 data-closed:opacity-0 data-enter:ease-out data-leave:ease-in sm:px-6 sm:py-8 lg:px-8 lg:py-16 dark:bg-zinc-950/50"
+        className: "fixed inset-0 flex w-screen justify-center overflow-y-auto bg-slate-950/25 backdrop-blur-sm px-2 py-2 transition duration-100 focus:outline-0 data-closed:opacity-0 data-enter:ease-out data-leave:ease-in sm:px-6 sm:py-8 lg:px-8 lg:py-16 dark:bg-slate-950/50"
       }
     ),
     /* @__PURE__ */ jsx("div", { className: "fixed inset-0 w-screen overflow-y-auto pt-6 sm:pt-0", children: /* @__PURE__ */ jsx("div", { className: "grid min-h-full grid-rows-[1fr_auto] justify-items-center sm:grid-rows-[1fr_auto_3fr] sm:p-4", children: /* @__PURE__ */ jsx(
@@ -5459,7 +5459,7 @@ function Dialog4({
         className: clsx(
           className,
           sizes2[size],
-          "row-start-2 w-full min-w-0 rounded-t-3xl bg-white p-(--gutter) shadow-lg ring-1 ring-zinc-950/10 [--gutter:--spacing(8)] sm:mb-auto sm:rounded-2xl dark:bg-zinc-900 dark:ring-white/10 forced-colors:outline",
+          "row-start-2 w-full min-w-0 rounded-t-3xl bg-white/80 backdrop-blur-2xl p-(--gutter) shadow-lg ring-1 ring-white/30 [--gutter:--spacing(8)] sm:mb-auto sm:rounded-2xl dark:bg-slate-900/80 dark:ring-white/10 forced-colors:outline",
           "transition duration-100 will-change-transform data-closed:translate-y-12 data-closed:opacity-0 data-enter:ease-out data-leave:ease-in sm:data-closed:translate-y-0 sm:data-closed:data-enter:scale-95"
         ),
         children
@@ -5477,7 +5477,7 @@ function DialogTitle3({
       ...props,
       className: clsx(
         className,
-        "text-lg/6 font-semibold text-balance text-zinc-950 sm:text-base/6 dark:text-white"
+        "text-lg/6 font-semibold text-balance text-slate-950 sm:text-base/6 dark:text-white"
       )
     }
   );
@@ -5879,12 +5879,12 @@ function FormModal({
     onSubmit?.(e);
   };
   const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { className: "liquid-surface shrink-0 border-b border-gray-200 dark:border-white/10 rounded-t-2xl", children: /* @__PURE__ */ jsxs("div", { className: "px-4 sm:px-6 py-3 sm:py-4 flex items-center justify-between", children: [
+    /* @__PURE__ */ jsx("div", { className: "liquid-surface shrink-0 border-b border-white/30 dark:border-white/10 rounded-t-2xl", children: /* @__PURE__ */ jsxs("div", { className: "px-4 sm:px-6 py-3 sm:py-4 flex items-center justify-between", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
         icon && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: icon }),
         /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(DialogTitle, { className: "text-base sm:text-lg font-semibold text-gray-900 dark:text-white", children: title }),
-          subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs sm:text-sm text-gray-500 dark:text-gray-400 mt-0.5", children: subtitle })
+          /* @__PURE__ */ jsx(DialogTitle, { className: "text-base sm:text-lg font-semibold text-slate-900 dark:text-white", children: title }),
+          subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs sm:text-sm text-slate-500 dark:text-slate-400 mt-0.5", children: subtitle })
         ] })
       ] }),
       /* @__PURE__ */ jsx(
@@ -5898,7 +5898,7 @@ function FormModal({
       )
     ] }) }),
     /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 py-4 sm:py-6", children }) }),
-    showFooter && /* @__PURE__ */ jsx("div", { className: "liquid-surface shrink-0 border-t border-gray-200 dark:border-white/10 rounded-b-2xl", children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 py-3 sm:py-4 flex flex-col sm:flex-row justify-end gap-2 sm:gap-3", children: footer || /* @__PURE__ */ jsxs(Fragment, { children: [
+    showFooter && /* @__PURE__ */ jsx("div", { className: "liquid-surface shrink-0 border-t border-white/30 dark:border-white/10 rounded-b-2xl", children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 py-3 sm:py-4 flex flex-col sm:flex-row justify-end gap-2 sm:gap-3", children: footer || /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         Button,
         {
@@ -7119,9 +7119,21 @@ function StepFormPage({
     /* @__PURE__ */ jsxs("div", { className: "liquid-surface overflow-hidden rounded-2xl", children: [
       gradient && /* @__PURE__ */ jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
       /* @__PURE__ */ jsxs("div", { className: "p-5 sm:p-8", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
-          icon,
-          /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: label })
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
+            icon,
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: label })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: onCancel,
+              className: "rounded-xl p-2 text-gray-400 transition hover:bg-white/60 dark:hover:bg-white/10",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ jsx(XMarkIcon$1, { className: "h-5 w-5" })
+            }
+          )
         ] }),
         /* @__PURE__ */ jsx("h1", { className: "mt-2 text-2xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-3xl", children: steps[currentStep]?.title ?? title }),
         steps[currentStep]?.description ?? subtitle ? /* @__PURE__ */ jsx("p", { className: "mt-2 max-w-xl text-sm text-slate-500 dark:text-white/60 sm:text-base", children: steps[currentStep]?.description ?? subtitle }) : null,
@@ -7357,7 +7369,7 @@ function StatusBadgeInternal({ status }) {
   return /* @__PURE__ */ jsx(
     "span",
     {
-      className: `shrink-0 rounded-full px-2 py-0.5 text-xs font-medium ${status ? "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-300" : "bg-gray-100 text-gray-500 dark:bg-gray-700 dark:text-gray-400"}`,
+      className: `shrink-0 rounded-full px-2 py-0.5 text-xs font-medium ${status ? "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-300" : "bg-white/40 text-slate-500 dark:bg-white/[0.08] dark:text-slate-400"}`,
       children: status ? tCommon("active") : tCommon("inactive")
     }
   );
@@ -7393,14 +7405,14 @@ function EntityCard({
                 title,
                 subtitle,
                 iconContainerClassName: "shrink-0",
-                titleClassName: isPlainTextTitle(title) ? "truncate font-semibold text-gray-900 dark:text-white" : "font-semibold text-gray-900 dark:text-white",
-                subtitleClassName: "mt-0.5 text-xs text-gray-500 dark:text-gray-400"
+                titleClassName: isPlainTextTitle(title) ? "truncate font-semibold text-slate-900 dark:text-white" : "font-semibold text-slate-900 dark:text-white",
+                subtitleClassName: "mt-0.5 text-xs text-slate-500 dark:text-slate-400"
               }
             ),
             status !== void 0 && /* @__PURE__ */ jsx(StatusBadgeInternal, { status })
           ] }),
           children && /* @__PURE__ */ jsx("div", { className: "mt-3", children }),
-          footer && /* @__PURE__ */ jsx("div", { className: "mt-3 border-t border-neutral-400/20 pt-3 dark:border-gray-700 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: footer })
+          footer && /* @__PURE__ */ jsx("div", { className: "mt-3 border-t border-white/30 pt-3 dark:border-white/10 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: footer })
         ] })
       ]
     }
@@ -8577,7 +8589,7 @@ var colors = {
   fuchsia: "bg-fuchsia-400/15 text-fuchsia-700 group-data-hover:bg-fuchsia-400/25 dark:bg-fuchsia-400/10 dark:text-fuchsia-400 dark:group-data-hover:bg-fuchsia-400/20",
   pink: "bg-pink-400/15 text-pink-700 group-data-hover:bg-pink-400/25 dark:bg-pink-400/10 dark:text-pink-400 dark:group-data-hover:bg-pink-400/20",
   rose: "bg-rose-400/15 text-rose-700 group-data-hover:bg-rose-400/25 dark:bg-rose-400/10 dark:text-rose-400 dark:group-data-hover:bg-rose-400/20",
-  zinc: "bg-zinc-600/10 text-zinc-700 group-data-hover:bg-zinc-600/20 dark:bg-white/5 dark:text-zinc-400 dark:group-data-hover:bg-white/10"
+  zinc: "bg-slate-600/10 text-slate-700 group-data-hover:bg-slate-600/20 dark:bg-white/5 dark:text-slate-400 dark:group-data-hover:bg-white/10"
 };
 function Badge({ color = "zinc", className, ...props }) {
   return /* @__PURE__ */ jsx(
@@ -12752,9 +12764,9 @@ var ContactCard = React11__default.memo(function ContactCard2({
   phone
 }) {
   const t = useTranslations("contact");
-  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl bg-gray-50 p-10", children: [
-    /* @__PURE__ */ jsx("h3", { className: "text-base/7 font-semibold text-gray-900", children: t(type) }),
-    /* @__PURE__ */ jsxs("dl", { className: "mt-3 space-y-1 text-sm/6 text-gray-600", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl liquid-surface p-10", children: [
+    /* @__PURE__ */ jsx("h3", { className: "text-base/7 font-semibold text-slate-900", children: t(type) }),
+    /* @__PURE__ */ jsxs("dl", { className: "mt-3 space-y-1 text-sm/6 text-slate-600", children: [
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("dt", { className: "sr-only", children: "Email" }),
         /* @__PURE__ */ jsx("dd", { children: /* @__PURE__ */ jsx("a", { href: `mailto:${email}`, className: "font-semibold text-blue-600", children: email }) })
@@ -12771,9 +12783,9 @@ var OfficeCard = React11__default.memo(function OfficeCard2({
   address,
   postalCode
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl bg-gray-50 p-10", children: [
-    /* @__PURE__ */ jsx("h3", { className: "text-base/7 font-semibold text-gray-900", children: city }),
-    /* @__PURE__ */ jsxs("address", { className: "mt-3 space-y-1 text-sm/6 text-gray-600 not-italic", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl liquid-surface p-10", children: [
+    /* @__PURE__ */ jsx("h3", { className: "text-base/7 font-semibold text-slate-900", children: city }),
+    /* @__PURE__ */ jsxs("address", { className: "mt-3 space-y-1 text-sm/6 text-slate-600 not-italic", children: [
       /* @__PURE__ */ jsx("p", { children: address }),
       /* @__PURE__ */ jsx("p", { children: postalCode })
     ] })
@@ -12783,8 +12795,8 @@ var ContactSection = React11__default.memo(
   function ContactSection2({ title, subtitle, children }) {
     return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-10 py-16 lg:grid-cols-3", children: [
       /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h2", { className: "text-4xl font-semibold tracking-tight text-pretty text-gray-900", children: title }),
-        /* @__PURE__ */ jsx("p", { className: "mt-4 text-base/7 text-gray-600", children: subtitle })
+        /* @__PURE__ */ jsx("h2", { className: "text-4xl font-semibold tracking-tight text-pretty text-slate-900", children: title }),
+        /* @__PURE__ */ jsx("p", { className: "mt-4 text-base/7 text-slate-600", children: subtitle })
       ] }),
       /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-6 sm:grid-cols-2 lg:col-span-2 lg:gap-8", children })
     ] });
@@ -12837,9 +12849,9 @@ function DropdownMenu({
         // Handle scrolling when menu won't fit in viewport
         "overflow-y-auto",
         // Popover background
-        "bg-white/75 backdrop-blur-xl dark:bg-zinc-800/75",
+        "bg-white/75 backdrop-blur-xl dark:bg-slate-800/75",
         // Shadows
-        "shadow-lg ring-1 ring-zinc-950/10 dark:ring-white/10 dark:ring-inset",
+        "shadow-lg ring-1 ring-white/30 dark:ring-white/10 dark:ring-inset",
         // Define grid at the menu level if subgrid is supported
         "supports-[grid-template-columns:subgrid]:grid supports-[grid-template-columns:subgrid]:grid-cols-[auto_1fr_1.5rem_0.5rem_auto]",
         // Transitions
@@ -12857,7 +12869,7 @@ function DropdownItem({
     // Base styles
     "group cursor-default rounded-lg px-3.5 py-2.5 focus:outline-hidden sm:px-3 sm:py-1.5",
     // Text styles
-    "text-left text-base/6 text-zinc-950 sm:text-sm/6 dark:text-white forced-colors:text-[CanvasText]",
+    "text-left text-base/6 text-slate-950 sm:text-sm/6 dark:text-white forced-colors:text-[CanvasText]",
     // Focus
     "data-focus:bg-blue-500 data-focus:text-white",
     // Disabled state
@@ -12868,7 +12880,7 @@ function DropdownItem({
     "col-span-full grid grid-cols-[auto_1fr_1.5rem_0.5rem_auto] items-center supports-[grid-template-columns:subgrid]:grid-cols-subgrid",
     // Icons
     "*:data-[slot=icon]:col-start-1 *:data-[slot=icon]:row-start-1 *:data-[slot=icon]:mr-2.5 *:data-[slot=icon]:-ml-0.5 *:data-[slot=icon]:size-5 sm:*:data-[slot=icon]:mr-2 sm:*:data-[slot=icon]:size-4",
-    "*:data-[slot=icon]:text-zinc-500 data-focus:*:data-[slot=icon]:text-white dark:*:data-[slot=icon]:text-zinc-400 dark:data-focus:*:data-[slot=icon]:text-white",
+    "*:data-[slot=icon]:text-slate-500 data-focus:*:data-[slot=icon]:text-white dark:*:data-[slot=icon]:text-slate-400 dark:data-focus:*:data-[slot=icon]:text-white",
     // Avatar
     "*:data-[slot=avatar]:mr-2.5 *:data-[slot=avatar]:-ml-1 *:data-[slot=avatar]:size-6 sm:*:data-[slot=avatar]:mr-2 sm:*:data-[slot=avatar]:size-5"
   );
@@ -12892,7 +12904,7 @@ function DropdownDivider({
       ...props,
       className: clsx(
         className,
-        "col-span-full mx-3.5 my-1 h-px border-0 bg-zinc-950/5 sm:mx-3 dark:bg-white/10 forced-colors:bg-[CanvasText]"
+        "col-span-full mx-3.5 my-1 h-px border-0 bg-slate-950/5 sm:mx-3 dark:bg-white/10 forced-colors:bg-[CanvasText]"
       )
     }
   );
@@ -12913,24 +12925,24 @@ function DropdownLabel({
 }
 var colors2 = {
   "dark/zinc": [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]/25",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:var(--color-zinc-700)]/90"
+    "[--switch-bg-ring:var(--color-slate-950)]/90 [--switch-bg:var(--color-slate-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]/25",
+    "[--switch-ring:var(--color-slate-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:var(--color-slate-700)]/90"
   ],
   "dark/white": [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:transparent] dark:[--switch:var(--color-zinc-900)]"
+    "[--switch-bg-ring:var(--color-slate-950)]/90 [--switch-bg:var(--color-slate-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]",
+    "[--switch-ring:var(--color-slate-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:transparent] dark:[--switch:var(--color-slate-900)]"
   ],
   dark: [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:var(--color-white)]/15",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white]"
+    "[--switch-bg-ring:var(--color-slate-950)]/90 [--switch-bg:var(--color-slate-900)] dark:[--switch-bg-ring:var(--color-white)]/15",
+    "[--switch-ring:var(--color-slate-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white]"
   ],
   zinc: [
-    "[--switch-bg-ring:var(--color-zinc-700)]/90 [--switch-bg:var(--color-zinc-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-shadow:var(--color-black)]/10 [--switch:white] [--switch-ring:var(--color-zinc-700)]/90"
+    "[--switch-bg-ring:var(--color-slate-700)]/90 [--switch-bg:var(--color-slate-600)] dark:[--switch-bg-ring:transparent]",
+    "[--switch-shadow:var(--color-black)]/10 [--switch:white] [--switch-ring:var(--color-slate-700)]/90"
   ],
   white: [
     "[--switch-bg-ring:var(--color-black)]/15 [--switch-bg:white] dark:[--switch-bg-ring:transparent]",
-    "[--switch-shadow:var(--color-black)]/10 [--switch-ring:transparent] [--switch:var(--color-zinc-950)]"
+    "[--switch-shadow:var(--color-black)]/10 [--switch-ring:transparent] [--switch:var(--color-slate-950)]"
   ],
   red: [
     "[--switch-bg-ring:var(--color-red-700)]/90 [--switch-bg:var(--color-red-600)] dark:[--switch-bg-ring:transparent]",
@@ -13020,7 +13032,7 @@ function Switch2({
         // Outline and background color in forced-colors mode so switch is still visible
         "forced-colors:outline forced-colors:[--switch-bg:Highlight] dark:forced-colors:[--switch-bg:Highlight]",
         // Unchecked
-        "bg-zinc-200 ring-1 ring-black/5 ring-inset dark:bg-white/5 dark:ring-white/15",
+        "bg-slate-200 ring-1 ring-black/5 ring-inset dark:bg-white/5 dark:ring-white/15",
         // Checked
         "data-checked:bg-(--switch-bg) data-checked:ring-(--switch-bg-ring) dark:data-checked:bg-(--switch-bg) dark:data-checked:ring-(--switch-bg-ring)",
         // Focus
@@ -13029,7 +13041,7 @@ function Switch2({
         "data-hover:ring-black/15 data-hover:data-checked:ring-(--switch-bg-ring)",
         "dark:data-hover:ring-white/25 dark:data-hover:data-checked:ring-(--switch-bg-ring)",
         // Disabled
-        "data-disabled:bg-zinc-200 data-disabled:opacity-50 data-disabled:data-checked:bg-zinc-200 data-disabled:data-checked:ring-black/5",
+        "data-disabled:bg-slate-200 data-disabled:opacity-50 data-disabled:data-checked:bg-slate-200 data-disabled:data-checked:ring-black/5",
         "dark:data-disabled:bg-white/15 dark:data-disabled:data-checked:bg-white/15 dark:data-disabled:data-checked:ring-white/15",
         // Color specific styles
         colors2[color]
@@ -13046,7 +13058,7 @@ function Switch2({
             // Invisible border so the switch is still visible in forced-colors mode
             "border border-transparent",
             // Unchecked
-            "bg-white shadow-sm ring-1 ring-black/5",
+            "bg-white/90 backdrop-blur-sm shadow-sm ring-1 ring-black/5",
             // Checked
             "group-data-checked:bg-(--switch) group-data-checked:shadow-(--switch-shadow) group-data-checked:ring-(--switch-ring)",
             "group-data-checked:translate-x-4 sm:group-data-checked:translate-x-3",
@@ -13793,5 +13805,5 @@ function PlatformShell({
 }
 export { ActionMenu, ActionSheet, ActiveFilterChips, AnalysisSkeleton, AnimatedNumber, AnimatedTableRow, AppLogo, AppNavigation, AppShell, ArchiveSwipeAction, AuthLayout, Avatar, AvatarButton, BRAZIL_ACCENT_MAP, BRAZIL_MACRO_REGIONS, BRAZIL_MAP_CENTER, BRAZIL_STATE_COORDINATES, BRAZIL_STATE_PALETTES, BR_THEME_CONFIG, BackupCodeGrid, BadRequestPage, Badge, BaseForm, BentoCard, BooleanFlagsPicker, BottomSafeArea, BrandFilterSkeleton, BrandedLoader, Breadcrumb, Button, Card, CardActionMenu, CardContent, CardDescription, CardDivider, CardFooter, CardGridSkeleton, CardHeader, CardSectionHeader, CardTitle, CategoryBadge, CategoryTab, CategoryTabs, ChipPicker, CircularRefreshIndicator, Code, CollapsibleGroupedList, CompactSegmentedControl, ContactCard, ContactSection, Container, ContextMenu, CookieConsent, CopyableId, CountPill, CreateActionButton, DashboardProgressShell, DataPagination, DatePicker, DeleteSwipeAction, Description4 as Description, DetailsPopover, DevModeBanner, Dialog4 as Dialog, DialogActions, DialogBody, DialogDescription, DialogTitle3 as DialogTitle, Divider, Dock, DockContainer, DockSkeleton, DotRefreshIndicator, Dropdown, DropdownButton, DropdownDivider, DropdownItem, DropdownLabel, DropdownMenu, DropdownSelect, DynamicIsland, DynamicIslandConfirm, DynamicIslandNotification, EdgeSwipeIndicator, EdgeSwipeProvider, EditSwipeAction, EmptyState, EntityCard, EntityDrawer, ErrorMessage, ErrorState, ExpandableHistoryList, ExpandingPageIndicator, FUEL_PRICE_LOADER, FavoriteSwipeAction, FeatureCard, FeedItemCard, Field2 as Field, FieldGroup, Fieldset2 as Fieldset, FilterBadge, FilterPill, FilterSectionHeader, FilterTileButton, FloatingActionButton, FlyoutMenu, FlyoutNavGrid, FlyoutQuickActions, ForceTouchMenu, Form, FormActions, FormActionsRow, FormCheckbox, FormField, FormGrid, FormInput, FormModal, FormPriceInput, FormSection, FormSelect, FormTextarea, FormToggle, GeoMapCanvas, GeoMapLegend, GlassModal, Gradient, GradientBackground, GrowthIndicator, Heading, HeroPanel, HeroSection, IconButton, InfoPopover, InlineForm, InlineSpinner, Input, InteractiveGeoMap, ItemSummary, KORI_ERP_LOADER, Label2 as Label, LabeledToggle, LanguageSwitcher, LaunchpadGrid, Lead, Legend2 as Legend, LiquidFilterInput, ListCard, ListCardItem, ListItem, LoadingOverlay, ManagementPageLayout, ManagementSurface, MapZoomControls, MetricCard, MonthPicker, MultiColumnPicker, NavigationProgress, NoDataState, NoResultsState, NotFoundPage, NotificationBadge, NotificationBellButton, NotificationProvider, OfficeCard, OfflineState, OptionGrid, OtpInput, PageEmptyState, PageHeader, PageHeading, PageIndicator, PageLoadingState, PageSectionHeader, Pagination, PasswordInput, PasswordStrengthMeter, Pill, PlatformShell, PlusGrid, PlusGridItem, PlusGridRow, PreferenceSection, PriceChangeBadge, ProfileIdentityCard, Progress, ProgressIndicator, PullToRefreshContainer, PullToRefreshIndicator, RadiantHeading, RadiantStatCard, RadiantSubheading, RegionFilterSkeleton, RoleBadge, SafeArea, SafeAreaSpacer, SafeAreaView, SearchBar, SearchFilterToolbar, SearchInput, SectionCard, SectionHeader, SectionHeaderSkeleton, SegmentedControl, Select, SelectableChipPicker, SelectableListPicker, SelectableOptionsGrid, SelectableTableRow, SelectionCard, ServerErrorPage, SettingsDialog, SettingsModal, Sheet, SocialLoginButtons, SortableTableHeader, Spinner, Stat, StatCard, StatCardSkeleton, StatusBadge, StatusToggle, StepFormPage, StepNavigationButtons, StepTimeline, Strong, Subheading, SwipeableRow, Switch2 as Switch, Table, TableBody, TableCell, TableEmptyState, TableHead, TableHeader, TableRow, TableSkeleton, TableSkeletonRow, Tabs, TabsContent, TabsList, TabsTrigger, TagBadge, Text, TextLink, Textarea, ThemeSwitch, ThemeToggle, ThemeToggleCompact, TimePicker, ToggleSwitch, TouchTarget, US_ACCENT_MAP, US_MACRO_REGIONS, US_MAP_CENTER, US_STATE_COORDINATES, US_STATE_PALETTES, US_THEME_CONFIG, UserAvatar, UserMobileInfo, WINDSOCK_LOADER, WIRE_LOADER, WheelPicker, WindsockIcon, buildDockActions, buildFlyoutNavItems, buildLaunchpadItems, buttonPress, buttonPressReduced, buttonTap, cardHover, cardHoverReduced, cardPress, createMotionProps, durations, durationsReduced, easings, fadeOnly, fadeScale, filterByPermission, formatCurrency, formatDate, formatPercentage, getBrazilAccent, getBrazilColors, getBrazilFlagUrl, getBrazilGradient, getBrazilHexColor, getBrazilPalette, getStatusColor, getSubdivisionAccent, getSubdivisionColors, getSubdivisionFlagUrl, getSubdivisionGradient, getSubdivisionHexColor, getSubdivisionPalette, getTransition, getUsAccent, getUsColors, getUsFlagUrl, getUsGradient, getUsHexColor, getUsPalette, getVariants, iosColors, isValidBrazilState, isValidSubdivision, isValidUsState, listItem, listItemReduced, notificationBanner, notificationBannerReduced, pageControlDot, prefersReducedMotion, registerSubdivisionTheme, resolveGlassAccentRgb, selectIsAuthenticated, selectShowShellChrome, selectUserInitial, selectUserName, shimmerClass, shimmerWhiteClass, slideDown, slideRight, slideUp, springPresets, springPresetsReduced, staggerContainer, swipeActionThreshold, swipeConstraints, useGeoMapState, useNotifications, usePlatformShellStore, usePullToRefresh };
-//# sourceMappingURL=chunk-7ZO5L4QH.mjs.map
-//# sourceMappingURL=chunk-7ZO5L4QH.mjs.map
+//# sourceMappingURL=chunk-2GNFQ5OX.mjs.map
+//# sourceMappingURL=chunk-2GNFQ5OX.mjs.map