From 8aae7d6dfe63173a20e045c9e1cecec005b367cf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Sat, 9 May 2026 01:24:22 +0200
Subject: [PATCH] fix(dashboard): tile fill + muted-foreground hierarchy
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Two related visual fixes for the dashboard tile strip and every
secondary string in the app:

- TrendCard now fills its grid cell. As a flex-child the card was
  taking content width, which made tiles in the same row 122-166 px
  wide on a 375 px viewport instead of even shares of the row.
  Adding `w-full` to the wrapping `flex` element gives every tile
  the same horizontal share that the parent grid hands out.
- `--muted-foreground` was identical to `--foreground` in both
  themes, so labels, "Ø7d:" prefixes, units, and inactive nav items
  all rendered at the same brightness as primary text. Dark theme
  now uses `#9aa3b3` (Dracula comment), light uses `#5b6273` —
  WCAG-AA contrast against `--background` and `--card` holds at
  ≥ 4.5:1 in both modes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/app/globals.css                  | 4 ++--
 src/components/charts/trend-card.tsx | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/globals.css b/src/app/globals.css
index 568a6aee1..a3c70f988 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -94,7 +94,7 @@
   --secondary: #44475a;
   --secondary-foreground: #f8f8f2;
   --muted: #44475a;
-  --muted-foreground: #f8f8f2;
+  --muted-foreground: #9aa3b3;
   --accent: #44475a;
   --accent-foreground: #f8f8f2;
   --destructive: #ff5555;
@@ -131,7 +131,7 @@
   --secondary: #dcdeef;
   --secondary-foreground: #1f1f1f;
   --muted: #dcdeef;
-  --muted-foreground: #1f1f1f;
+  --muted-foreground: #5b6273;
   --accent: #dcdeef;
   --accent-foreground: #1f1f1f;
   --destructive: #cb3a2a;
diff --git a/src/components/charts/trend-card.tsx b/src/components/charts/trend-card.tsx
index 4ca248a9a..155f5d6e2 100644
--- a/src/components/charts/trend-card.tsx
+++ b/src/components/charts/trend-card.tsx
@@ -82,7 +82,7 @@ export function TrendCard({
   };
 
   return (
-    <div className="bg-card border-border flex h-full flex-col rounded-xl border p-3">
+    <div className="bg-card border-border flex h-full w-full flex-col rounded-xl border p-3">
       <div className="flex items-center justify-between">
         <span className="text-muted-foreground text-sm font-medium">
           {label}