From 49e500fddaf5cc252ef4ae8f05c95a6625c2e315 Mon Sep 17 00:00:00 2001
From: grabowski <berwn@buildfor.life>
Date: Mon, 6 Apr 2026 13:25:55 +0700
Subject: [PATCH] Fix dark mode text color on budget amounts

Budget/expense amounts on dashboard, project view, and expenses page
now show white text in dark mode instead of black.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../(app)/companies/[companyId]/expenses/+page.svelte       | 2 +-
 .../companies/[companyId]/projects/[projectId]/+page.svelte | 6 +++---
 src/routes/(app)/dashboard/+page.svelte                     | 6 +++---
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/routes/(app)/companies/[companyId]/expenses/+page.svelte b/src/routes/(app)/companies/[companyId]/expenses/+page.svelte
index 4f651ca..5b5b0d8 100644
--- a/src/routes/(app)/companies/[companyId]/expenses/+page.svelte
+++ b/src/routes/(app)/companies/[companyId]/expenses/+page.svelte
@@ -57,7 +57,7 @@
 							</p>
 						</div>
 						<div class="text-right">
-							<p class="text-lg font-semibold">{formatCurrency(expense.amount, expense.currency)}</p>
+							<p class="text-lg font-semibold dark:text-white">{formatCurrency(expense.amount, expense.currency)}</p>
 							<span
 								class="rounded-full px-2 py-0.5 text-xs font-medium
 									{expense.status === 'approved'
diff --git a/src/routes/(app)/companies/[companyId]/projects/[projectId]/+page.svelte b/src/routes/(app)/companies/[companyId]/projects/[projectId]/+page.svelte
index 2ebdbd3..79fedd3 100644
--- a/src/routes/(app)/companies/[companyId]/projects/[projectId]/+page.svelte
+++ b/src/routes/(app)/companies/[companyId]/projects/[projectId]/+page.svelte
@@ -33,11 +33,11 @@
 	<div class="mb-6 grid gap-4 sm:grid-cols-3">
 		<div class="rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 p-4">
 			<p class="text-sm text-gray-500 dark:text-gray-400">Budget</p>
-			<p class="text-xl font-bold">{formatCurrency(data.project.allocatedBudget, currency)}</p>
+			<p class="text-xl font-bold dark:text-white">{formatCurrency(data.project.allocatedBudget, currency)}</p>
 		</div>
 		<div class="rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 p-4">
 			<p class="text-sm text-gray-500 dark:text-gray-400">Spent (Approved)</p>
-			<p class="text-xl font-bold">{formatCurrency(data.stats.totalApproved, currency)}</p>
+			<p class="text-xl font-bold dark:text-white">{formatCurrency(data.stats.totalApproved, currency)}</p>
 		</div>
 		<div class="rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 p-4">
 			<p class="text-sm text-gray-500 dark:text-gray-400">Pending</p>
@@ -68,7 +68,7 @@
 						<tr class="border-t border-gray-100 dark:border-gray-700">
 							<td class="px-4 py-3 font-medium text-gray-900 dark:text-white">{expense.title}</td>
 							<td class="px-4 py-3 text-gray-500 dark:text-gray-400">{expense.categoryName ?? '—'}</td>
-							<td class="px-4 py-3">{formatCurrency(expense.amount, expense.currency)}</td>
+							<td class="px-4 py-3 dark:text-white">{formatCurrency(expense.amount, expense.currency)}</td>
 							<td class="px-4 py-3 text-gray-500 dark:text-gray-400">{expense.expenseDate}</td>
 							<td class="px-4 py-3 text-gray-500 dark:text-gray-400">{expense.submitterName ?? expense.submitterEmail}</td>
 							<td class="px-4 py-3">
diff --git a/src/routes/(app)/dashboard/+page.svelte b/src/routes/(app)/dashboard/+page.svelte
index a1801f8..71bd858 100644
--- a/src/routes/(app)/dashboard/+page.svelte
+++ b/src/routes/(app)/dashboard/+page.svelte
@@ -52,15 +52,15 @@
 					<div class="space-y-2 text-sm">
 						<div class="flex justify-between">
 							<span class="text-gray-500 dark:text-gray-400">Budget</span>
-							<span class="font-medium">{formatCurrency(company.totalBudget, company.currency)}</span>
+							<span class="font-medium dark:text-white">{formatCurrency(company.totalBudget, company.currency)}</span>
 						</div>
 						<div class="flex justify-between">
 							<span class="text-gray-500 dark:text-gray-400">Spent</span>
-							<span class="font-medium">{formatCurrency(company.totalSpent, company.currency)}</span>
+							<span class="font-medium dark:text-white">{formatCurrency(company.totalSpent, company.currency)}</span>
 						</div>
 						<div class="flex justify-between">
 							<span class="text-gray-500 dark:text-gray-400">Projects</span>
-							<span class="font-medium">{company.projectCount}</span>
+							<span class="font-medium dark:text-white">{company.projectCount}</span>
 						</div>
 						{#if company.pendingExpenses > 0}
 							<div class="flex justify-between">