From 84522b2475a1dcdff7abf630666a823293b2dc3d Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@umami.is>
Date: Fri, 6 Feb 2026 03:31:20 -0800
Subject: [PATCH] Fix ChangeLabel colors to use react-zen theme variables.

Replace old CSS variables with new theme tokens for success, error,
and neutral states.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/metrics/ChangeLabel.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/metrics/ChangeLabel.tsx b/src/components/metrics/ChangeLabel.tsx
index 192f0ff21..794d18732 100644
--- a/src/components/metrics/ChangeLabel.tsx
+++ b/src/components/metrics/ChangeLabel.tsx
@@ -4,16 +4,16 @@ import { ArrowRight } from '@/components/icons';
 
 const STYLES = {
   positive: {
-    color: `var(--success-color)`,
-    background: `color-mix(in srgb, var(--success-color), var(--background-color) 95%)`,
+    color: `var(--status-success-text)`,
+    background: `var(--status-success-bg)`,
   },
   negative: {
-    color: `var(--danger-color)`,
-    background: `color-mix(in srgb, var(--danger-color), var(--background-color) 95%)`,
+    color: `var(--status-error-text)`,
+    background: `var(--status-error-bg)`,
   },
   neutral: {
-    color: `var(--font-color-muted)`,
-    background: `var(--base-color-2)`,
+    color: `var(--text-muted)`,
+    background: `var(--surface-raised)`,
   },
 };