Update app.py

app.py

@@ -249,18 +249,34 @@ with gr.Blocks(title="Backend-Focused LLaMA/Mistral CRUD Assistant", theme=gr.th
     # --- Custom CSS ---
     gr.HTML("""
     <style>
-    /* Chat scroll */
-    .gr-chatbot { max-height: 500px !important; overflow-y: auto !important; }
-    /* Compact left panel */
-    .compact-sliders .gr-slider, .compact-sliders .gr-number { margin-bottom:0.5rem !important; font-size:0.9rem;}
-    .system-message-compact .gr-textarea { min-height:80px !important; max-height:120px !important; font-size:0.9rem; }
-    /* Action buttons compact */
-    #session-actions-row .gr-button { margin-right: 6px; margin-bottom:3px; font-size:0.9rem;}
-    /* Input + buttons row */
-    .user-input-row .gr-textbox, .user-input-row .gr-button { margin:0 !important; padding:0.4rem 0.6rem !important; }
+    /* Make all side-panel section headings smaller and tighter */
+    .compact-heading h3 {
+        font-size: 0.9rem !important;
+        font-weight: 600 !important;
+        margin: 0.3rem 0 !important;
+        padding: 0 !important;
+    }
+    
+    /* General markdown at top title smaller */
+    .main-title h2 {
+        font-size: 1.2rem !important;
+        font-weight: 700 !important;
+        margin-bottom: 0.6rem !important;
+    }
+    
+    /* Reduce spacing below sliders and dropdowns */
+    .compact-sliders .gr-slider,
+    .compact-sliders .gr-number,
+    .compact-sliders .gr-dropdown {
+        margin-bottom: 0.4rem !important;
+    }
+    
+    /* Compact the overall column */
+    .left-panel .gr-column {
+        gap: 0.3rem !important;
+    }
     </style>
     """)
-
     # gr.Markdown("## 🗄️ LLaMA & Mistral Backend-Focused CRUD Automation — Persistent History")
 
     with gr.Row(equal_height=True):
@@ -276,15 +292,15 @@ with gr.Blocks(title="Backend-Focused LLaMA/Mistral CRUD Assistant", theme=gr.th
             edit_title_box = gr.Textbox(label="Edit Chat Name", placeholder="Type new chat name…", visible=False)
 
             # Model selection
-            gr.Markdown("### 🤖 Model Selection")
+            gr.Markdown("### 🤖 Model Selection" ,elem_classes="compact-heading")
             model_choice = gr.Dropdown(choices=list(MODELS.keys()), value=list(MODELS.keys())[0], label="Choose a model", interactive=True)
 
             # Dataset selection
-            gr.Markdown("### 📚 Dataset Selection")
+            gr.Markdown("### 📚 Dataset Selection" ,elem_classes="compact-heading")
             dataset_choice = gr.Dropdown(choices=DATASETS, value=DATASETS[0], label="Select a dataset", interactive=True)
 
             # Generation settings
-            gr.Markdown("### ⚙️ Generation Settings")
+            gr.Markdown("### ⚙️ Generation Settings" ,elem_classes="compact-heading")
             with gr.Group(elem_classes="system-message-compact"):
                 system_box = gr.Textbox(value=SYSTEM_DEFAULT, label="System message", lines=3)
             with gr.Group(elem_classes="compact-sliders"):