@beyondcorp/beyond-ui-native 0.1.3 → 0.1.5

package/dist/index.js

@@ -1811,7 +1811,7 @@ var AccordionItem = React19.forwardRef(
       import_react_native22.View,
       {
         ref,
-        className: cn("border-b border-border py-1", className),
+        className: cn("border-b border-neutral-200 dark:border-neutral-800 py-1", className),
         ...props,
         children
       }
@@ -1848,8 +1848,8 @@ var AccordionTrigger = React19.forwardRef(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { className: "flex-1 pr-2", children: typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-base font-medium text-foreground", children }) : children }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.Animated.View, { style: { transform: [{ rotate }] }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-muted text-base font-semibold", children: "\u25BC" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { className: "flex-1 pr-2", children: typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-base font-medium text-neutral-900 dark:text-neutral-100", children }) : children }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.Animated.View, { style: { transform: [{ rotate }] }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-base font-semibold", children: "\u25BC" }) })
         ]
       }
     );
@@ -1864,9 +1864,9 @@ var AccordionContent = React19.forwardRef(
       import_react_native22.View,
       {
         ref,
-        className: cn("pt-1 pb-3 px-1 text-sm text-muted", className),
+        className: cn("pt-1 pb-3 px-1", className),
         ...props,
-        children: typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-sm text-muted leading-relaxed", children }) : children
+        children: typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text2, { className: "text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed", children }) : children
       }
     );
   }
@@ -2006,12 +2006,12 @@ var BottomSheetContent = React20.forwardRef(
               ref,
               style: { transform: [{ translateY }] },
               className: cn(
-                "w-full bg-card rounded-t-3xl border-t border-border shadow-2xl pt-2 pb-8 px-6 max-h-[85%]",
+                "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 shadow-2xl pt-2 pb-8 px-6 max-h-[85%]",
                 className
               ),
               ...props,
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { ...panResponder.panHandlers, className: "w-full py-2 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { className: "w-12 h-1.5 rounded-full bg-muted/40" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { ...panResponder.panHandlers, className: "w-full py-2 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { className: "w-12 h-1.5 rounded-full bg-neutral-300 dark:bg-neutral-700" }) }),
                 children
               ]
             }
@@ -2030,14 +2030,14 @@ var BottomSheetTitle = ({
   className,
   children
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Heading, { level: 4, className: cn("text-xl font-bold text-foreground", className), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Heading, { level: 4, className: cn("text-xl font-bold text-neutral-900 dark:text-neutral-50", className), children });
 };
 BottomSheetTitle.displayName = "BottomSheetTitle";
 var BottomSheetDescription = ({
   className,
   children
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text2, { className: cn("text-sm text-muted", className), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text2, { className: cn("text-sm text-neutral-500 dark:text-neutral-400", className), children });
 };
 BottomSheetDescription.displayName = "BottomSheetDescription";
 var BottomSheetBody = React20.forwardRef(
@@ -2080,11 +2080,11 @@ var import_react_native24 = require("react-native");
 var import_class_variance_authority10 = require("class-variance-authority");
 var import_jsx_runtime24 = require("react/jsx-runtime");
 var selectTriggerVariants = (0, import_class_variance_authority10.cva)(
-  "flex-row items-center justify-between rounded-xl border bg-card px-4 py-3 active:opacity-80",
+  "flex-row items-center justify-between rounded-xl border bg-white dark:bg-neutral-900 px-4 py-3 active:opacity-80",
   {
     variants: {
       variant: {
-        default: "border-border",
+        default: "border-neutral-300 dark:border-neutral-700",
         error: "border-danger",
         success: "border-success"
       },
@@ -2160,7 +2160,7 @@ var Select = ({
         onSelect: handleSelect
       },
       children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: cn("w-full gap-1.5", className), children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-sm font-medium text-foreground", children: label }),
+        label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-sm font-medium text-neutral-800 dark:text-neutral-200", children: label }),
         children ? children : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           import_react_native24.Pressable,
           {
@@ -2178,16 +2178,16 @@ var Select = ({
                 {
                   className: cn(
                     "text-base",
-                    displayLabel ? "text-foreground font-medium" : "text-muted"
+                    displayLabel ? "text-neutral-900 dark:text-neutral-100 font-medium" : "text-neutral-500 dark:text-neutral-400 font-normal"
                   ),
                   children: displayLabel || placeholder
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-xs", children: "\u25BC" })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-xs", children: "\u25BC" })
             ]
           }
         ),
-        error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-danger font-medium", children: error }) : helperText ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-muted", children: helperText }) : null,
+        error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-danger font-medium", children: error }) : helperText ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: helperText }) : null,
         options && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           import_react_native24.Modal,
           {
@@ -2198,10 +2198,10 @@ var Select = ({
             statusBarTranslucent: true,
             children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-1 justify-end bg-black/60", children: [
               /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { className: "flex-1", onPress: () => setOpen(false) }),
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-card rounded-t-3xl border-t border-border p-6 max-h-[75%]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-4 border-b border-border mb-3", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-foreground", children: label || placeholder }),
-                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-lg font-semibold", children: "\u2715" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 p-6 max-h-[75%]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-4 border-b border-neutral-200 dark:border-neutral-800 mb-3", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-neutral-900 dark:text-neutral-50", children: label || placeholder }),
+                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-lg font-semibold", children: "\u2715" }) })
                 ] }),
                 searchable && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                   import_react_native24.TextInput,
@@ -2210,10 +2210,10 @@ var Select = ({
                     onChangeText: setSearchQuery,
                     placeholder: "Search options...",
                     placeholderTextColor: "#9ca3af",
-                    className: "h-11 px-4 rounded-xl border border-border bg-background text-foreground text-base"
+                    className: "h-11 px-4 rounded-xl border border-neutral-300 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800 text-neutral-900 dark:text-neutral-100 text-base"
                   }
                 ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", showsVerticalScrollIndicator: false, children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "py-8 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-sm", children: "No options found" }) }) : filteredOptions.map((opt) => {
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", showsVerticalScrollIndicator: false, children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "py-8 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-sm", children: "No options found" }) }) : filteredOptions.map((opt) => {
                   const isSelected = opt.value === currentValue;
                   return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                     import_react_native24.Pressable,
@@ -2221,8 +2221,8 @@ var Select = ({
                       disabled: opt.disabled,
                       onPress: () => handleSelect(opt.value),
                       className: cn(
-                        "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-muted/10",
-                        isSelected && "bg-primary/10",
+                        "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-neutral-100 dark:active:bg-neutral-800",
+                        isSelected && "bg-primary-50 dark:bg-primary-950/40",
                         opt.disabled && "opacity-40"
                       ),
                       children: [
@@ -2231,12 +2231,12 @@ var Select = ({
                           {
                             className: cn(
                               "text-base",
-                              isSelected ? "text-primary font-semibold" : "text-foreground font-normal"
+                              isSelected ? "text-primary-600 dark:text-primary-400 font-semibold" : "text-neutral-900 dark:text-neutral-100 font-normal"
                             ),
                             children: opt.label
                           }
                         ),
-                        isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary font-bold text-base", children: "\u2713" })
+                        isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary-600 dark:text-primary-400 font-bold text-base", children: "\u2713" })
                       ]
                     },
                     opt.value
@@ -2264,13 +2264,13 @@ var SelectTrigger = ({
       accessibilityRole: "combobox",
       accessibilityState: { expanded: open },
       className: cn(
-        "flex-row items-center justify-between rounded-xl border border-border bg-card px-4 py-3 active:opacity-80",
+        "flex-row items-center justify-between rounded-xl border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-900 px-4 py-3 active:opacity-80",
         className
       ),
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-xs", children: "\u25BC" })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-xs", children: "\u25BC" })
       ]
     }
   );
@@ -2286,7 +2286,7 @@ var SelectValue = ({
     {
       className: cn(
         "text-base",
-        value ? "text-foreground font-medium" : "text-muted",
+        value ? "text-neutral-900 dark:text-neutral-100 font-medium" : "text-neutral-500 dark:text-neutral-400",
         className
       ),
       children: value || placeholder
@@ -2307,10 +2307,10 @@ var SelectContent = ({ title, children }) => {
       statusBarTranslucent: true,
       children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-1 justify-end bg-black/60", children: [
         /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { className: "flex-1", onPress: () => setOpen(false) }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-card rounded-t-3xl border-t border-border p-6 max-h-[75%]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-3 border-b border-border mb-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-foreground", children: title || "Select" }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-lg font-semibold", children: "\u2715" }) })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 p-6 max-h-[75%]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-3 border-b border-neutral-200 dark:border-neutral-800 mb-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-neutral-900 dark:text-neutral-100", children: title || "Select" }),
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-lg font-semibold", children: "\u2715" }) })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", children })
         ] })
@@ -2331,8 +2331,8 @@ var SelectItem = ({
     {
       onPress: () => onSelect(itemValue),
       className: cn(
-        "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-muted/10",
-        isSelected && "bg-primary/10",
+        "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-neutral-100 dark:active:bg-neutral-800",
+        isSelected && "bg-primary-50 dark:bg-primary-950/40",
         className
       ),
       children: [
@@ -2341,12 +2341,12 @@ var SelectItem = ({
           {
             className: cn(
               "text-base",
-              isSelected ? "text-primary font-semibold" : "text-foreground font-normal"
+              isSelected ? "text-primary-600 dark:text-primary-400 font-semibold" : "text-neutral-900 dark:text-neutral-100 font-normal"
             ),
             children
           }
         ) : children,
-        isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary font-bold text-base", children: "\u2713" })
+        isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary-600 dark:text-primary-400 font-bold text-base", children: "\u2713" })
       ]
     }
   );
@@ -2431,11 +2431,10 @@ function DataTable({
         onChangeText: (val) => {
           setSearch(val);
           setCurrentPage(1);
-        },
-        className: "bg-card"
+        }
       }
     ),
-    loading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: [1, 2, 3].map((idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Skeleton, { className: "h-20 w-full rounded-2xl" }, idx)) }) : paginatedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Card, { className: "items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-muted text-base", children: emptyText }) }) : mode === "card" ? (
+    loading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: [1, 2, 3].map((idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Skeleton, { className: "h-20 w-full rounded-2xl" }, idx)) }) : paginatedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Card, { className: "items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-base", children: emptyText }) }) : mode === "card" ? (
       /* Mobile Card Mode */
       /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: paginatedData.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         import_react_native25.Pressable,
@@ -2449,10 +2448,10 @@ function DataTable({
             return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
               import_react_native25.View,
               {
-                className: "flex-row items-center justify-between py-1 border-b border-border/40 last:border-b-0",
+                className: "flex-row items-center justify-between py-1 border-b border-neutral-200 dark:border-neutral-800 last:border-b-0",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-semibold text-muted uppercase tracking-wider", children: col.title }),
-                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "shrink", children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm font-medium text-foreground", children: renderedVal }) : renderedVal })
+                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: col.title }),
+                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "shrink", children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm font-medium text-neutral-900 dark:text-neutral-100", children: renderedVal }) : renderedVal })
                 ]
               },
               String(col.key)
@@ -2463,8 +2462,8 @@ function DataTable({
       )) })
     ) : (
       /* Horizontal Table Mode */
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "rounded-2xl border border-border bg-card overflow-hidden", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "flex-row bg-muted/10 border-b border-border", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900 overflow-hidden", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "flex-row bg-neutral-100 dark:bg-neutral-800/60 border-b border-neutral-200 dark:border-neutral-800", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
           import_react_native25.Pressable,
           {
             disabled: !col.sortable,
@@ -2472,8 +2471,8 @@ function DataTable({
             style: { width: col.width || 120 },
             className: "px-4 py-3 flex-row items-center justify-between",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-bold text-foreground uppercase tracking-wider", children: col.title }),
-              col.sortable && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs text-muted", children: sortKey === col.key ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-bold text-neutral-900 dark:text-neutral-100 uppercase tracking-wider", children: col.title }),
+              col.sortable && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: sortKey === col.key ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
             ]
           },
           String(col.key)
@@ -2483,7 +2482,7 @@ function DataTable({
           {
             disabled: !onRowPress,
             onPress: () => onRowPress?.(item),
-            className: "flex-row border-b border-border/60 active:bg-muted/10",
+            className: "flex-row border-b border-neutral-200 dark:border-neutral-800 active:bg-neutral-100 dark:active:bg-neutral-800",
             children: columns.map((col) => {
               const rawVal = item[col.key];
               const renderedVal = col.render ? col.render(rawVal, item) : String(rawVal ?? "\u2014");
@@ -2492,7 +2491,7 @@ function DataTable({
                 {
                   style: { width: col.width || 120 },
                   className: "px-4 py-3 justify-center",
-                  children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm text-foreground", children: renderedVal }) : renderedVal
+                  children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm text-neutral-900 dark:text-neutral-100", children: renderedVal }) : renderedVal
                 },
                 String(col.key)
               );
@@ -2503,7 +2502,7 @@ function DataTable({
       ] }) })
     ),
     totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "flex-row items-center justify-between pt-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs text-muted", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: [
         "Showing ",
         (currentPage - 1) * pageSize + 1,
         " -",
@@ -2524,7 +2523,7 @@ function DataTable({
             children: "Prev"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs font-medium text-foreground px-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs font-medium text-neutral-900 dark:text-neutral-100 px-1", children: [
           currentPage,
           " / ",
           totalPages
@@ -2588,7 +2587,7 @@ var SignInTemplate = ({
     {
       behavior: import_react_native26.Platform.OS === "ios" ? "padding" : "height",
       style: { flex: 1 },
-      className: cn("flex-1 bg-background", className),
+      className: cn("flex-1 bg-neutral-50 dark:bg-neutral-950", className),
       children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         import_react_native26.ScrollView,
         {
@@ -2600,8 +2599,8 @@ var SignInTemplate = ({
           children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "w-full max-w-md mx-auto gap-6", children: [
             /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "items-center gap-2", children: [
               logo && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.View, { className: "mb-2", children: logo }),
-              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-foreground text-center", children: title }),
-              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-muted text-center text-base", children: subtitle })
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-neutral-900 dark:text-neutral-50 text-center", children: title }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-center text-base", children: subtitle })
             ] }),
             error && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Alert, { variant: "danger", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(AlertDescription, { children: error }) }),
             /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "gap-4", children: [
@@ -2633,15 +2632,15 @@ var SignInTemplate = ({
                     if (passwordError) setPasswordError(void 0);
                   },
                   error: passwordError,
-                  rightElement: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: () => setShowPassword((p) => !p), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-xs text-muted font-semibold", children: showPassword ? "HIDE" : "SHOW" }) })
+                  rightElement: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: () => setShowPassword((p) => !p), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400 font-semibold", children: showPassword ? "HIDE" : "SHOW" }) })
                 }
               ) }),
               /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "flex-row items-center justify-between py-1", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "flex-row items-center gap-2", children: [
                   /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Checkbox, { checked: rememberMe, onCheckedChange: setRememberMe }),
-                  /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm text-foreground", children: "Remember me" })
+                  /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm text-neutral-900 dark:text-neutral-100", children: "Remember me" })
                 ] }),
-                onForgotPassword && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: onForgotPassword, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm font-semibold text-primary", children: "Forgot password?" }) })
+                onForgotPassword && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: onForgotPassword, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm font-semibold text-primary-600 dark:text-primary-400", children: "Forgot password?" }) })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
                 Button,
@@ -2658,7 +2657,7 @@ var SignInTemplate = ({
             (onGooglePress || onApplePress) && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "gap-4", children: [
               /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "flex-row items-center gap-3", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Separator, { className: "flex-1" }),
-                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-xs text-muted uppercase", children: "or continue with" }),
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400 uppercase", children: "or continue with" }),
                 /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Separator, { className: "flex-1" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "flex-row gap-3", children: [
@@ -2683,8 +2682,8 @@ var SignInTemplate = ({
               ] })
             ] }),
             onSignUpPress && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native26.View, { className: "flex-row justify-center items-center gap-1.5 pt-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm text-muted", children: "Don't have an account?" }),
-              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: onSignUpPress, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm font-bold text-primary", children: "Sign Up" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm text-neutral-500 dark:text-neutral-400", children: "Don't have an account?" }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native26.Pressable, { onPress: onSignUpPress, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text2, { className: "text-sm font-bold text-primary-600 dark:text-primary-400", children: "Sign Up" }) })
             ] })
           ] })
         }
@@ -2748,7 +2747,7 @@ var SignUpTemplate = ({
     {
       behavior: import_react_native27.Platform.OS === "ios" ? "padding" : "height",
       style: { flex: 1 },
-      className: cn("flex-1 bg-background", className),
+      className: cn("flex-1 bg-neutral-50 dark:bg-neutral-950", className),
       children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         import_react_native27.ScrollView,
         {
@@ -2760,8 +2759,8 @@ var SignUpTemplate = ({
           children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "w-full max-w-md mx-auto gap-6", children: [
             /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "items-center gap-2", children: [
               logo && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.View, { className: "mb-2", children: logo }),
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-foreground text-center", children: title }),
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-muted text-center text-base", children: subtitle })
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-neutral-900 dark:text-neutral-50 text-center", children: title }),
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-center text-base", children: subtitle })
             ] }),
             error && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Alert, { variant: "danger", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(AlertDescription, { children: error }) }),
             /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "gap-4", children: [
@@ -2819,7 +2818,7 @@ var SignUpTemplate = ({
                       }
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm text-foreground flex-1", children: "I agree to the Terms of Service & Privacy Policy" })
+                  /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm text-neutral-900 dark:text-neutral-100 flex-1", children: "I agree to the Terms of Service & Privacy Policy" })
                 ] }),
                 termsError && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-xs text-danger font-medium", children: termsError })
               ] }),
@@ -2838,7 +2837,7 @@ var SignUpTemplate = ({
             (onGooglePress || onApplePress) && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "gap-4", children: [
               /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "flex-row items-center gap-3", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Separator, { className: "flex-1" }),
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-xs text-muted uppercase", children: "or continue with" }),
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400 uppercase", children: "or continue with" }),
                 /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Separator, { className: "flex-1" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "flex-row gap-3", children: [
@@ -2863,8 +2862,8 @@ var SignUpTemplate = ({
               ] })
             ] }),
             onSignInPress && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_native27.View, { className: "flex-row justify-center items-center gap-1.5 pt-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm text-muted", children: "Already have an account?" }),
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.Pressable, { onPress: onSignInPress, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm font-bold text-primary", children: "Sign In" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm text-neutral-500 dark:text-neutral-400", children: "Already have an account?" }),
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.Pressable, { onPress: onSignInPress, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text2, { className: "text-sm font-bold text-primary-600 dark:text-primary-400", children: "Sign In" }) })
             ] })
           ] })
         }
@@ -2902,7 +2901,7 @@ var ForgotPasswordTemplate = ({
     {
       behavior: import_react_native28.Platform.OS === "ios" ? "padding" : "height",
       style: { flex: 1 },
-      className: cn("flex-1 bg-background", className),
+      className: cn("flex-1 bg-neutral-50 dark:bg-neutral-950", className),
       children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         import_react_native28.ScrollView,
         {
@@ -2913,8 +2912,8 @@ var ForgotPasswordTemplate = ({
           showsVerticalScrollIndicator: false,
           children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react_native28.View, { className: "w-full max-w-md mx-auto gap-6", children: [
             /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react_native28.View, { className: "items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-foreground text-center", children: title }),
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text2, { className: "text-muted text-center text-base", children: subtitle })
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Heading, { level: 2, className: "text-3xl font-extrabold text-neutral-900 dark:text-neutral-50 text-center", children: title }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-center text-base", children: subtitle })
             ] }),
             error && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Alert, { variant: "danger", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(AlertDescription, { children: error }) }),
             isSuccess ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react_native28.View, { className: "gap-4", children: [
@@ -2947,7 +2946,7 @@ var ForgotPasswordTemplate = ({
                   children: "Send Reset Link"
                 }
               ),
-              onBackToSignIn && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.View, { className: "flex-row justify-center items-center gap-1.5 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.Pressable, { onPress: onBackToSignIn, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text2, { className: "text-sm font-semibold text-primary", children: "Back to Sign In" }) }) })
+              onBackToSignIn && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.View, { className: "flex-row justify-center items-center gap-1.5 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.Pressable, { onPress: onBackToSignIn, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text2, { className: "text-sm font-semibold text-primary-600 dark:text-primary-400", children: "Back to Sign In" }) }) })
             ] })
           ] })
         }
@@ -2977,19 +2976,19 @@ var DashboardTemplate = ({
     {
       ...props,
       style: [{ flex: 1 }, props.style],
-      className: cn("flex-1 bg-background", className),
+      className: cn("flex-1 bg-neutral-50 dark:bg-neutral-950", className),
       contentContainerStyle: { paddingBottom: 40 },
       showsVerticalScrollIndicator: false,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "px-6 pt-6 pb-4 flex-row items-center justify-between border-b border-border/40", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "px-6 pt-6 pb-4 flex-row items-center justify-between border-b border-neutral-200 dark:border-neutral-800", children: [
           /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "flex-row items-center gap-3", children: [
             /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Avatar, { size: "lg", children: [
               userAvatarUrl && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(AvatarImage, { source: { uri: userAvatarUrl } }),
               /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(AvatarFallback, { text: userName.slice(0, 2).toUpperCase() })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs text-muted font-medium uppercase tracking-wider", children: userRole }),
-              /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Heading, { level: 3, className: "text-xl font-bold text-foreground", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400 font-medium uppercase tracking-wider", children: userRole }),
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Heading, { level: 3, className: "text-xl font-bold text-neutral-900 dark:text-neutral-50", children: [
                 "Hello, ",
                 userName,
                 " \u{1F44B}"
@@ -3000,9 +2999,9 @@ var DashboardTemplate = ({
             import_react_native29.Pressable,
             {
               onPress: onNotificationPress,
-              className: "w-10 h-10 rounded-full border border-border bg-card items-center justify-center relative active:opacity-70",
+              className: "w-10 h-10 rounded-full border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900 items-center justify-center relative active:opacity-70",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-base text-foreground", children: "\u{1F514}" }),
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-base text-neutral-900 dark:text-neutral-100", children: "\u{1F514}" }),
                 unreadNotificationsCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.View, { className: "absolute -top-1 -right-1 w-5 h-5 rounded-full bg-danger items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-[10px] font-bold text-white", children: unreadNotificationsCount > 9 ? "9+" : unreadNotificationsCount }) })
               ]
             }
@@ -3010,7 +3009,7 @@ var DashboardTemplate = ({
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "px-6 pt-6 gap-6", children: [
           quickActions && quickActions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider", children: "Quick Actions" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: "Quick Actions" }),
             /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
               import_react_native29.ScrollView,
               {
@@ -3023,7 +3022,6 @@ var DashboardTemplate = ({
                     variant: "outline",
                     size: "sm",
                     onPress: action.onPress,
-                    className: "bg-card shadow-sm",
                     children: action.icon ? `${action.icon} ${action.label}` : action.label
                   },
                   action.id
@@ -3032,18 +3030,18 @@ var DashboardTemplate = ({
             )
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "gap-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider", children: "Overview Performance" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: "Overview Performance" }),
             /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.View, { className: "gap-3", children: metrics.map((metric) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(StatsCard, { ...metric }, metric.id)) })
           ] }),
           recentActivities && recentActivities.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Card, { className: "gap-2", children: [
             /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(CardHeader, { className: "flex-row items-center justify-between pb-2", children: [
               /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CardTitle, { className: "text-base font-bold", children: "Recent Activity" }),
-              onViewAllActivities && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.Pressable, { onPress: onViewAllActivities, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-semibold text-primary", children: "View all" }) })
+              onViewAllActivities && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.Pressable, { onPress: onViewAllActivities, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-semibold text-primary-600 dark:text-primary-400", children: "View all" }) })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CardContent, { className: "gap-3 pt-0", children: recentActivities.map((act) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
               import_react_native29.View,
               {
-                className: "flex-row items-center justify-between py-2 border-b border-border/40 last:border-b-0",
+                className: "flex-row items-center justify-between py-2 border-b border-neutral-200 dark:border-neutral-800 last:border-b-0",
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "flex-row items-center gap-3 flex-1 pr-2", children: [
                     /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Avatar, { size: "sm", children: [
@@ -3056,8 +3054,8 @@ var DashboardTemplate = ({
                       )
                     ] }),
                     /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "flex-1", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-semibold text-foreground", numberOfLines: 1, children: act.title }),
-                      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Text2, { className: "text-xs text-muted", numberOfLines: 1, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", numberOfLines: 1, children: act.title }),
+                      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", numberOfLines: 1, children: [
                         act.subtitle,
                         " \u2022 ",
                         act.timestamp
@@ -3065,7 +3063,7 @@ var DashboardTemplate = ({
                     ] })
                   ] }),
                   /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "items-end gap-1", children: [
-                    act.amount && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-bold text-foreground", children: act.amount }),
+                    act.amount && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-bold text-neutral-900 dark:text-neutral-100", children: act.amount }),
                     act.status && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Badge, { variant: act.status.variant, size: "sm", children: act.status.label })
                   ] })
                 ]
@@ -3106,11 +3104,11 @@ var SettingsTemplate = ({
     {
       ...props,
       style: [{ flex: 1 }, props.style],
-      className: cn("flex-1 bg-background", className),
+      className: cn("flex-1 bg-neutral-50 dark:bg-neutral-950", className),
       contentContainerStyle: { paddingBottom: 40 },
       showsVerticalScrollIndicator: false,
       children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "px-6 pt-6 gap-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Heading, { level: 2, className: "text-2xl font-bold text-foreground", children: "Settings & Profile" }),
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Heading, { level: 2, className: "text-2xl font-bold text-neutral-900 dark:text-neutral-50", children: "Settings & Profile" }),
         /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { className: "p-4 flex-row items-center gap-4", children: [
           /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Avatar, { size: "lg", children: [
             user.avatarUrl && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AvatarImage, { source: { uri: user.avatarUrl } }),
@@ -3118,20 +3116,20 @@ var SettingsTemplate = ({
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "flex-1", children: [
             /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "flex-row items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-base font-bold text-foreground", children: user.name }),
+              /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-base font-bold text-neutral-900 dark:text-neutral-100", children: user.name }),
               user.plan && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Badge, { variant: "primary", size: "sm", children: user.plan })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-muted", children: user.email })
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: user.email })
           ] }),
           onEditProfile && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Button, { variant: "outline", size: "sm", onPress: onEditProfile, children: "Edit" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider px-1", children: "Preferences" }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { className: "divide-y divide-border/50", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider px-1", children: "Preferences" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { className: "divide-y divide-neutral-200 dark:divide-neutral-800", children: [
             /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "p-4 flex-row items-center justify-between", children: [
               /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "pr-4 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Push Notifications" }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-muted", children: "Receive real-time alerts on your mobile device" })
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Push Notifications" }),
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "Receive real-time alerts on your mobile device" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
                 Switch,
@@ -3143,8 +3141,8 @@ var SettingsTemplate = ({
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "p-4 flex-row items-center justify-between", children: [
               /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "pr-4 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Email Notifications" }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-muted", children: "Weekly digests and activity summaries" })
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Email Notifications" }),
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "Weekly digests and activity summaries" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
                 Switch,
@@ -3156,15 +3154,15 @@ var SettingsTemplate = ({
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "p-4 flex-row items-center justify-between", children: [
               /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "pr-4 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Dark Theme" }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-muted", children: "Enable high contrast dark mode appearance" })
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Dark Theme" }),
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "Enable high contrast dark mode appearance" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Switch, { checked: isDarkMode, onCheckedChange: onToggleDarkMode })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "p-4 flex-row items-center justify-between", children: [
               /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "pr-4 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Biometric Login" }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-muted", children: "Use Face ID or fingerprint to authenticate" })
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Biometric Login" }),
+                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "Use Face ID or fingerprint to authenticate" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
                 Switch,
@@ -3177,16 +3175,16 @@ var SettingsTemplate = ({
           ] })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_native30.View, { className: "gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider px-1", children: "Account & Security" }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { className: "divide-y divide-border/50", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider px-1", children: "Account & Security" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { className: "divide-y divide-neutral-200 dark:divide-neutral-800", children: [
             onChangePassword && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
               import_react_native30.Pressable,
               {
                 onPress: onChangePassword,
-                className: "p-4 flex-row items-center justify-between active:bg-muted/10",
+                className: "p-4 flex-row items-center justify-between active:bg-neutral-100 dark:active:bg-neutral-800",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Change Password" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-muted text-xs", children: "\u203A" })
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Change Password" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-neutral-400 dark:text-neutral-500 text-xs", children: "\u203A" })
                 ]
               }
             ),
@@ -3194,10 +3192,10 @@ var SettingsTemplate = ({
               import_react_native30.Pressable,
               {
                 onPress: onViewTerms,
-                className: "p-4 flex-row items-center justify-between active:bg-muted/10",
+                className: "p-4 flex-row items-center justify-between active:bg-neutral-100 dark:active:bg-neutral-800",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Terms of Service" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-muted text-xs", children: "\u203A" })
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Terms of Service" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-neutral-400 dark:text-neutral-500 text-xs", children: "\u203A" })
                 ]
               }
             ),
@@ -3205,10 +3203,10 @@ var SettingsTemplate = ({
               import_react_native30.Pressable,
               {
                 onPress: onViewPrivacy,
-                className: "p-4 flex-row items-center justify-between active:bg-muted/10",
+                className: "p-4 flex-row items-center justify-between active:bg-neutral-100 dark:active:bg-neutral-800",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-foreground", children: "Privacy Policy" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-muted text-xs", children: "\u203A" })
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", children: "Privacy Policy" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text2, { className: "text-neutral-400 dark:text-neutral-500 text-xs", children: "\u203A" })
                 ]
               }
             )
@@ -3234,6 +3232,7 @@ var SettingsTemplate = ({
 // src/providers/BeyondUIProvider.tsx
 var React26 = __toESM(require("react"));
 var import_react_native31 = require("react-native");
+var import_nativewind = require("nativewind");
 var import_portal = require("@rn-primitives/portal");
 var import_jsx_runtime31 = require("react/jsx-runtime");
 var BeyondUIContext = React26.createContext({
@@ -3254,10 +3253,28 @@ function BeyondUIProvider({
   const [selectedScheme, setSelectedScheme] = React26.useState(defaultColorScheme);
   const [toasts, setToasts] = React26.useState([]);
   const activeScheme = selectedScheme === "system" ? systemScheme : selectedScheme;
+  React26.useEffect(() => {
+    try {
+      import_nativewind.colorScheme.set(selectedScheme === "system" ? "system" : activeScheme);
+    } catch (_) {
+    }
+  }, [selectedScheme, activeScheme]);
+  const handleSetColorScheme = React26.useCallback((scheme) => {
+    setSelectedScheme(scheme);
+    try {
+      import_nativewind.colorScheme.set(scheme === "system" ? "system" : scheme);
+    } catch (_) {
+    }
+  }, []);
   const toggleColorScheme = React26.useCallback(() => {
     setSelectedScheme((prev) => {
       const current = prev === "system" ? systemScheme : prev;
-      return current === "dark" ? "light" : "dark";
+      const next = current === "dark" ? "light" : "dark";
+      try {
+        import_nativewind.colorScheme.set(next);
+      } catch (_) {
+      }
+      return next;
     });
   }, [systemScheme]);
   const dismissToast = React26.useCallback((id) => {
@@ -3284,16 +3301,16 @@ function BeyondUIProvider({
   const contextValue = React26.useMemo(
     () => ({
       colorScheme: activeScheme,
-      setColorScheme: setSelectedScheme,
+      setColorScheme: handleSetColorScheme,
       toggleColorScheme
     }),
-    [activeScheme, toggleColorScheme]
+    [activeScheme, handleSetColorScheme, toggleColorScheme]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(BeyondUIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ToastContext.Provider, { value: toastContextValue, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
     import_react_native31.View,
     {
       style: { flex: 1 },
-      className: activeScheme === "dark" ? "dark flex-1" : "flex-1",
+      className: activeScheme === "dark" ? "dark flex-1 bg-neutral-950" : "flex-1 bg-white",
       children: [
         children,
         /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_portal.PortalHost, {}),