document.addEventListener('DOMContentLoaded', () => {
    const itemForm = document.getElementById('item-form');
    const estimateItems = document.getElementById('estimate-items');
    const subtotalEl = document.getElementById('subtotal');
    const taxEl = document.getElementById('tax');
    const totalEl = document.getElementById('total');
    const printBtn = document.getElementById('print-btn');
    const emptyState = document.getElementById('empty-state');

    let items = [];

    const updateTotals = () => {
        const subtotal = items.reduce((acc, item) => acc + item.total, 0);
        const tax = subtotal * 0.10;
        const total = subtotal + tax;

        subtotalEl.textContent = `$${subtotal.toFixed(2)}`;
        taxEl.textContent = `$${tax.toFixed(2)}`;
        totalEl.textContent = `$${total.toFixed(2)}`;
        
        if (items.length > 0) {
            emptyState.style.display = 'none';
        } else {
            emptyState.style.display = 'block';
        }
    };

    const renderItems = () => {
        estimateItems.innerHTML = '';
        items.forEach((item, index) => {
            const tr = document.createElement('tr');
            tr.innerHTML = `
                <td>${item.description}</td>
                <td class="text-end">${item.quantity}</td>
                <td class="text-end">$${item.price.toFixed(2)}</td>
                <td class="text-end fw-bold">$${item.total.toFixed(2)}</td>
                <td class="text-center">
                    <button class="btn btn-sm btn-outline-danger remove-btn" data-index="${index}">
                        <i class="bi bi-trash"></i>
                    </button>
                </td>
            `;
            estimateItems.appendChild(tr);
        });
        updateTotals();
    };

    itemForm.addEventListener('submit', (e) => {
        e.preventDefault();
        const description = document.getElementById('item-description').value;
        const quantity = parseInt(document.getElementById('item-quantity').value);
        const price = parseFloat(document.getElementById('item-price').value);

        if (description && quantity > 0 && price > 0) {
            const newItem = {
                description,
                quantity,
                price,
                total: quantity * price
            };
            items.push(newItem);
            renderItems();
            itemForm.reset();
        }
    });

    estimateItems.addEventListener('click', (e) => {
        if (e.target.classList.contains('remove-btn') || e.target.closest('.remove-btn')) {
            const button = e.target.closest('.remove-btn');
            const index = parseInt(button.dataset.index);
            items.splice(index, 1);
            renderItems();
        }
    });

    printBtn.addEventListener('click', () => {
        window.print();
    });
    
    updateTotals();
});