document.addEventListener('DOMContentLoaded', function() {
    const chatIcon = document.querySelector('.chat-icon');
    const chatWindow = document.querySelector('.chat-window');
    const closeChat = document.querySelector('.close-chat');
    const chatInput = document.querySelector('.chat-input input');
    const sendButton = document.querySelector('.chat-input button');
    const messageContainer = document.querySelector('.message-container');

    if (chatIcon) {
        chatIcon.addEventListener('click', () => {
            chatWindow.classList.toggle('show');
        });
    }

    if (closeChat) {
        closeChat.addEventListener('click', () => {
            chatWindow.classList.remove('show');
        });
    }

    const sendMessage = () => {
        const messageText = chatInput.value.trim();
        if (messageText === '') return;

        appendMessage(messageText, 'sent');
        chatInput.value = '';

        // Simulate a response from the AI
        setTimeout(() => {
            appendMessage('I am a demo bot. I will be able to help you soon.', 'received');
        }, 1000);
    };

    const appendMessage = (text, type) => {
        const messageDiv = document.createElement('div');
        messageDiv.classList.add('message', type);
        messageDiv.textContent = text;
        messageContainer.appendChild(messageDiv);
        messageContainer.scrollTop = messageContainer.scrollHeight;
    };

    if (sendButton) {
        sendButton.addEventListener('click', sendMessage);
    }

    if (chatInput) {
        chatInput.addEventListener('keypress', (e) => {
            if (e.key === 'Enter') {
                sendMessage();
            }
        });
    }
});