Update style.css

style.css

@@ -1,20 +1,15 @@
 /* Clinically Healthcare UI Design Kit Styles (Gradio-Optimized) */
 :root {
-    /* Stronger, less washed-out palette */
     --primary-indigo: #4338CA;
     --secondary-cyan: #0891B2;
 
-    /* Neutral background tuned for UI layering */
     --bg-cream: #F8FAFC;
 
-    /* Stronger borders to survive Gradio tinting */
     --border-soft: #CBD5E1;
 
-    /* High-contrast text */
     --text-slate: #0F172A;
     --text-muted: #334155;
 
-    /* More vivid semantic colors */
     --success-green: #059669;
     --warning-amber: #D97706;
     --danger-red: #DC2626;
@@ -140,7 +135,7 @@
     border-bottom: 2px solid var(--border-soft);
 }
 
-/* Optional: improve Gradio component blending */
+/* Inputs */
 input, textarea, select {
     border-color: var(--border-soft) !important;
     color: var(--text-slate);
@@ -149,4 +144,42 @@ input, textarea, select {
 input:focus, textarea:focus, select:focus {
     border-color: var(--primary-indigo) !important;
     box-shadow: 0 0 0 3px rgba(67, 56, 202, 0.15) !important;
+}
+
+/* =========================================================
+   🔥 GRADIO OVERRIDE ENFORCER LAYER (IMPORTANT PART)
+   ========================================================= */
+
+/* 1. Hard reset Gradio container interference */
+.gradio-container {
+    background: var(--bg-cream) !important;
+}
+
+/* 2. FORCE header styling (highest practical CSS specificity) */
+body .gradio-container div.header-box,
+html body .gradio-container div.header-box,
+div.gradio-container div.header-box {
+    background: #0B1F3B !important; /* deep navy override */
+    color: #FFFFFF !important;
+    border-bottom: 4px solid var(--primary-indigo) !important;
+    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
+}
+
+/* 3. Force all text inside header */
+body .gradio-container .header-box * {
+    color: #FFFFFF !important;
+}
+
+/* 4. Kill any theme pseudo overlays */
+.header-box::before,
+.header-box::after {
+    background: transparent !important;
+    content: none !important;
+}
+
+/* 5. Prevent Gradio theme bleed on blocks */
+.gr-block,
+.gr-box,
+.gr-panel {
+    background: transparent !important;
 }