@burdenoff/microfe-channel 2026.608.1 → 2026.624.1

package/dist/channel/modules/channels/pages/ChannelDetailsPage.js

@@ -61,7 +61,7 @@ var S = {
 	},
 	INACTIVE: {
 		label: "Inactive",
-		color: "text-muted-foreground bg-muted",
+		color: "text-text-secondary bg-bg-sunken",
 		icon: h
 	},
 	ERROR: {
@@ -76,7 +76,7 @@ var S = {
 	},
 	ARCHIVED: {
 		label: "Archived",
-		color: "text-muted-foreground bg-muted",
+		color: "text-text-secondary bg-bg-sunken",
 		icon: h
 	}
 }, w = {
@@ -97,7 +97,7 @@ var S = {
 	},
 	UNKNOWN: {
 		label: "Unknown",
-		color: "text-muted-foreground",
+		color: "text-text-secondary",
 		icon: f
 	}
 };
@@ -292,7 +292,7 @@ function T() {
 						children: [/* @__PURE__ */ b("button", {
 							type: "button",
 							onClick: () => f(-1),
-							className: "p-2 text-muted-foreground hover:text-foreground hover:bg-muted rounded-lg transition-colors",
+							className: "p-2 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors",
 							children: /* @__PURE__ */ b(ce, { size: 20 })
 						}), /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ x("div", {
 							className: "flex items-center gap-2",
@@ -300,11 +300,11 @@ function T() {
 								size: 24,
 								className: "text-accent-primary"
 							}), /* @__PURE__ */ b("h1", {
-								className: "text-xl sm:text-2xl font-bold text-foreground",
+								className: "text-xl sm:text-2xl font-bold text-text-primary",
 								children: K.name
 							})]
 						}), K.description && /* @__PURE__ */ b("p", {
-							className: "text-sm text-muted-foreground mt-1",
+							className: "text-sm text-text-secondary mt-1",
 							children: K.description
 						})] })]
 					}), /* @__PURE__ */ x("div", {
@@ -316,7 +316,7 @@ function T() {
 									type: "button",
 									onClick: He,
 									disabled: A === "health",
-									className: "flex items-center gap-2 px-3 py-2 text-sm text-muted-foreground hover:text-status-info-text hover:bg-status-info-bg-subtle rounded-lg transition-colors disabled:opacity-50",
+									className: "flex items-center gap-2 px-3 py-2 text-sm text-text-secondary hover:text-status-info-text hover:bg-status-info-bg-subtle rounded-lg transition-colors disabled:opacity-50",
 									children: [A === "health" ? /* @__PURE__ */ b(p, {
 										size: 16,
 										className: "animate-spin"
@@ -359,9 +359,9 @@ function T() {
 					className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
 					children: [
 						/* @__PURE__ */ x("div", {
-							className: "p-4 bg-surface border border-border rounded-lg",
+							className: "p-4 bg-surface border border-border-subtle rounded-lg",
 							children: [/* @__PURE__ */ b("p", {
-								className: "text-xs text-muted-foreground mb-1",
+								className: "text-xs text-text-secondary mb-1",
 								children: O("channel.platform", "Platform")
 							}), /* @__PURE__ */ b("span", {
 								className: `inline-flex px-2 py-1 text-sm font-semibold rounded-full ${X.color}`,
@@ -369,9 +369,9 @@ function T() {
 							})]
 						}),
 						/* @__PURE__ */ x("div", {
-							className: "p-4 bg-surface border border-border rounded-lg",
+							className: "p-4 bg-surface border border-border-subtle rounded-lg",
 							children: [/* @__PURE__ */ b("p", {
-								className: "text-xs text-muted-foreground mb-1",
+								className: "text-xs text-text-secondary mb-1",
 								children: O("channel.status", "Status")
 							}), /* @__PURE__ */ x("div", {
 								className: "flex items-center gap-2",
@@ -385,10 +385,10 @@ function T() {
 							})]
 						}),
 						/* @__PURE__ */ x("div", {
-							className: "p-4 bg-surface border border-border rounded-lg",
+							className: "p-4 bg-surface border border-border-subtle rounded-lg",
 							children: [
 								/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground mb-1",
+									className: "text-xs text-text-secondary mb-1",
 									children: O("channel.connectionHealth", "Connection Health")
 								}),
 								/* @__PURE__ */ x("div", {
@@ -402,7 +402,7 @@ function T() {
 									})]
 								}),
 								K.lastHealthCheckAt && /* @__PURE__ */ x("p", {
-									className: "text-xs text-muted-foreground mt-1",
+									className: "text-xs text-text-secondary mt-1",
 									children: [
 										O("channel.lastCheck", "Last check"),
 										":",
@@ -413,17 +413,17 @@ function T() {
 							]
 						}),
 						/* @__PURE__ */ x("div", {
-							className: "p-4 bg-surface border border-border rounded-lg",
+							className: "p-4 bg-surface border border-border-subtle rounded-lg",
 							children: [/* @__PURE__ */ b("p", {
-								className: "text-xs text-muted-foreground mb-1",
+								className: "text-xs text-text-secondary mb-1",
 								children: O("channel.connection", "Connection")
 							}), /* @__PURE__ */ x("div", {
 								className: "flex items-center gap-2",
 								children: [/* @__PURE__ */ b(u, {
 									size: 16,
-									className: K.isConnected ? "text-status-success-text" : "text-muted-foreground"
+									className: K.isConnected ? "text-status-success-text" : "text-text-secondary"
 								}), /* @__PURE__ */ b("span", {
-									className: `text-sm font-medium ${K.isConnected ? "text-status-success-text" : "text-muted-foreground"}`,
+									className: `text-sm font-medium ${K.isConnected ? "text-status-success-text" : "text-text-secondary"}`,
 									children: K.isConnected ? O("channel.connected", "Connected") : O("channel.notConnected", "Not Connected")
 								})]
 							})]
@@ -431,55 +431,55 @@ function T() {
 					]
 				}),
 				/* @__PURE__ */ x("div", {
-					className: "p-4 bg-surface border border-border rounded-lg",
+					className: "p-4 bg-surface border border-border-subtle rounded-lg",
 					children: [
 						/* @__PURE__ */ b("h2", {
-							className: "text-lg font-semibold text-foreground mb-4",
+							className: "text-lg font-semibold text-text-primary mb-4",
 							children: O("channel.channelDetails", "Channel Details")
 						}),
 						/* @__PURE__ */ x("div", {
 							className: "grid gap-4 sm:grid-cols-2",
 							children: [
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.adapterType", "Adapter Type")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: K.adapterType?.replace(/_/g, " ") || O("channel.notConfigured", "Not configured")
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.priority", "Priority")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: K.priority
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.consecutiveFailures", "Consecutive Failures")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: K.consecutiveFailures
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.messages24h", "Messages (24h)")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: K.messageCount24h
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.createdAt", "Created At")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: new Date(K.createdAt).toLocaleString()
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.updatedAt", "Updated At")
 								}), /* @__PURE__ */ b("p", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: new Date(K.updatedAt).toLocaleString()
 								})] })
 							]
@@ -487,7 +487,7 @@ function T() {
 						K.tagAssignments && K.tagAssignments.length > 0 && /* @__PURE__ */ x("div", {
 							className: "mt-4",
 							children: [/* @__PURE__ */ b("p", {
-								className: "text-xs text-muted-foreground mb-1.5",
+								className: "text-xs text-text-secondary mb-1.5",
 								children: O("channel.tags", "Tags")
 							}), /* @__PURE__ */ b("div", {
 								className: "flex flex-wrap gap-1.5",
@@ -517,7 +517,7 @@ function T() {
 						/* @__PURE__ */ x("button", {
 							type: "button",
 							onClick: () => f("./deliveries"),
-							className: "flex items-center gap-3 p-3 bg-surface border border-border rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
+							className: "flex items-center gap-3 p-3 bg-surface border border-border-subtle rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
 							children: [
 								/* @__PURE__ */ b("div", {
 									className: "p-2 bg-accent-orange/10 rounded-lg",
@@ -529,23 +529,23 @@ function T() {
 								/* @__PURE__ */ x("div", {
 									className: "flex-1 min-w-0",
 									children: [/* @__PURE__ */ b("p", {
-										className: "text-sm font-medium text-foreground",
+										className: "text-sm font-medium text-text-primary",
 										children: O("channel.deliveryHistory", "Delivery History")
 									}), /* @__PURE__ */ b("p", {
-										className: "text-xs text-muted-foreground truncate",
+										className: "text-xs text-text-secondary truncate",
 										children: O("channel.viewMessageDeliveries", "View message deliveries")
 									})]
 								}),
 								/* @__PURE__ */ b(l, {
 									size: 16,
-									className: "text-muted-foreground shrink-0"
+									className: "text-text-secondary shrink-0"
 								})
 							]
 						}),
 						/* @__PURE__ */ x("button", {
 							type: "button",
 							onClick: () => f("./webhooks"),
-							className: "flex items-center gap-3 p-3 bg-surface border border-border rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
+							className: "flex items-center gap-3 p-3 bg-surface border border-border-subtle rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
 							children: [
 								/* @__PURE__ */ b("div", {
 									className: "p-2 bg-accent-purple/10 rounded-lg",
@@ -557,23 +557,23 @@ function T() {
 								/* @__PURE__ */ x("div", {
 									className: "flex-1 min-w-0",
 									children: [/* @__PURE__ */ b("p", {
-										className: "text-sm font-medium text-foreground",
+										className: "text-sm font-medium text-text-primary",
 										children: O("channel.webhookEvents", "Webhook Events")
 									}), /* @__PURE__ */ b("p", {
-										className: "text-xs text-muted-foreground truncate",
+										className: "text-xs text-text-secondary truncate",
 										children: O("channel.viewIncomingWebhooks", "View incoming webhooks")
 									})]
 								}),
 								/* @__PURE__ */ b(l, {
 									size: 16,
-									className: "text-muted-foreground shrink-0"
+									className: "text-text-secondary shrink-0"
 								})
 							]
 						}),
 						/* @__PURE__ */ x("button", {
 							type: "button",
 							onClick: () => f("./users"),
-							className: "flex items-center gap-3 p-3 bg-surface border border-border rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
+							className: "flex items-center gap-3 p-3 bg-surface border border-border-subtle rounded-lg hover:bg-action-primary-bg/10 transition-colors text-left",
 							children: [
 								/* @__PURE__ */ b("div", {
 									className: "p-2 bg-accent-blue/10 rounded-lg",
@@ -585,23 +585,23 @@ function T() {
 								/* @__PURE__ */ x("div", {
 									className: "flex-1 min-w-0",
 									children: [/* @__PURE__ */ b("p", {
-										className: "text-sm font-medium text-foreground",
+										className: "text-sm font-medium text-text-primary",
 										children: O("channel.channelUsers", "Channel Users")
 									}), /* @__PURE__ */ b("p", {
-										className: "text-xs text-muted-foreground truncate",
+										className: "text-xs text-text-secondary truncate",
 										children: O("channel.viewConnectedUsers", "View connected users")
 									})]
 								}),
 								/* @__PURE__ */ b(l, {
 									size: 16,
-									className: "text-muted-foreground shrink-0"
+									className: "text-text-secondary shrink-0"
 								})
 							]
 						})
 					]
 				}),
 				/* @__PURE__ */ x("div", {
-					className: "p-4 bg-surface border border-border rounded-lg",
+					className: "p-4 bg-surface border border-border-subtle rounded-lg",
 					children: [
 						/* @__PURE__ */ x("div", {
 							className: "flex items-center justify-between mb-4",
@@ -611,7 +611,7 @@ function T() {
 									size: 20,
 									className: "text-accent-primary"
 								}), /* @__PURE__ */ b("h2", {
-									className: "text-lg font-semibold text-foreground",
+									className: "text-lg font-semibold text-text-primary",
 									children: O("channel.connectionAndCredentials", "Connection & Credentials")
 								})]
 							}), De && !$ && !M && /* @__PURE__ */ x("button", {
@@ -628,14 +628,14 @@ function T() {
 									className: "grid gap-4 sm:grid-cols-2",
 									children: [
 										/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: O("channel.authType", "Auth Type")
 										}), /* @__PURE__ */ b("p", {
-											className: "text-sm font-medium text-foreground",
+											className: "text-sm font-medium text-text-primary",
 											children: a($.authType, ee, O)
 										})] }),
 										/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: O("channel.status", "Status")
 										}), /* @__PURE__ */ x("div", {
 											className: "flex items-center gap-2",
@@ -651,26 +651,26 @@ function T() {
 											})]
 										})] }),
 										/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: O("channel.lastTested", "Last Tested")
 										}), /* @__PURE__ */ b("p", {
-											className: "text-sm font-medium text-foreground",
+											className: "text-sm font-medium text-text-primary",
 											children: $.lastTestedAt ? new Date($.lastTestedAt).toLocaleString() : O("channel.never", "Never")
 										})] }),
 										/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: O("channel.testStatus", "Test Status")
 										}), /* @__PURE__ */ b("p", {
-											className: "text-sm font-medium text-foreground",
+											className: "text-sm font-medium text-text-primary",
 											children: $.testStatus || O("channel.notTested", "Not tested")
 										})] }),
 										$.tokenExpiresAt && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: O("channel.tokenExpires", "Token Expires")
 										}), /* @__PURE__ */ x("p", {
-											className: `text-sm font-medium ${$.needsTokenRefresh ? "text-status-warning-text" : "text-foreground"}`,
+											className: `text-sm font-medium ${$.needsTokenRefresh ? "text-status-warning-text" : "text-text-primary"}`,
 											children: [new Date($.tokenExpiresAt).toLocaleString(), $.daysUntilExpiry !== void 0 && /* @__PURE__ */ x("span", {
-												className: "text-xs text-muted-foreground ml-1",
+												className: "text-xs text-text-secondary ml-1",
 												children: [
 													"(",
 													$.daysUntilExpiry,
@@ -719,7 +719,7 @@ function T() {
 											onClick: () => {
 												N(!0), F($?.platformMetadata ?? {});
 											},
-											className: "flex items-center gap-2 px-3 py-2 text-sm text-muted-foreground hover:text-accent-primary hover:bg-accent-primary/10 rounded-lg transition-colors",
+											className: "flex items-center gap-2 px-3 py-2 text-sm text-text-secondary hover:text-accent-primary hover:bg-accent-primary/10 rounded-lg transition-colors",
 											children: [/* @__PURE__ */ b(m, { size: 16 }), O("channel.updateCredentials", "Update Credentials")]
 										}),
 										/* @__PURE__ */ b(r, {
@@ -744,14 +744,14 @@ function T() {
 							children: [
 								/* @__PURE__ */ b(u, {
 									size: 32,
-									className: "mx-auto text-muted-foreground mb-3"
+									className: "mx-auto text-text-secondary mb-3"
 								}),
 								/* @__PURE__ */ b("p", {
-									className: "text-sm text-muted-foreground mb-2",
+									className: "text-sm text-text-secondary mb-2",
 									children: O("channel.noCredentialsConfigured", "No credentials configured for this channel")
 								}),
 								/* @__PURE__ */ b("p", {
-									className: "text-xs text-muted-foreground",
+									className: "text-xs text-text-secondary",
 									children: O("channel.addCredentialsHint", "Add credentials to enable message delivery through this channel")
 								})
 							]
@@ -770,7 +770,7 @@ function T() {
 											className: "text-sm font-medium text-accent-orange",
 											children: O("channel.noAdapterTypeConfigured", "No adapter type configured")
 										}), /* @__PURE__ */ b("p", {
-											className: "text-xs text-muted-foreground mt-1",
+											className: "text-xs text-text-secondary mt-1",
 											children: O("channel.noAdapterTypeConfiguredHint", "You can still add credentials below. The system will attempt to validate them when the channel is configured with an adapter type.")
 										})] })]
 									})
@@ -790,7 +790,7 @@ function T() {
 									})
 								}),
 								/* @__PURE__ */ x("div", {
-									className: "flex items-center gap-2 pt-2 border-t border-border",
+									className: "flex items-center gap-2 pt-2 border-t border-border-subtle",
 									children: [/* @__PURE__ */ b(r, {
 										permission: i.CHANNEL_CONNECTION_UPDATE,
 										children: /* @__PURE__ */ x("button", {
@@ -810,7 +810,7 @@ function T() {
 										onClick: () => {
 											N(!1), F({}), I(!1);
 										},
-										className: "flex items-center gap-2 px-4 py-2 text-sm text-muted-foreground hover:bg-muted rounded-lg transition-colors",
+										className: "flex items-center gap-2 px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors",
 										children: [/* @__PURE__ */ b(v, { size: 16 }), O("channel.cancel", "Cancel")]
 									})]
 								})
@@ -821,7 +821,7 @@ function T() {
 				je && /* @__PURE__ */ b("div", {
 					className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50",
 					children: /* @__PURE__ */ x("div", {
-						className: "w-full max-w-md mx-4 p-6 bg-surface border border-border rounded-lg shadow-xl",
+						className: "w-full max-w-md mx-4 p-6 bg-surface border border-border-subtle rounded-lg shadow-xl",
 						children: [/* @__PURE__ */ x("div", {
 							className: "flex items-center justify-between mb-4",
 							children: [/* @__PURE__ */ x("div", {
@@ -830,7 +830,7 @@ function T() {
 									size: 20,
 									className: "text-accent-primary"
 								}), /* @__PURE__ */ x("h3", {
-									className: "text-lg font-semibold text-foreground",
+									className: "text-lg font-semibold text-text-primary",
 									children: [
 										"Test ",
 										S[K.platform]?.label || K.platform,
@@ -840,14 +840,14 @@ function T() {
 							}), /* @__PURE__ */ b("button", {
 								type: "button",
 								onClick: () => z(!1),
-								className: "p-1 text-muted-foreground hover:text-foreground rounded",
+								className: "p-1 text-text-secondary hover:text-text-primary rounded",
 								children: /* @__PURE__ */ b(v, { size: 20 })
 							})]
 						}), /* @__PURE__ */ x("div", {
 							className: "space-y-4",
 							children: [
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ x("label", {
-									className: "block text-sm font-medium text-foreground mb-1.5",
+									className: "block text-sm font-medium text-text-primary mb-1.5",
 									children: [
 										Y(K.platform),
 										" ",
@@ -864,15 +864,15 @@ function T() {
 										value: B,
 										onChange: (e) => V(e.target.value),
 										placeholder: J(K.platform),
-										className: "w-full pl-9 pr-3 py-2 text-sm bg-surface border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
+										className: "w-full pl-9 pr-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
 									}), /* @__PURE__ */ b("div", {
-										className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground",
+										className: "absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary",
 										children: K.platform === "EMAIL" ? /* @__PURE__ */ b(de, { size: 16 }) : K.platform === "SMS" || K.platform === "WHATSAPP" ? /* @__PURE__ */ b(pe, { size: 16 }) : /* @__PURE__ */ b(fe, { size: 16 })
 									})]
 								})] }),
 								K.platform === "EMAIL" && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
 									htmlFor: "channel-details-test-subject",
-									className: "block text-sm font-medium text-foreground mb-1.5",
+									className: "block text-sm font-medium text-text-primary mb-1.5",
 									children: "Subject"
 								}), /* @__PURE__ */ b("input", {
 									id: "channel-details-test-subject",
@@ -881,11 +881,11 @@ function T() {
 									value: H,
 									onChange: (e) => Me(e.target.value),
 									placeholder: "Email subject",
-									className: "w-full px-3 py-2 text-sm bg-surface border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
+									className: "w-full px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
 								})] }),
 								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
 									htmlFor: "channel-details-test-message",
-									className: "block text-sm font-medium text-foreground mb-1.5",
+									className: "block text-sm font-medium text-text-primary mb-1.5",
 									children: "Message"
 								}), /* @__PURE__ */ b("textarea", {
 									id: "channel-details-test-message",
@@ -894,7 +894,7 @@ function T() {
 									onChange: (e) => Ne(e.target.value),
 									placeholder: "Test message content",
 									rows: 3,
-									className: "w-full px-3 py-2 text-sm bg-surface border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg resize-none"
+									className: "w-full px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg resize-none"
 								})] }),
 								W && /* @__PURE__ */ b("div", {
 									className: `p-3 rounded-lg ${W.success ? "bg-status-success-bg-subtle border border-status-success-border" : "bg-status-error-bg-subtle border border-status-error-border"}`,
@@ -918,11 +918,11 @@ function T() {
 													children: ["Message ID: ", W.messageId]
 												}),
 												W.externalId && /* @__PURE__ */ x("p", {
-													className: "text-xs text-muted-foreground mt-1",
+													className: "text-xs text-text-secondary mt-1",
 													children: ["External ID: ", W.externalId]
 												}),
 												W.status && /* @__PURE__ */ x("p", {
-													className: "text-xs text-muted-foreground mt-1",
+													className: "text-xs text-text-secondary mt-1",
 													children: ["Status: ", W.status]
 												}),
 												W.error && /* @__PURE__ */ x("p", {
@@ -933,7 +933,7 @@ function T() {
 													})]
 												}),
 												W.sentAt && /* @__PURE__ */ x("p", {
-													className: "text-xs text-muted-foreground mt-1",
+													className: "text-xs text-text-secondary mt-1",
 													children: ["Sent at: ", new Date(W.sentAt).toLocaleString()]
 												})
 											]
@@ -957,7 +957,7 @@ function T() {
 									}), /* @__PURE__ */ b("button", {
 										type: "button",
 										onClick: () => z(!1),
-										className: "px-4 py-2 text-sm text-muted-foreground hover:bg-muted rounded-lg transition-colors",
+										className: "px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors",
 										children: O("channel.close", "Close")
 									})]
 								})