Update app.py

app.py

@@ -76,26 +76,27 @@ header {visibility: hidden;}
     width: 100%;
     background: #191b22;
     padding: 0.5em 0.6em;
-    display: block;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
     border-top: 1px solid #22232c;
     z-index: 999;
 }
 
-.stChatInputContainer {
-    position: relative;
+.input-bottom-bar .left {
+    flex-grow: 1;
+}
+
+.input-bottom-bar .right {
+    margin-left: 0.5em;
 }
 
 .clear-chat-btn {
-    position: absolute;
-    right: 3em;
-    top: 50%;
-    transform: translateY(-50%);
     font-size: 1.4em;
     color: #ccc;
     background: none;
     border: none;
     cursor: pointer;
-    z-index: 1000;
 }
 </style>
 """, unsafe_allow_html=True)
@@ -196,16 +197,18 @@ def synthesize_voice(text, voice_key, user_id):
 # --- CHAT DISPLAY
 display_chat_history()
 
-# --- Bottom input bar with chat_input() and inline clear
+# --- Bottom input bar with chat_input() and clear button (Option 1)
 with st.container():
     st.markdown('<div class="input-bottom-bar">', unsafe_allow_html=True)
     
+    st.markdown('<div class="left">', unsafe_allow_html=True)
     user_input = st.chat_input("Type your message here...")
+    st.markdown('</div>', unsafe_allow_html=True)
     
-    # Inject clear button
-    st.markdown("""
-    <button class="clear-chat-btn" onclick="window.location.href='?clear=1'">🗑️</button>
-    """, unsafe_allow_html=True)
+    st.markdown('<div class="right">', unsafe_allow_html=True)
+    if st.button("🗑️", help="Clear Chat", key="clear-chat-bottom"):
+        clear_chat_history()
+    st.markdown('</div>', unsafe_allow_html=True)
     
     st.markdown('</div>', unsafe_allow_html=True)
 
@@ -219,10 +222,6 @@ window.onload = function() {
 </script>
 """, unsafe_allow_html=True)
 
-# --- Handle clear
-if st.query_params.get("clear") == "1":
-    clear_chat_history()
-
 # --- Handle user input
 if user_input:
     thread_id = get_or_create_thread_id()