<script>
    var inputMessage = document.getElementById("inputMessage");
    var sendMessage = document.getElementById("sendMessage");
    var chatbox = document.getElementById("chatbox");

    sendMessage.addEventListener("click", function() {
        var message = inputMessage.value;
        if (message.trim() !== "") {
            sendMessageToChat(message, "user");
            inputMessage.value = "";
            sendMessageToChat("Sorry, the chatbot is unavailable at the moment. Please try again later.", "assistant"); 
        }
    });

    function sendMessageToChat(message, role) {
        var messageElement = document.createElement("div");
        messageElement.classList.add("chat-bubble", role === "user" ? "chat-bubble-primary" : "chat-bubble-secondary");
        messageElement.innerHTML = "<p><strong>" + role + ":</strong> " + message + "</p>";
        chatbox.appendChild(messageElement);
        chatbox.scrollTop = chatbox.scrollHeight;
    }
</script>