Update app.py

app.py

@@ -26,24 +26,42 @@ def create_chat_interface():
             chatbot_component = gr.Chatbot(type="messages", label="Chat History", height=500)
 
         with gr.Row():
-            # Textbox for user input
-            with gr.Column(scale=0.9):
-                user_input = gr.Textbox(placeholder="Type your message here...", label="Your Input", lines=1)
-            # Square send button
-            with gr.Column(scale=0.1):
+            # Container for input and send button
+            with gr.Box(elem_id="input_container"):
+                user_input = gr.Textbox(
+                    placeholder="Type your message here...", label=None, lines=1, elem_id="user_input"
+                )
                 send_button = gr.Button("📤", elem_id="send_button")
         
-        # Add CSS to style the send button as a square
+        # Add CSS for styling the input container and placing the button inside
         demo.css = """
+            #input_container {
+                display: flex;
+                align-items: center;
+                border: 1px solid #ccc;
+                border-radius: 8px;
+                padding: 5px;
+            }
+            #user_input {
+                flex-grow: 1;
+                border: none;
+                outline: none;
+                padding: 8px;
+            }
             #send_button {
                 width: 40px;
                 height: 40px;
-                padding: 0;
-                margin: 0;
+                background-color: #007bff;
+                color: white;
+                border: none;
+                border-radius: 50%;
                 display: flex;
                 justify-content: center;
                 align-items: center;
-                border-radius: 5px; /* Optional: For slightly rounded corners */
+                cursor: pointer;
+            }
+            #send_button:hover {
+                background-color: #0056b3;
             }
         """