document.addEventListener('DOMContentLoaded', () => {
    const chatWidgetButton = document.getElementById('chat-widget-button');
    const chatWidget = document.getElementById('chat-widget');
    const chatCloseButton = document.getElementById('chat-close-button');
    const chatForm = document.getElementById('chat-form');
    const chatBody = document.getElementById('chat-body');
    const chatInput = document.getElementById('chat-input');

    chatWidgetButton.addEventListener('click', () => {
        chatWidget.style.display = 'flex';
        chatWidgetButton.style.display = 'none';
    });

    chatCloseButton.addEventListener('click', () => {
        chatWidget.style.display = 'none';
        chatWidgetButton.style.display = 'block';
    });

    chatForm.addEventListener('submit', (e) => {
        e.preventDefault();
        const userInput = chatInput.value.trim();
        if (userInput === '') return;

        addMessage(userInput, 'user');
        chatInput.value = '';

        setTimeout(() => {
            const botResponse = getBotResponse(userInput);
            addMessage(botResponse, 'bot');
        }, 500);
    });

    function addMessage(text, sender) {
        const messageElement = document.createElement('div');
        messageElement.classList.add('chat-message', `${sender}-message`);
        messageElement.textContent = text;
        chatBody.appendChild(messageElement);
        chatBody.scrollTop = chatBody.scrollHeight;
    }

    function getBotResponse(userInput) {
        const lowerInput = userInput.toLowerCase();
        if (lowerInput.includes('hello') || lowerInput.includes('hi')) {
            return 'Hello there! How can I help you today?';
        } else if (lowerInput.includes('help')) {
            return 'I can answer simple questions. Try asking me about pricing or features.';
        } else if (lowerInput.includes('pricing')) {
            return 'Our pricing is very competitive. Please visit our pricing page for more details.';
        } else if (lowerInput.includes('feature')) {
            return 'We have a wide range of features to meet your needs.';
        } else {
            return "I'm sorry, I don't understand. Can you please rephrase?";
        }
    }
});