Upload folder using huggingface_hub

deep_research.py

@@ -352,27 +352,44 @@ button[variant="secondary"]:hover {
     border-color: #9ca3af !important;
 }
 
-/* Simple section styling */
+/* Theme-adaptive section styling */
 .clarification-section {
-    background-color: #374151 !important;
-    border: 2px solid #4b5563 !important;
+    border: 2px solid var(--border-color-primary, #e5e7eb) !important;
     border-radius: 12px !important;
     padding: 20px !important;
     margin: 16px 0 !important;
-    color: #ffffff !important;
+    background-color: var(--background-fill-secondary, #f8fafc) !important;
+    color: var(--body-text-color, #374151) !important;
 }
 
 .clarification-section * {
-    color: #ffffff !important;
+    color: inherit !important;
 }
 
 .clarification-section h1, 
 .clarification-section h2, 
 .clarification-section h3 {
-    color: #ffffff !important;
+    color: inherit !important;
     font-weight: 600 !important;
 }
 
+/* Dark theme specific styles for clarification section */
+.gradio-container.dark .clarification-section {
+    background-color: #374151 !important;
+    border-color: #4b5563 !important;
+    color: #ffffff !important;
+}
+
+.gradio-container.dark .clarification-section * {
+    color: #ffffff !important;
+}
+
+.gradio-container.dark .clarification-section h1,
+.gradio-container.dark .clarification-section h2,
+.gradio-container.dark .clarification-section h3 {
+    color: #ffffff !important;
+}
+
 /* Clean answer box */
 .answer-textbox {
     background-color: #4b5563 !important;
@@ -422,19 +439,30 @@ button[variant="secondary"]:hover {
     opacity: 0.9 !important;
 }
 
-/* Results display with better contrast */
+/* Theme-adaptive results display */
 .results-display {
-    background-color: #374151 !important;
-    border: 2px solid #4b5563 !important;
+    border: 2px solid var(--border-color-primary, #e5e7eb) !important;
     border-radius: 8px !important;
     padding: 16px !important;
     margin: 12px 0 !important;
-    color: #ffffff !important;
     line-height: 1.6 !important;
+    background-color: var(--background-fill-secondary, #f8fafc) !important;
+    color: var(--body-text-color, #374151) !important;
 }
 
-/* Make sure markdown in results display also has white text */
+/* Make sure markdown in results display adapts to theme */
 .results-display * {
+    color: inherit !important;
+}
+
+/* Dark theme specific styles */
+.gradio-container.dark .results-display {
+    background-color: #374151 !important;
+    border-color: #4b5563 !important;
+    color: #ffffff !important;
+}
+
+.gradio-container.dark .results-display * {
     color: #ffffff !important;
 }
 
@@ -471,12 +499,38 @@ button[variant="secondary"]:hover {
     font-weight: 500 !important;
 }
 
-/* Simple headers */
+/* Theme-adaptive headers */
 h1, h2, h3 {
-    color: #ffffff !important;
+    color: var(--body-text-color) !important;
     font-weight: 600 !important;
 }
 
+/* Fallback for when CSS variables aren't available */
+@media (prefers-color-scheme: dark) {
+    h1, h2, h3 {
+        color: #ffffff !important;
+    }
+}
+
+@media (prefers-color-scheme: light) {
+    h1, h2, h3 {
+        color: #1f2937 !important;
+    }
+}
+
+/* Specific overrides for Gradio themes */
+.gradio-container.dark h1,
+.gradio-container.dark h2,
+.gradio-container.dark h3 {
+    color: #ffffff !important;
+}
+
+.gradio-container.light h1,
+.gradio-container.light h2,
+.gradio-container.light h3 {
+    color: #1f2937 !important;
+}
+
 /* Remove unnecessary gradients and shadows for simplicity */
 * {
     box-shadow: none !important;