From 011c71a3ad3e391f0cd0c911177c8b7f8262849b Mon Sep 17 00:00:00 2001
From: Khalid Abdi <xamza2009@gmail.com>
Date: Mon, 1 Jun 2026 19:28:54 +0300
Subject: [PATCH] Lighter content panel (Polar look), equal-height cards, hide
 card scrollbar

- globals.css: lighten --background (content panel) and deepen --sidebar so
  the panel reads as a lighter neutral charcoal floating on a near-black rail,
  matching the Polar reference. Pure lightness change; panel stays below
  --card so cards still pop.
- patient-cards.tsx: row uses items-stretch so all cards share one height
  (no more ragged/taller cards); add no-scrollbar to hide the horizontal
  scrollbar while keeping scroll.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 frontend/app/globals.css                   | 4 ++--
 frontend/components/chat/patient-cards.tsx | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/app/globals.css b/frontend/app/globals.css
index 56a432a..a32a305 100644
--- a/frontend/app/globals.css
+++ b/frontend/app/globals.css
@@ -85,7 +85,7 @@
 
 /* Linear-inspired dark palette: near-black canvas, #5e6ad2 indigo accent, hairline borders. */
 .dark {
-  --background: oklch(0.146 0.005 277);
+  --background: oklch(0.172 0.004 277);
   --foreground: oklch(0.98 0.002 277);
   --card: oklch(0.193 0.005 277);
   --card-foreground: oklch(0.98 0.002 277);
@@ -108,7 +108,7 @@
   --chart-3: oklch(0.546 0.245 262.881);
   --chart-4: oklch(0.488 0.243 264.376);
   --chart-5: oklch(0.424 0.199 265.638);
-  --sidebar: oklch(0.165 0.005 277);
+  --sidebar: oklch(0.138 0.004 277);
   --sidebar-foreground: oklch(0.98 0.002 277);
   --sidebar-primary: oklch(0.556 0.155 277);
   --sidebar-primary-foreground: oklch(0.985 0.001 277);
diff --git a/frontend/components/chat/patient-cards.tsx b/frontend/components/chat/patient-cards.tsx
index 70c837b..a70465d 100644
--- a/frontend/components/chat/patient-cards.tsx
+++ b/frontend/components/chat/patient-cards.tsx
@@ -266,7 +266,7 @@ export function PatientResult({ status, fileNumber, patient }: PatientResultProp
   }
 
   return (
-    <div className="flex w-full snap-x items-start gap-4 overflow-x-auto pb-2">
+    <div className="no-scrollbar flex w-full snap-x items-stretch gap-4 overflow-x-auto pb-2">
       {status === "loading" || !patient ? (
         <LoadingCards />
       ) : (