Fix remaining dark mode black text on amounts

- Projects tab: budget amounts on project cards
- Budget tab: allocated/spent/remaining in project table
- Reports tab: category amounts, project names, budget vs actual values
- Company overview: expense amounts in recent expenses table

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/routes/(app)/companies/[companyId]/+page.svelte

@@ -112,7 +112,7 @@
 						<tr class="border-b border-gray-50 dark:border-gray-700/50">
 							<td class="py-2 font-medium text-gray-900 dark:text-white">{expense.title}</td>
 							<td class="py-2 text-gray-500 dark:text-gray-400">{expense.projectName}</td>
-							<td class="py-2">{formatCurrency(expense.amount, currency)}</td>
+							<td class="py-2 dark:text-white">{formatCurrency(expense.amount, currency)}</td>
 							<td class="py-2 text-gray-500 dark:text-gray-400">{expense.expenseDate}</td>
 							<td class="py-2">
 								<span

src/routes/(app)/companies/[companyId]/budget/+page.svelte

@@ -218,9 +218,9 @@
 					{@const pct = allocated > 0 ? Math.min((spent / allocated) * 100, 100) : 0}
 					<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">{project.name}</td>
-						<td class="px-4 py-3">{formatCurrency(allocated, currency)}</td>
+						<td class="px-4 py-3 dark:text-white">{formatCurrency(allocated, currency)}</td>
-						<td class="px-4 py-3">{formatCurrency(spent, currency)}</td>
+						<td class="px-4 py-3 dark:text-white">{formatCurrency(spent, currency)}</td>
-						<td class="px-4 py-3 {remaining < 0 ? 'text-red-600' : ''}">{formatCurrency(remaining, currency)}</td>
+						<td class="px-4 py-3 {remaining < 0 ? 'text-red-600' : 'dark:text-white'}">{formatCurrency(remaining, currency)}</td>
 						<td class="px-4 py-3 w-32">
 							<div class="h-2 w-full overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
 								<div

src/routes/(app)/companies/[companyId]/projects/+page.svelte

@@ -47,7 +47,7 @@
 				<div class="mt-3">
 					<div class="flex justify-between text-sm">
 						<span class="text-gray-500 dark:text-gray-400">Budget</span>
-						<span>{formatCurrency(project.spent, currency)} / {formatCurrency(project.allocatedBudget, currency)}</span>
+						<span class="dark:text-white">{formatCurrency(project.spent, currency)} / {formatCurrency(project.allocatedBudget, currency)}</span>
 					</div>
 					<div class="mt-1 h-2 w-full overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
 						<div

src/routes/(app)/companies/[companyId]/reports/+page.svelte

@@ -64,9 +64,9 @@
 							<div class="flex items-center justify-between text-sm">
 								<div class="flex items-center gap-2">
 									<div class="h-3 w-3 rounded-full" style="background-color: {cat.categoryColor}"></div>
-									<span>{cat.categoryName}</span>
+									<span class="dark:text-white">{cat.categoryName}</span>
 								</div>
-								<span class="font-medium">{formatCurrency(cat.total, currency)}</span>
+								<span class="font-medium dark:text-white">{formatCurrency(cat.total, currency)}</span>
 							</div>
 							<div class="mt-1 h-1.5 w-full overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
 								<div
@@ -93,8 +93,8 @@
 						{@const pct = allocated > 0 ? Math.min((spent / allocated) * 100, 100) : 0}
 						<div>
 							<div class="flex justify-between text-sm">
-								<span class="font-medium">{project.projectName}</span>
+								<span class="font-medium dark:text-white">{project.projectName}</span>
-								<span>
+								<span class="dark:text-white">
 									{formatCurrency(spent, currency)} / {formatCurrency(allocated, currency)}
 								</span>
 							</div>