Update app.py

app.py

@@ -1,52 +1,34 @@
 import gradio as gr
 import os
-from src.assets import custom_css
 
-# Additional CSS to override remote Space styling
-override_css = custom_css + """
-/* Force override remote Space styling with higher specificity */
-div.gradio-container .gradio-dataframe th,
-div.gradio-container div.gradio-dataframe th,
-.gr-box .gradio-dataframe th,
-.gr-form .gradio-dataframe th,
-body .gradio-dataframe th,
-html .gradio-dataframe th {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
-    color: white !important;
-    font-weight: 600 !important;
-    border: 1px solid rgba(255,255,255,0.2) !important;
+# CSS to change orange UI elements to blue
+blue_ui_css = """
+/* Change orange checkboxes and radio buttons to blue */
+.gradio-container input[type="checkbox"]:checked,
+.gradio-container .gr-checkbox input:checked + .checkmark,
+.gradio-container .gr-checkboxgroup input:checked + .checkmark {
+    background-color: #667eea !important;
+    border-color: #667eea !important;
 }
 
-/* Override hover effects */
-div.gradio-container .gradio-dataframe th:hover,
-div.gradio-container div.gradio-dataframe th:hover,
-.gr-box .gradio-dataframe th:hover,
-body .gradio-dataframe th:hover {
-    background: linear-gradient(135deg, #5a6fd8 0%, #6b4190 100%) !important;
-    transform: translateY(-1px) !important;
-    box-shadow: 0 3px 6px rgba(0,0,0,0.15) !important;
+.gradio-container input[type="radio"]:checked,
+.gradio-container .gr-radio input:checked + .checkmark,
+.gradio-container .gr-radio input:checked::before {
+    background-color: #667eea !important;
+    border-color: #667eea !important;
 }
 
-/* Override table row hover */
-div.gradio-container .gradio-dataframe tbody tr:hover,
-body .gradio-dataframe tbody tr:hover {
-    background-color: #e3f2fd !important;
+/* Override any orange accent colors */
+.gradio-container .gr-checkbox input:checked,
+.gradio-container .gr-checkboxgroup input:checked,
+.gradio-container .gr-radio input:checked {
+    accent-color: #667eea !important;
 }
 
-/* Additional React table styling overrides */
-.leaderboard-table-container .header-cell,
-.leaderboard-table .header-cell,
-div .header-cell,
-body .header-cell {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
-    color: white !important;
-}
-
-.leaderboard-table-container .header-cell:hover,
-.leaderboard-table .header-cell:hover,
-div .header-cell:hover,
-body .header-cell:hover {
-    background: linear-gradient(135deg, #5a6fd8 0%, #6b4190 100%) !important;
+/* Target specific Gradio checkbox styling */
+.gradio-container label input[type="checkbox"]:checked::before,
+.gradio-container label input[type="radio"]:checked::before {
+    background-color: #667eea !important;
 }
 """
 
@@ -72,7 +54,7 @@ except Exception as e:
     load_error = str(e)
     print(f"[ERROR] Failed to load remote Space: {load_error}")
 
-with gr.Blocks(css=override_css) as demo:
+with gr.Blocks(css=blue_ui_css) as demo:
     if remote_space is not None:
         remote_space.render()
     else: