Update app.py

app.py

@@ -178,18 +178,10 @@ def clear_chat():
 
 # Gradio Interface
 with gr.Blocks(theme=gr.themes.Soft()) as iface:
-    gr.HTML("""
-        <div style="display: flex; justify-content: center; align-items: center; margin: 20px 0; padding: 20px; gap: 20px;">
-            <div style="background-color: #f0f0f0; border-radius: 50%; padding: 10px; width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);">
-                <img src="./Image.jpg" alt="Mawared Logo" style="width: 80px; height: 80px; border-radius: 50%; object-fit: cover;">
-            </div>
-            <div style="display: flex; flex-direction: column;">
-                <h1 style="margin: 0; font-size: 2.5em; color: #2d2d2d;">Mawared HR</h1>
-                <p style="margin: 5px 0 0 0; color: #666; font-size: 1.2em;">AI Assistant</p>
-            </div>
-        </div>
-        <div style="width: 100%; height: 2px; background: linear-gradient(to right, #e0e0e0, #666, #e0e0e0); margin: 0 0 20px 0;"></div>
-    """)
+    with gr.Row(elem_id="header-row"):
+        with gr.Column(scale=1):
+            gr.Image("Image.jpg", show_label=False, container=False, height=80, width=80, image_mode="RGBA", shape=(80, 80))
+        with gr.Column(scale=3):
     gr.Markdown("# Mawared HR Assistant")
     gr.Markdown("Ask questions about the Mawared HR system, and this assistant will provide answers based on the available context and conversation history.")