From 8f707e04902447b18e9f8459c6cf2f78269598fa Mon Sep 17 00:00:00 2001
From: Saravana Achu Mac <saravanakumardb1@gmail.com>
Date: Wed, 6 May 2026 20:32:44 -0700
Subject: [PATCH] refactor(ui): tokenize settings status colors

---
 web/src/tabs/SettingsTab.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/tabs/SettingsTab.tsx b/web/src/tabs/SettingsTab.tsx
index d320cdb..b3342b0 100644
--- a/web/src/tabs/SettingsTab.tsx
+++ b/web/src/tabs/SettingsTab.tsx
@@ -166,7 +166,7 @@ export const SettingsTab = ({ botState }: SettingsTabProps) => {
                             <Input
                                 value={profile?.role || 'user'}
                                 disabled={true}
-                                style={{ background: 'rgba(255, 255, 255, 0.02)', color: '#888', fontStyle: 'italic' }}
+                                style={{ background: 'color-mix(in oklab, var(--foreground) 2%, transparent)', color: 'var(--muted-foreground)', fontStyle: 'italic' }}
                             />
                         </div>
 
@@ -180,7 +180,7 @@ export const SettingsTab = ({ botState }: SettingsTabProps) => {
                                     onChange={handleChange}
                                     disabled={!editing}
                                 />
-                                <span className="toggle-label" style={{ color: formData.trade_enable ? '#00ff88' : '#ff3366' }}>
+                                <span className="toggle-label" style={{ color: formData.trade_enable ? 'var(--bl-success)' : 'var(--bl-danger)' }}>
                                     {formData.trade_enable ? 'Enabled' : 'Disabled'}
                                 </span>
                             </div>