document.addEventListener('DOMContentLoaded', function () {
    feather.replace();

    // Chart 1: Deals Over Time
    const ctx1 = document.getElementById('dealsChart');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'],
                datasets: [{
                    label: 'Completed Deals',
                    data: [65, 59, 80, 81, 56, 55, 40],
                    fill: false,
                    borderColor: 'rgb(0, 123, 255)',
                    tension: 0.1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    }

    // Chart 2: Volume by Currency
    const ctx2 = document.getElementById('volumeChart');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'doughnut',
            data: {
                labels: ['TON', 'BTC (mock)', 'ETH (mock)'],
                datasets: [{
                    label: 'Trade Volume',
                    data: [300, 50, 100],
                    backgroundColor: [
                        'rgb(0, 123, 255)',
                        'rgb(255, 193, 7)',
                        'rgb(108, 117, 125)'
                    ],
                    hoverOffset: 4
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
            }
        });
    }
});