Update app.py

app.py

@@ -6,7 +6,7 @@ from groq import Groq
 api_key = os.environ.get("GROQ_API_KEY")
 client = Groq(api_key=api_key)
 
-# 2. Updated Responsive UI Styling
+# 2. UI Styling with Scrolling Input Fix
 custom_css = """
 .gradio-container { max-height: 100vh !important; overflow: hidden !important; }
 #chatbot-window { 
@@ -15,11 +15,18 @@ custom_css = """
      border: 1px solid #e0e0e0; 
      background: white; 
 }
-/* This fix forces the System Prompt to scroll instead of expanding */
+
+/* Fix for System Prompt scrolling */
 #system-prompt-container textarea {
     max-height: 150px !important;
     overflow-y: auto !important;
 }
+
+/* Fix for Chat Input scrolling */
+.scroll-input textarea {
+    max-height: 100px !important;
+    overflow-y: auto !important;
+}
 """
 
 # 3. Secure Chat Logic
@@ -53,7 +60,13 @@ with gr.Blocks() as demo:
         with gr.Column(scale=4):
             chatbot = gr.Chatbot(elem_id="chatbot-window") 
             with gr.Row():
-                msg_input = gr.Textbox(placeholder="Ask me anything...", container=False, scale=9)
+                # ADDED elem_classes here to enable scrolling
+                msg_input = gr.Textbox(
+                    placeholder="Ask me anything...", 
+                    container=False, 
+                    scale=9,
+                    elem_classes="scroll-input"
+                )
                 submit_btn = gr.Button("Send", variant="primary", scale=1)
         
         with gr.Column(scale=1):
@@ -64,7 +77,6 @@ with gr.Blocks() as demo:
             )
             temp = gr.Slider(0.0, 1.0, 0.7, label="Temperature")
             
-            # ADDED elem_id here to link with the CSS fix
             sys_msg = gr.Textbox(
                 value="You are a professional assistant.", 
                 label="System Prompt",