Update app.py

app.py

@@ -1138,11 +1138,11 @@ custom_css = """
 .question-grid {
     display: grid;
     grid-template-columns: 2fr 1fr;
-    gap: 15px;
+    gap: 20px;
     align-items: center;
-    padding: 10px 0;
-    border-bottom: 1px solid #f0f2f5;
-    margin-bottom: 5px;
+    padding: 15px 0;
+    border-bottom: 1px solid #e8ecef;
+    margin-bottom: 10px;
 }
 
 .question-grid:last-child {
@@ -1150,36 +1150,60 @@ custom_css = """
     margin-bottom: 0;
 }
 
+/* IMPROVED TEXT READABILITY */
 .question-text {
-    font-size: 14px;
-    color: #333;
-    line-height: 1.4;
-    margin: 0;
-    padding-right: 15px;
+    font-size: 16px !important;
+    color: #2c3e50 !important;
+    line-height: 1.6 !important;
+    margin: 0 !important;
+    padding-right: 20px !important;
+    font-weight: 500 !important;
+    letter-spacing: 0.3px !important;
 }
 
-/* Dropdown styling */
+.question-text strong {
+    color: #667eea !important;
+    font-weight: 600 !important;
+    font-size: 16px !important;
+}
+
+/* Dropdown styling with better readability */
 .gr-dropdown {
     border-radius: 6px;
-    border: 1px solid #e0e6ed;
+    border: 2px solid #e0e6ed;
     transition: border-color 0.3s ease;
-    font-size: 13px;
+    font-size: 14px !important;
+    font-weight: 500 !important;
+    color: #2c3e50 !important;
 }
 
 .gr-dropdown:focus {
     border-color: #667eea;
-    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.1);
+    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
 }
 
 /* Compact spacing */
 .question-section {
-    margin-bottom: 15px;
+    margin-bottom: 20px;
 }
 
 .question-section:last-child {
     margin-bottom: 0;
 }
 
+/* Better contrast for all text elements */
+.questionnaire-grid h2 {
+    font-size: 24px !important;
+    font-weight: 600 !important;
+    color: #2c3e50 !important;
+}
+
+.questionnaire-grid p {
+    font-size: 16px !important;
+    color: #5a6c7d !important;
+    font-weight: 400 !important;
+}
+
 /* Progress animation */
 @keyframes pulse {
     0% { opacity: 1; }
@@ -1192,7 +1216,7 @@ custom_css = """
 }
 """
 
-# Updated Gradio Interface with Removed Domain Headers
+# Updated Gradio Interface with Better Text Readability
 with gr.Blocks(
     title="🐶 Enhanced AI Dog Health Analyzer", 
     theme=gr.themes.Soft(),
@@ -1278,30 +1302,30 @@ with gr.Blocks(
                 maximum=25
             )
         
-        # Right Column - Compact HRQOL Questionnaire
+        # Right Column - Enhanced Readable HRQOL Questionnaire
         with gr.Column(scale=1):
             gr.HTML("""
             <div class="questionnaire-grid">
-                <h2 style="color: #667eea; margin: 0 0 10px 0; text-align: center;">
+                <h2 style="color: #2c3e50; margin: 0 0 15px 0; text-align: center; font-size: 24px; font-weight: 600;">
                     📋 HRQOL Assessment
                 </h2>
-                <p style="text-align: center; color: #666; font-style: italic; margin-bottom: 20px;">
+                <p style="text-align: center; color: #5a6c7d; font-style: italic; margin-bottom: 25px; font-size: 16px;">
                     Complete all questions for accurate healthspan analysis
                 </p>
             """)
             
             hrqol_inputs = []
             
-            # Create compact grid layout without domain headers
+            # Create compact grid layout with better text readability
             with gr.Group(elem_classes=["question-section"]):
                 for domain_key, domain_data in HRQOL_QUESTIONNAIRE.items():
                     for i, question in enumerate(domain_data["questions"]):
                         with gr.Row():
                             with gr.Column(scale=2):
                                 gr.HTML(f"""
-                                <p class="question-text">
+                                <div class="question-text">
                                     <strong>Q{len(hrqol_inputs)+1}:</strong> {question["text"]}
-                                </p>
+                                </div>
                                 """)
                             with gr.Column(scale=1):
                                 dropdown = gr.Dropdown(