async function askBot() {
    let query = document.getElementById("query").value;
    if (!query.trim()) return;

    // Show user message
    addMessage(query, "user");

    // Clear input field
    document.getElementById("query").value = "";

    try {
        let res = await fetch("http://127.0.0.1:8000/chat", {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({ query: query })
        });

        let data = await res.json();

        // Show bot response
        addMessage(data.answer, "bot");
    } catch (error) {
        addMessage("⚠️ Unable to reach server. Please try again later.", "bot");
    }
}

function addMessage(text, sender) {
    let chatbox = document.getElementById("chatbox");
    let msg = document.createElement("div");
    msg.classList.add("message", sender);
    // msg.textContent = text;
    msg.innerHTML = marked.parse(text);
    chatbox.appendChild(msg);

    // Auto-scroll to the bottom
    chatbox.scrollTop = chatbox.scrollHeight;
}