@burdenoff/microfe-billing 2026.614.1 → 2026.623.2

package/dist/billing/modules/credits/pages/CreditWithdrawalPage.js

@@ -34,14 +34,14 @@ async function se(e, t) {
 	})).myPayoutRequests.items;
 }
 var m = ({ label: e, value: t, description: n, highlight: r }) => /* @__PURE__ */ p("div", {
-	className: `border border-border rounded-lg p-5 ${r ? "bg-gradient-to-br from-primary/5 to-primary/10" : "bg-card"}`,
+	className: `border border-border-subtle rounded-lg p-5 ${r ? "bg-gradient-to-br from-[var(--color-accent-soft)] to-[var(--color-accent-soft)]" : "bg-bg-surface"}`,
 	children: [
 		/* @__PURE__ */ f("p", {
-			className: "text-sm text-muted-foreground",
+			className: "text-sm text-text-secondary",
 			children: e
 		}),
 		/* @__PURE__ */ p("p", {
-			className: `text-2xl font-bold mt-1 ${r ? "text-primary" : "text-foreground"}`,
+			className: `text-2xl font-bold mt-1 ${r ? "text-text-link" : "text-text-primary"}`,
 			children: [
 				t.toLocaleString(),
 				" ",
@@ -52,7 +52,7 @@ var m = ({ label: e, value: t, description: n, highlight: r }) => /* @__PURE__ *
 			]
 		}),
 		n && /* @__PURE__ */ f("p", {
-			className: "text-xs text-muted-foreground mt-1",
+			className: "text-xs text-text-secondary mt-1",
 			children: n
 		})
 	]
@@ -66,7 +66,7 @@ function ce(e) {
 		case "REJECTED":
 		case "FAILED":
 		case "CANCELED": return t.error.text;
-		default: return "text-muted-foreground";
+		default: return "text-text-secondary";
 	}
 }
 function le(e) {
@@ -78,7 +78,7 @@ function le(e) {
 		case "REJECTED":
 		case "FAILED":
 		case "CANCELED": return `${t.error.bg} ${t.error.text}`;
-		default: return "bg-muted text-muted-foreground";
+		default: return "bg-bg-sunken text-text-secondary";
 	}
 }
 var h = () => {
@@ -211,9 +211,9 @@ var h = () => {
 			className: "text-center space-y-2",
 			children: [
 				/* @__PURE__ */ f("div", {
-					className: "size-12 mx-auto rounded-full bg-muted flex items-center justify-center",
+					className: "size-12 mx-auto rounded-full bg-bg-sunken flex items-center justify-center",
 					children: /* @__PURE__ */ f("svg", {
-						className: "size-6 text-muted-foreground",
+						className: "size-6 text-text-secondary",
 						fill: "none",
 						viewBox: "0 0 24 24",
 						stroke: "currentColor",
@@ -226,11 +226,11 @@ var h = () => {
 					})
 				}),
 				/* @__PURE__ */ f("h2", {
-					className: "text-lg font-semibold text-foreground",
+					className: "text-lg font-semibold text-text-primary",
 					children: "Access Denied"
 				}),
 				/* @__PURE__ */ f("p", {
-					className: "text-sm text-muted-foreground",
+					className: "text-sm text-text-secondary",
 					children: "You don't have permission to withdraw credits."
 				})
 			]
@@ -241,17 +241,17 @@ var h = () => {
 		children: /* @__PURE__ */ p("div", {
 			className: "text-center space-y-2",
 			children: [/* @__PURE__ */ f("h2", {
-				className: "text-lg font-semibold text-foreground",
+				className: "text-lg font-semibold text-text-primary",
 				children: "No Billing Account"
 			}), /* @__PURE__ */ f("p", {
-				className: "text-sm text-muted-foreground",
+				className: "text-sm text-text-secondary",
 				children: "You need a billing account to withdraw credits."
 			})]
 		})
 	});
 	if (o && !a) return /* @__PURE__ */ p("div", {
-		className: "space-y-6 p-6",
-		children: [/* @__PURE__ */ f("div", { className: "h-8 w-64 bg-muted animate-pulse rounded" }), /* @__PURE__ */ f("div", {
+		className: "space-y-6 px-6 lg:px-8 py-6",
+		children: [/* @__PURE__ */ f("div", { className: "h-8 w-64 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ f("div", {
 			className: "grid grid-cols-2 lg:grid-cols-4 gap-4",
 			children: [
 				1,
@@ -259,20 +259,20 @@ var h = () => {
 				3,
 				4
 			].map((e) => /* @__PURE__ */ p("div", {
-				className: "border border-border rounded-lg p-5",
-				children: [/* @__PURE__ */ f("div", { className: "h-4 w-24 bg-muted animate-pulse rounded mb-2" }), /* @__PURE__ */ f("div", { className: "h-8 w-32 bg-muted animate-pulse rounded" })]
+				className: "border border-border-subtle rounded-lg p-5",
+				children: [/* @__PURE__ */ f("div", { className: "h-4 w-24 bg-bg-sunken animate-pulse rounded mb-2" }), /* @__PURE__ */ f("div", { className: "h-8 w-32 bg-bg-sunken animate-pulse rounded" })]
 			}, e))
 		})]
 	});
 	let Q = _?.withdrawable ?? 0, Se = Y > 0 && Y <= Q, $ = pe.filter((e) => e.status !== "ARCHIVED");
 	return /* @__PURE__ */ p("div", {
-		className: "space-y-6 p-6",
+		className: "space-y-6 px-6 lg:px-8 py-6",
 		children: [
 			/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h1", {
-				className: "text-2xl font-bold text-foreground",
+				className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
 				children: "Withdraw Credits"
 			}), /* @__PURE__ */ f("p", {
-				className: "text-sm text-muted-foreground mt-1",
+				className: "text-sm text-text-secondary mt-1",
 				children: "Convert your withdrawable credits (purchased & earned) to a payout"
 			})] }),
 			/* @__PURE__ */ f("div", {
@@ -283,10 +283,10 @@ var h = () => {
 					3,
 					4
 				].map((e) => /* @__PURE__ */ p("div", {
-					className: "border border-border rounded-lg p-5",
-					children: [/* @__PURE__ */ f("div", { className: "h-4 w-20 bg-muted animate-pulse rounded mb-2" }), /* @__PURE__ */ f("div", { className: "h-8 w-28 bg-muted animate-pulse rounded" })]
+					className: "border border-border-subtle rounded-lg p-5",
+					children: [/* @__PURE__ */ f("div", { className: "h-4 w-20 bg-bg-sunken animate-pulse rounded mb-2" }), /* @__PURE__ */ f("div", { className: "h-8 w-28 bg-bg-sunken animate-pulse rounded" })]
 				}, e)) : y ? /* @__PURE__ */ f("div", {
-					className: "col-span-4 text-sm text-destructive",
+					className: "col-span-4 text-sm text-status-error-text",
 					children: y
 				}) : /* @__PURE__ */ p(d, { children: [
 					/* @__PURE__ */ f(m, {
@@ -361,24 +361,24 @@ var h = () => {
 						/* @__PURE__ */ p("div", {
 							className: "flex items-center justify-between",
 							children: [/* @__PURE__ */ f("h2", {
-								className: "text-base font-semibold text-foreground",
+								className: "text-base font-semibold text-text-primary",
 								children: "Payout Account"
 							}), /* @__PURE__ */ f("button", {
 								type: "button",
 								onClick: () => I((e) => !e),
-								className: "text-sm text-primary hover:underline",
+								className: "text-sm text-text-link hover:underline",
 								children: F ? "Cancel" : "+ Add new"
 							})]
 						}),
 						F && /* @__PURE__ */ p("div", {
-							className: "border border-border rounded-lg p-4 space-y-3 bg-muted/30",
+							className: "border border-border-subtle rounded-lg p-4 space-y-3 bg-bg-sunken",
 							children: [
 								/* @__PURE__ */ f("h3", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: "New Payout Account"
 								}),
 								/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "Label"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -388,10 +388,10 @@ var h = () => {
 										label: e.target.value
 									})),
 									placeholder: "e.g. My Bank Account",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] }),
 								/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "Account Holder Name"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -401,12 +401,12 @@ var h = () => {
 										accountHolderName: e.target.value
 									})),
 									placeholder: "Full name as on bank account",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] }),
 								/* @__PURE__ */ p("div", {
 									className: "grid grid-cols-2 gap-3",
 									children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-										className: "block text-xs text-muted-foreground mb-1",
+										className: "block text-xs text-text-secondary mb-1",
 										children: "Type"
 									}), /* @__PURE__ */ p("select", {
 										value: L.type,
@@ -414,7 +414,7 @@ var h = () => {
 											...t,
 											type: e.target.value
 										})),
-										className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30",
+										className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
 										children: [/* @__PURE__ */ f("option", {
 											value: "BANK_ACCOUNT",
 											children: "Bank Account"
@@ -423,7 +423,7 @@ var h = () => {
 											children: "UPI"
 										})]
 									})] }), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-										className: "block text-xs text-muted-foreground mb-1",
+										className: "block text-xs text-text-secondary mb-1",
 										children: "Country"
 									}), /* @__PURE__ */ f("input", {
 										type: "text",
@@ -433,11 +433,11 @@ var h = () => {
 											country: e.target.value
 										})),
 										placeholder: "e.g. India, US, UK",
-										className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+										className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 									})] })]
 								}),
 								L.type === "BANK_ACCOUNT" && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "Account Number"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -447,9 +447,9 @@ var h = () => {
 										accountNumber: e.target.value
 									})),
 									placeholder: "Account number",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] }), L.country.trim().toUpperCase() === "IN" || L.country.trim().toLowerCase() === "india" ? /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "IFSC Code"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -459,9 +459,9 @@ var h = () => {
 										ifscCode: e.target.value.toUpperCase()
 									})),
 									placeholder: "e.g. SBIN0001234",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] }) : /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "Routing Number"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -471,10 +471,10 @@ var h = () => {
 										routingNumber: e.target.value
 									})),
 									placeholder: "Routing / sort code",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] })] }),
 								L.type === "UPI" && /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
-									className: "block text-xs text-muted-foreground mb-1",
+									className: "block text-xs text-text-secondary mb-1",
 									children: "UPI ID"
 								}), /* @__PURE__ */ f("input", {
 									type: "text",
@@ -484,29 +484,29 @@ var h = () => {
 										upiId: e.target.value
 									})),
 									placeholder: "yourname@upi",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})] }),
 								V && /* @__PURE__ */ f("p", {
-									className: "text-xs text-destructive",
+									className: "text-xs text-status-error-text",
 									children: V
 								}),
 								/* @__PURE__ */ f("button", {
 									type: "button",
 									onClick: () => void ye(),
 									disabled: z || !L.label || !L.accountHolderName,
-									className: "w-full py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
+									className: "w-full py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
 									children: z ? "Saving…" : "Save Account"
 								})
 							]
 						}),
 						he ? /* @__PURE__ */ f("div", {
 							className: "space-y-2",
-							children: [1, 2].map((e) => /* @__PURE__ */ f("div", { className: "h-16 border border-border rounded-lg bg-muted animate-pulse" }, e))
+							children: [1, 2].map((e) => /* @__PURE__ */ f("div", { className: "h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse" }, e))
 						}) : $.length === 0 && !F ? /* @__PURE__ */ p("div", {
-							className: "flex flex-col items-center justify-center py-8 border border-dashed border-border rounded-lg",
+							className: "flex flex-col items-center justify-center py-8 border border-dashed border-border-subtle rounded-lg",
 							children: [
 								/* @__PURE__ */ f("svg", {
-									className: "size-8 text-muted-foreground mb-2",
+									className: "size-8 text-text-secondary mb-2",
 									fill: "none",
 									viewBox: "0 0 24 24",
 									stroke: "currentColor",
@@ -518,13 +518,13 @@ var h = () => {
 									})
 								}),
 								/* @__PURE__ */ f("p", {
-									className: "text-sm text-muted-foreground",
+									className: "text-sm text-text-secondary",
 									children: "No payout accounts yet"
 								}),
 								/* @__PURE__ */ f("button", {
 									type: "button",
 									onClick: () => I(!0),
-									className: "mt-2 text-sm text-primary hover:underline",
+									className: "mt-2 text-sm text-text-link hover:underline",
 									children: "Add a bank account or UPI"
 								})
 							]
@@ -533,14 +533,14 @@ var h = () => {
 							children: $.map((e) => /* @__PURE__ */ f("button", {
 								type: "button",
 								onClick: () => T(e.id),
-								className: `w-full text-left p-4 border rounded-lg transition-colors ${w === e.id ? "border-primary bg-primary/5" : "border-border bg-card hover:border-primary/40"}`,
+								className: `w-full text-left p-4 border rounded-lg transition-colors ${w === e.id ? "border-border-strong bg-[var(--color-accent-soft)]" : "border-border-subtle bg-bg-surface hover:border-border-strong"}`,
 								children: /* @__PURE__ */ p("div", {
 									className: "flex items-center justify-between",
 									children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("p", {
-										className: "text-sm font-medium text-foreground",
+										className: "text-sm font-medium text-text-primary",
 										children: e.label
 									}), /* @__PURE__ */ p("p", {
-										className: "text-xs text-muted-foreground mt-0.5",
+										className: "text-xs text-text-secondary mt-0.5",
 										children: [
 											e.type.replaceAll("_", " "),
 											e.displayName ? ` · ${e.displayName}` : "",
@@ -551,7 +551,7 @@ var h = () => {
 										className: "flex items-center gap-2",
 										children: [
 											e.isDefault && /* @__PURE__ */ f("span", {
-												className: "text-xs px-2 py-0.5 rounded bg-primary/10 text-primary font-medium",
+												className: "text-xs px-2 py-0.5 rounded bg-[var(--color-accent-soft)] text-text-link font-medium",
 												children: "Default"
 											}),
 											/* @__PURE__ */ f("span", {
@@ -559,7 +559,7 @@ var h = () => {
 												children: e.status.replaceAll("_", " ").toLowerCase()
 											}),
 											w === e.id && /* @__PURE__ */ f("svg", {
-												className: "size-4 text-primary shrink-0",
+												className: "size-4 text-text-link shrink-0",
 												fill: "none",
 												viewBox: "0 0 24 24",
 												stroke: "currentColor",
@@ -579,14 +579,14 @@ var h = () => {
 				}), /* @__PURE__ */ p("div", {
 					className: "space-y-4",
 					children: [/* @__PURE__ */ f("h2", {
-						className: "text-base font-semibold text-foreground",
+						className: "text-base font-semibold text-text-primary",
 						children: "Request Withdrawal"
 					}), /* @__PURE__ */ p("div", {
-						className: "border border-border rounded-lg p-5 bg-card space-y-4",
+						className: "border border-border-subtle rounded-lg p-5 bg-bg-surface space-y-4",
 						children: [
 							/* @__PURE__ */ p("div", { children: [
 								/* @__PURE__ */ f("label", {
-									className: "block text-sm font-medium text-foreground mb-1",
+									className: "block text-sm font-medium text-text-primary mb-1",
 									children: "Credits to Withdraw"
 								}),
 								/* @__PURE__ */ f("input", {
@@ -597,10 +597,10 @@ var h = () => {
 									value: E,
 									onChange: (e) => D(e.target.value),
 									placeholder: "Enter credit amount",
-									className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30"
+									className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								}),
 								/* @__PURE__ */ p("p", {
-									className: "text-xs text-muted-foreground mt-1",
+									className: "text-xs text-text-secondary mt-1",
 									children: [
 										"Max withdrawable:",
 										" ",
@@ -611,12 +611,12 @@ var h = () => {
 									]
 								}),
 								Y > 0 && Y <= Q && /* @__PURE__ */ f("p", {
-									className: "text-xs text-muted-foreground mt-1",
+									className: "text-xs text-text-secondary mt-1",
 									children: X ? "Calculating…" : Z == null ? null : /* @__PURE__ */ p(d, { children: [
 										"Estimated payout:",
 										" ",
 										/* @__PURE__ */ f("span", {
-											className: "font-semibold text-foreground",
+											className: "font-semibold text-text-primary",
 											children: Z.toLocaleString(void 0, {
 												style: "currency",
 												currency: J,
@@ -629,14 +629,14 @@ var h = () => {
 									] })
 								}),
 								Y > 0 && Y > Q && /* @__PURE__ */ f("p", {
-									className: "text-xs text-destructive mt-1",
+									className: "text-xs text-status-error-text mt-1",
 									children: "Amount exceeds your withdrawable balance"
 								})
 							] }),
 							/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ p("label", {
-								className: "block text-sm font-medium text-foreground mb-1",
+								className: "block text-sm font-medium text-text-primary mb-1",
 								children: ["Notes ", /* @__PURE__ */ f("span", {
-									className: "text-muted-foreground font-normal",
+									className: "text-text-secondary font-normal",
 									children: "(optional)"
 								})]
 							}), /* @__PURE__ */ f("textarea", {
@@ -644,19 +644,19 @@ var h = () => {
 								onChange: (e) => k(e.target.value),
 								placeholder: "Any notes for this withdrawal request",
 								rows: 2,
-								className: "w-full px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/30 resize-none"
+								className: "w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none"
 							})] }),
 							M && /* @__PURE__ */ f("div", {
-								className: "p-3 rounded-md bg-destructive/10 border border-destructive/20",
+								className: "p-3 rounded-button bg-status-error-bg-subtle border border-status-error-border",
 								children: /* @__PURE__ */ f("p", {
-									className: "text-sm text-destructive",
+									className: "text-sm text-status-error-text",
 									children: M
 								})
 							}),
 							/* @__PURE__ */ p("div", {
-								className: "pt-1 border-t border-border",
+								className: "pt-1 border-t border-border-subtle",
 								children: [/* @__PURE__ */ p("p", {
-									className: "text-xs text-muted-foreground mb-3",
+									className: "text-xs text-text-secondary mb-3",
 									children: [
 										"Credits will be converted to ",
 										J,
@@ -666,7 +666,7 @@ var h = () => {
 									type: "button",
 									onClick: () => void be(),
 									disabled: A || !Se || !w || $.length === 0,
-									className: "w-full py-2.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
+									className: "w-full py-2.5 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
 									children: A ? "Submitting…" : "Request Withdrawal"
 								})]
 							})
@@ -679,12 +679,12 @@ var h = () => {
 				children: [/* @__PURE__ */ p("div", {
 					className: "flex items-center justify-between",
 					children: [/* @__PURE__ */ f("h2", {
-						className: "text-base font-semibold text-foreground",
+						className: "text-base font-semibold text-text-primary",
 						children: "Withdrawal History"
 					}), /* @__PURE__ */ f("button", {
 						type: "button",
 						onClick: () => void q(),
-						className: "text-sm text-muted-foreground hover:text-foreground transition-colors",
+						className: "text-sm text-text-secondary hover:text-text-primary transition-colors",
 						"aria-label": "Refresh withdrawal history",
 						children: /* @__PURE__ */ f("svg", {
 							className: "size-4",
@@ -705,11 +705,11 @@ var h = () => {
 						1,
 						2,
 						3
-					].map((e) => /* @__PURE__ */ f("div", { className: "h-16 border border-border rounded-lg bg-muted animate-pulse" }, e))
+					].map((e) => /* @__PURE__ */ f("div", { className: "h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse" }, e))
 				}) : S.length === 0 ? /* @__PURE__ */ p("div", {
-					className: "flex flex-col items-center justify-center py-10 border border-dashed border-border rounded-lg",
+					className: "flex flex-col items-center justify-center py-10 border border-dashed border-border-subtle rounded-lg",
 					children: [/* @__PURE__ */ f("svg", {
-						className: "size-8 text-muted-foreground mb-2",
+						className: "size-8 text-text-secondary mb-2",
 						fill: "none",
 						viewBox: "0 0 24 24",
 						stroke: "currentColor",
@@ -720,44 +720,44 @@ var h = () => {
 							d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"
 						})
 					}), /* @__PURE__ */ f("p", {
-						className: "text-sm text-muted-foreground",
+						className: "text-sm text-text-secondary",
 						children: "No withdrawal requests yet"
 					})]
 				}) : /* @__PURE__ */ f("div", {
-					className: "border border-border rounded-lg overflow-hidden",
+					className: "border border-border-subtle rounded-lg overflow-hidden",
 					children: /* @__PURE__ */ p("table", {
 						className: "w-full text-sm",
 						children: [/* @__PURE__ */ f("thead", {
-							className: "bg-muted/50 border-b border-border",
+							className: "bg-bg-sunken border-b border-border-subtle",
 							children: /* @__PURE__ */ p("tr", { children: [
 								/* @__PURE__ */ f("th", {
-									className: "text-left px-4 py-3 text-xs font-medium text-muted-foreground uppercase tracking-wide",
+									className: "text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide",
 									children: "Amount"
 								}),
 								/* @__PURE__ */ f("th", {
-									className: "text-left px-4 py-3 text-xs font-medium text-muted-foreground uppercase tracking-wide",
+									className: "text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide",
 									children: "Status"
 								}),
 								/* @__PURE__ */ f("th", {
-									className: "text-left px-4 py-3 text-xs font-medium text-muted-foreground uppercase tracking-wide hidden sm:table-cell",
+									className: "text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden sm:table-cell",
 									children: "Payout Account"
 								}),
 								/* @__PURE__ */ f("th", {
-									className: "text-left px-4 py-3 text-xs font-medium text-muted-foreground uppercase tracking-wide hidden md:table-cell",
+									className: "text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell",
 									children: "Requested"
 								}),
 								/* @__PURE__ */ f("th", {
-									className: "text-left px-4 py-3 text-xs font-medium text-muted-foreground uppercase tracking-wide hidden md:table-cell",
+									className: "text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell",
 									children: "Completed"
 								})
 							] })
 						}), /* @__PURE__ */ f("tbody", {
-							className: "divide-y divide-border",
+							className: "divide-y divide-border-subtle",
 							children: S.map((e) => /* @__PURE__ */ p("tr", {
-								className: "hover:bg-muted/30 transition-colors",
+								className: "hover:bg-bg-sunken transition-colors",
 								children: [
 									/* @__PURE__ */ p("td", {
-										className: "px-4 py-3 font-medium text-foreground",
+										className: "px-4 py-3 font-medium text-text-primary",
 										children: [
 											e.requestedAmount.toLocaleString(),
 											" ",
@@ -770,24 +770,24 @@ var h = () => {
 											className: `inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${le(e.status)}`,
 											children: e.status.charAt(0) + e.status.slice(1).toLowerCase()
 										}), e.failureReason && /* @__PURE__ */ f("p", {
-											className: "text-xs text-destructive mt-0.5 max-w-[180px] truncate",
+											className: "text-xs text-status-error-text mt-0.5 max-w-[180px] truncate",
 											title: e.failureReason,
 											children: e.failureReason
 										})]
 									}),
 									/* @__PURE__ */ f("td", {
-										className: "px-4 py-3 text-muted-foreground hidden sm:table-cell",
+										className: "px-4 py-3 text-text-secondary hidden sm:table-cell",
 										children: e.payoutAccount ? /* @__PURE__ */ p("span", { children: [e.payoutAccount.label, e.payoutAccount.accountLast4 ? ` ···${e.payoutAccount.accountLast4}` : ""] }) : "—"
 									}),
 									/* @__PURE__ */ f("td", {
-										className: "px-4 py-3 text-muted-foreground hidden md:table-cell",
+										className: "px-4 py-3 text-text-secondary hidden md:table-cell",
 										children: /* @__PURE__ */ f("span", {
 											title: r(e.createdAt, "long"),
 											children: ee(e.createdAt)
 										})
 									}),
 									/* @__PURE__ */ f("td", {
-										className: "px-4 py-3 text-muted-foreground hidden md:table-cell",
+										className: "px-4 py-3 text-text-secondary hidden md:table-cell",
 										children: e.paidAt ? /* @__PURE__ */ f("span", {
 											className: ce("PAID"),
 											children: r(e.paidAt, "short")