Update app.py

app.py

@@ -376,6 +376,51 @@ SLEEK_CSS = """
 #chatbot_container .chatbot::-webkit-scrollbar { width: 8px; }
 #chatbot_container .chatbot::-webkit-scrollbar-track { background: #16203b; }
 #chatbot_container .chatbot::-webkit-scrollbar-thumb { background: #3a4a6e; border-radius: 4px; }
+/* ——— CRITICAL FIX: Make Chatbot fill the entire right panel ——— */
+#chatbot_container {
+    flex: 1 1 100% !important;
+    min-height: 0;
+    display: flex !important;
+}
+
+#chatbot_container > .wrap {
+    flex: 1 !important;
+    display: flex !important;
+    flex-direction: column !important;
+}
+
+/* This is the actual scrolling message area */
+#chatbot_container .chatbot {
+    flex: 1 !important;
+    min-height: 0 !important;
+    max-height: none !important;
+    overflow-y: auto !important;
+    overflow-x: hidden !important;
+    padding: 24px !important;
+}
+
+/* Remove Gradio’s default max-height caps */
+#chatbot_container .gr-chatbot,
+#chatbot_container .gr-prose,
+#chatbot_container .message-wrap {
+    max-height: none !important;
+    height: 100% !important;
+}
+
+/* Optional: nicer scrollbar */
+#chatbot_container .chatbot::-webkit-scrollbar {
+    width: 8px;
+}
+#chatbot_container .chatbot::-webkit-scrollbar-track {
+    background: transparent;
+}
+#chatbot_container .chatbot::-webkit-scrollbar-thumb {
+    background: rgba(100, 120, 160, 0.4);
+    border-radius: 4px;
+}
+#chatbot_container .chatbot::-webkit-scrollbar-thumb:hover {
+    background: rgba(100, 120, 160, 0.7);
+}
 """
 
 VOICE_STT_HTML = """