Update app.py

app.py

@@ -66,13 +66,13 @@ header {visibility: hidden;}
 
 .chat-history-wrapper {
     margin-top: 0.5em;
-    padding-bottom: 7em;
+    padding-bottom: 9em; /* enough space so input does not cover messages */
     min-height: 60vh;
 }
 
 .input-bottom-bar {
     position: fixed;
-    bottom: 0;
+    bottom: 3.5em; /* move up for widget space */
     width: 100%;
     background: #191b22;
     padding: 0.5em 0.6em;
@@ -83,16 +83,6 @@ header {visibility: hidden;}
     z-index: 999;
 }
 
-.input-bottom-bar input {
-    width: 100%;
-    font-size: 1.1em;
-    padding: 0.5em;
-    border-radius: 8px;
-    border: 1px solid #333;
-    background: #222;
-    color: #fff;
-}
-
 #clear-chat {
     background: none;
     border: none;
@@ -199,19 +189,14 @@ def synthesize_voice(text, voice_key, user_id):
 # --- CHAT DISPLAY
 display_chat_history()
 
-# --- Input Form (bottom)
-st.markdown("""
-<div class="input-bottom-bar">
-    <div style="flex: 8 1 auto;">
-        <form action="" method="GET">
-            <input type="text" name="user_input" id="user-input" placeholder="Type your message here..." />
-        </form>
-    </div>
-    <div style="flex: 2 0 auto; text-align: center;">
-        <button id="clear-chat" onclick="window.location.href='?clear=1'">🗑️</button>
-    </div>
-</div>
-""", unsafe_allow_html=True)
+# --- Bottom input bar with chat_input() and clear
+with st.container():
+    st.markdown('<div class="input-bottom-bar">', unsafe_allow_html=True)
+    col1, col2 = st.columns([8, 2])
+    user_input = col1.chat_input("Type your message here...")
+    if col2.button("🗑️", help="Clear Chat", key="clear-chat-bottom"):
+        clear_chat_history()
+    st.markdown('</div>', unsafe_allow_html=True)
 
 # --- JS auto-scroll
 st.markdown("""
@@ -223,12 +208,7 @@ window.onload = function() {
 </script>
 """, unsafe_allow_html=True)
 
-# --- Handle clear
-if st.query_params.get("clear") == "1":
-    clear_chat_history()
-
 # --- Handle user input
-user_input = st.query_params.get("user_input")
 if user_input:
     thread_id = get_or_create_thread_id()
     client.beta.threads.messages.create(thread_id=thread_id, role="user", content=user_input)