Update backend/templates/base.html (#1)

- Update backend/templates/base.html (4adc8e7fd46f85a32adcc677e6970e0919121167)


Co-authored-by: Nour Shaito <[email protected]>

backend/templates/base.html

@@ -775,6 +775,70 @@
 
         {% block content %}{% endblock %}
     </div>
+  
+#CHATBOT START
+<!-- Chatbot Toggle Button -->
+<div id="chatbot-toggle" onclick="toggleChatbot()">💬 Chat</div>
+
+<!-- Chatbox Popup -->
+<div id="chatbot-box">
+  <div id="chat-header">LUNA AI</div>
+  <div id="chat-messages"></div>
+  <input id="chat-input" type="text" placeholder="Ask me anything..." onkeydown="sendChat(event)">
+</div>
+
+<style>
+  #chatbot-toggle {
+    position: fixed;
+    bottom: 20px;
+    right: 20px;
+    background-color: #4caf50;
+    color: white;
+    padding: 12px 15px;
+    border-radius: 30px;
+    cursor: pointer;
+    z-index: 1000;
+  }
+
+  #chatbot-box {
+    position: fixed;
+    bottom: 80px;
+    right: 20px;
+    width: 300px;
+    height: 400px;
+    background: white;
+    border: 2px solid #ccc;
+    border-radius: 10px;
+    display: none;
+    flex-direction: column;
+    z-index: 1000;
+  }
+
+  #chat-header {
+    background-color: #4caf50;
+    color: white;
+    padding: 10px;
+    text-align: center;
+    font-weight: bold;
+  }
+
+  #chat-messages {
+    flex: 1;
+    padding: 10px;
+    overflow-y: auto;
+    max-height: 300px;
+  }
+
+  #chat-input {
+    border: none;
+    border-top: 1px solid #ccc;
+    padding: 10px;
+    width: 100%;
+    box-sizing: border-box;
+  }
+</style>
+
+#CHATBOT END  
 </main>
 
 <footer>