Update app.py

app.py

@@ -55,44 +55,9 @@ st.markdown("""
     .stChatMessage[data-testid="stChatMessage-user"] { background: #f0f0f0; color: #000000; }
     .stChatMessage[data-testid="stChatMessage-assistant"] { background: #e3f2fd; color: #000000; }
     .lt-logo { vertical-align: middle; }
-    /* Floating chat input */
-    .floating-input-bar {
-        position: fixed;
-        bottom: 0;
-        left: 50%;
-        transform: translateX(-50%);
-        width: 60vw;
-        min-width: 300px;
-        max-width: 900px;
-        z-index: 1000;
-        background: #fff;
-        border-radius: 1em 1em 0 0;
-        box-shadow: 0 -2px 16px rgba(0,0,0,0.07);
-        padding: 1em 1em 0.7em 1em;
-        display: flex;
-        align-items: center;
-    }
-    .floating-input-bar .chat-input {
-        flex: 1 1 auto;
-        border-radius: 14px;
-        border: 1px solid #d2d2d2;
-        padding: 0.7em 1em;
-        font-size: 1.1em;
-        margin-right: 0.7em;
-    }
-    .floating-input-bar .clear-btn {
-        border: none;
-        background: transparent;
-        font-size: 1.5em;
-        color: #888;
-        cursor: pointer;
-        margin-left: 0.1em;
-        margin-top: 1px;
-        transition: color 0.1s;
-    }
-    .floating-input-bar .clear-btn:hover { color: #e57373; }
-    /* Push main content up above floating bar */
-    .main-chat-area { margin-bottom: 5em; }
+    .fixed-bottom-bar { position: fixed; bottom: 0; left: 0; width: 100vw; background: #181a22; padding: 1.2em 0.5em 0.8em 0.5em; z-index: 9999; box-shadow: 0 -2px 8px rgba(0,0,0,0.06);}
+    .chat-area { margin-bottom: 6.1em; }
+    .st-emotion-cache-1avcm0n { justify-content: flex-end !important; }
     </style>
 """, unsafe_allow_html=True)
 st.markdown("""
@@ -161,7 +126,7 @@ def clear_chat_history():
     st.rerun()
 
 def display_chat_history():
-    st.markdown("<div class='main-chat-area'>", unsafe_allow_html=True)
+    st.markdown("<div class='chat-area'>", unsafe_allow_html=True)
     messages = db.collection("users").document(user_id).collection("messages").order_by("timestamp").stream()
     assistant_icon_html = "<img src='https://raw.githubusercontent.com/AndrewLORTech/lortechwebsite/main/lorain.jpg' width='24' style='vertical-align:middle; border-radius:50%;'/>"
     for msg in list(messages)[::-1]:
@@ -201,44 +166,12 @@ def synthesize_voice(text, voice_key, user_id):
 thread_id = get_or_create_thread_id()
 display_chat_history()
 
-# --- Floating Chat Input Bar & Clear Button ---
-st.markdown("""
-<div class="floating-input-bar">
-    <form action="" method="POST" id="lorain_input_form" style="width:100%;display:flex;">
-        <input id="lorain_user_input" class="chat-input" name="lorain_user_input" type="text" placeholder="Type your message here..." autocomplete="off" autofocus />
-        <button class="clear-btn" type="submit" name="clear_chat" title="Clear chat">&#128465;</button>
-    </form>
-    <script>
-    // Auto-focus and scroll to bottom on new message
-    let chatbox = document.getElementById("chatbox");
-    if (chatbox) chatbox.scrollTop = chatbox.scrollHeight;
-    </script>
-</div>
-""", unsafe_allow_html=True)
-
-# --- Handle Chat Input/Clear POST ---
-import streamlit.web.server.websocket_headers
-from urllib.parse import parse_qs
-
-# Use query params to emulate form submission state (for Streamlit stateless-ness)
-query_params = st.experimental_get_query_params()
-import streamlit.runtime.scriptrunner.script_run_context as sctx
-ctx = sctx.get_script_run_ctx()
-form_data = {}
-if ctx and hasattr(ctx, 'request'):
-    content_length = ctx.request.headers.get('content-length')
-    if content_length:
-        body = ctx.request.rfile.read(int(content_length)).decode()
-        form_data = parse_qs(body)
-
-# Detect clear chat
-if form_data.get("clear_chat"):
-    clear_chat_history()
-
-# Detect user input
-user_input = ""
-if form_data.get("lorain_user_input"):
-    user_input = form_data.get("lorain_user_input")[0].strip()
+# --- Fixed bottom bar: input + clear chat ---
+with st.container():
+    cols = st.columns([10, 1])
+    user_input = cols[0].chat_input("Type your message here...")
+    if cols[1].button("🗑️", help="Clear Chat"):
+        clear_chat_history()
 
 if user_input:
     # --- OpenAI Assistant Response ---