feat: enhance global styles and component themes with new semantic colors; integrate ThemeProvider for improved theme management and update color usage across various components for consistency

components/statistics/top-expenses-list.tsx

@@ -45,7 +45,7 @@ export function TopExpensesList({
                       <p className="font-medium text-xs md:text-sm truncate flex-1">
                         {expense.description}
                       </p>
-                      <div className="text-red-600 font-semibold tabular-nums text-xs md:text-sm shrink-0">
+                      <div className="text-destructive font-semibold tabular-nums text-xs md:text-sm shrink-0">
                         {formatCurrency(expense.amount)}
                       </div>
                     </div>