// =============================================================================
// TOASTS — feedback visual flutuante para resultados de ações
// =============================================================================
function imzToast(message, type) {
    type = type || 'success';
    var container = document.getElementById('imz-toast-container');
    if (!container) {
        container = document.createElement('div');
        container.id = 'imz-toast-container';
        container.setAttribute('role', 'status');
        container.setAttribute('aria-live', 'polite');
        document.body.appendChild(container);
    }
    var toast = document.createElement('div');
    toast.className = 'imz-toast imz-toast-' + type;
    toast.textContent = message;
    container.appendChild(toast);
    requestAnimationFrame(function () { toast.classList.add('visible'); });
    setTimeout(function () {
        toast.classList.remove('visible');
        setTimeout(function () { toast.remove(); }, 300);
    }, 4000);
}

document.addEventListener('DOMContentLoaded', function () {
    const dashboard = document.querySelector('.artist-dashboard');
    if (!dashboard) return;

    // --- LÓGICA DE ACORDEÃO (CORRIGIDA E MAIS ESPECÍFICA) ---
    dashboard.addEventListener('click', function(e) {
        // Encontra o elemento clicável mais próximo (cabeçalho do acordeão/item)
        const clickTarget = e.target.closest('.imz-manage-button');
        if (!clickTarget) return;

        // Encontra o item pai (seja um acordeão principal, item de música, ou item de takedown)
        const parentItem = clickTarget.closest('.imz-music-item, .imz-takedown-item, .imz-dashboard-section-accordion');
        if (!parentItem) return;

        let settingsPanel;

        // Determina qual o painel de conteúdo a abrir/fechar com base no tipo de item pai
        if (parentItem.classList.contains('imz-dashboard-section-accordion')) {
            // É um acordeão principal (ex: "Proteção Digital", "Vendas de Músicas")
            settingsPanel = parentItem.querySelector(':scope > .imz-section-content');
        } else if (parentItem.classList.contains('imz-music-item')) {
            // É um item de música (dentro do "Gestor de Músicas")
             // OU um item de pedido de compra (dentro de "Vendas de Músicas")
            settingsPanel = parentItem.querySelector(':scope > .imz-music-item-settings');
        } else if (parentItem.classList.contains('imz-takedown-item')) {
            // É um item de takedown (dentro da "Proteção Digital") - Embora não esteja no PHP atual, a lógica JS suporta
            settingsPanel = parentItem.querySelector(':scope > .imz-takedown-item-details');
        }

        // Se não encontrar um painel de conteúdo, regista um erro e sai
        if (!settingsPanel) {
            console.error('Painel de conteúdo do acordeão não encontrado para:', parentItem);
            return;
        }

        const isOpen = settingsPanel.classList.contains('open');

        // Alterna a classe 'active' no cabeçalho clicado e o estado de acessibilidade
        clickTarget.classList.toggle('active', !isOpen);
        clickTarget.setAttribute('aria-expanded', String(!isOpen));

        if (isOpen) {
            // Fechar: parte da altura atual (que pode estar em 'none') para 0
            settingsPanel.style.maxHeight = settingsPanel.scrollHeight + 'px';
            void settingsPanel.offsetHeight; // força reflow para a transição arrancar da altura atual
            settingsPanel.classList.remove('open');
            settingsPanel.style.maxHeight = '';
        } else {
            // Abrir: anima até à altura do conteúdo e depois liberta (max-height: none),
            // para que conteúdo dinâmico (ex: acordeões aninhados) cresça sem cortar
            settingsPanel.classList.add('open');
            settingsPanel.style.maxHeight = settingsPanel.scrollHeight + 'px';
            settingsPanel.addEventListener('transitionend', function handler(ev) {
                if (ev.target !== settingsPanel || ev.propertyName !== 'max-height') return;
                settingsPanel.removeEventListener('transitionend', handler);
                if (settingsPanel.classList.contains('open')) {
                    settingsPanel.style.maxHeight = 'none';
                }
            });
            // Se o painel contém o gráfico, força um resize quando fica visível
            if (settingsPanel.querySelector('#imz-activity-chart')) {
                setTimeout(function () { window.dispatchEvent(new Event('resize')); }, 450);
            }
        }
    });

    // Estado inicial de acessibilidade dos acordeões
    dashboard.querySelectorAll('.imz-manage-button').forEach(function (btn, i) {
        const parentItem = btn.closest('.imz-music-item, .imz-takedown-item, .imz-dashboard-section-accordion');
        if (!parentItem) return;
        const panel = parentItem.querySelector(':scope > .imz-section-content, :scope > .imz-music-item-settings, :scope > .imz-takedown-item-details');
        if (!panel) return;
        if (!panel.id) panel.id = 'imz-acc-panel-' + i;
        btn.setAttribute('aria-controls', panel.id);
        btn.setAttribute('aria-expanded', panel.classList.contains('open') ? 'true' : 'false');
        if (!panel.hasAttribute('role')) panel.setAttribute('role', 'region');
    });
    // --- FIM DA CORREÇÃO DO ACORDEÃO ---


    // --- LÓGICA DAS TABS (SE EXISTIREM) ---
    const tabContainer = document.querySelector('.imz-tabs-nav'); //
    if (tabContainer) {
        tabContainer.addEventListener('click', function(e) {
            if (e.target.classList.contains('imz-tab-button')) {
                const tabId = e.target.dataset.tab;
                // Remove 'active' de todos os botões e conteúdos
                document.querySelectorAll('.imz-tab-button').forEach(btn => btn.classList.remove('active'));
                document.querySelectorAll('.imz-tab-content').forEach(content => content.classList.remove('active'));
                // Adiciona 'active' ao botão clicado e ao conteúdo correspondente
                e.target.classList.add('active');
                document.getElementById('imz-tab-' + tabId).classList.add('active');
            }
        });
    }

    // --- LÓGICA DOS TERMOS DO TAKEDOWN (SE EXISTIR) ---
    const takedownTermsCheckbox = document.getElementById('takedown_terms_agree'); // Checkbox
    const takedownSubmitBtn = document.getElementById('imz-takedown-submit-btn'); // Botão submit
    if (takedownTermsCheckbox && takedownSubmitBtn) {
        // Ativa/desativa o botão com base no estado do checkbox
        takedownTermsCheckbox.addEventListener('change', function() {
            takedownSubmitBtn.disabled = !this.checked;
        });
        // Garante que o botão começa desativado se o checkbox não estiver marcado
        takedownSubmitBtn.disabled = !takedownTermsCheckbox.checked;
    }

    // --- FUNÇÃO DE UPLOAD DE FICHEIRO (PARA REIVINDICAÇÃO) ---
    function initializeClaimUploader(claimForm) {
        const fileInput = claimForm.querySelector('#claim_document_upload'); // Input file
        const hiddenInput = claimForm.querySelector('#claim_document_id'); // Input hidden para guardar ID
        const submitButton = claimForm.querySelector('button[type="submit"]'); // Botão de submit
        const progressBar = claimForm.querySelector('.imz-progress-bar'); // Barra de progresso
        const progressText = claimForm.querySelector('.imz-progress-text'); // Texto da percentagem
        const fileNotice = claimForm.querySelector('.imz-file-notice'); // Mensagem de estado/erro

        if (!fileInput) return; // Sai se o formulário não tiver uploader

        fileInput.addEventListener('change', function () {
            if (this.files.length === 0) return;
            const file = this.files[0];
            const allowedTypes = ['application/pdf', 'image/jpeg']; // Tipos permitidos
            const maxSize = 5 * 1024 * 1024; // 5MB

            // Validações
            if (!allowedTypes.includes(file.type)) {
                fileNotice.textContent = 'Erro: Apenas ficheiros PDF ou JPG são permitidos.';
                fileNotice.style.color = 'red';
                this.value = ''; // Limpa o input
                return;
            }
            if (file.size > maxSize) {
                fileNotice.textContent = 'Erro: O ficheiro não pode exceder 5MB.';
                fileNotice.style.color = 'red';
                this.value = '';
                return;
            }
            // Inicia o upload se as validações passarem
            uploadFile(file, fileInput);
        });

        // Função interna que faz o upload via AJAX
        function uploadFile(file, fileInputElement) {
            const formData = new FormData();
            formData.append('claim_document', file); // Nome esperado pelo PHP
            formData.append('action', 'imz_upload_claim_document'); // Ação AJAX
            formData.append('nonce', imz_ajax_data.nonce_upload_claim); // Nonce de segurança

            const xhr = new XMLHttpRequest();

            // Atualiza a barra de progresso durante o upload
            xhr.upload.addEventListener('progress', e => {
                if (e.lengthComputable) {
                    const percentComplete = (e.loaded / e.total) * 100;
                    progressBar.style.width = percentComplete + '%';
                    progressText.textContent = Math.round(percentComplete) + '%';
                }
            });

            // Lida com a resposta do servidor após o upload
            xhr.addEventListener('load', () => {
                progressBar.style.width = '100%';
                try {
                    const response = JSON.parse(xhr.responseText);
                    if (response.success) { // Se o PHP retornar sucesso
                        progressText.textContent = 'Upload Concluído!';
                        progressBar.style.backgroundColor = '#22c55e'; // Verde
                        hiddenInput.value = response.data.attachment_id; // Guarda o ID do anexo no input hidden
                        fileNotice.textContent = `Ficheiro "${file.name}" carregado.`;
                        fileNotice.style.color = 'green';
                        fileInputElement.disabled = true; // Desativa o input de ficheiro após sucesso
                    } else { // Se o PHP retornar erro
                        throw new Error(response.data.message || 'Erro desconhecido.');
                    }
                } catch (error) { // Erro ao processar JSON ou erro lançado pelo PHP
                    progressText.textContent = 'Falhou!';
                    progressBar.style.backgroundColor = '#ef4444'; // Vermelho
                    fileNotice.textContent = 'Erro no upload: ' + error.message;
                    fileNotice.style.color = 'red';
                }
            });

            // Lida com erros de rede
            xhr.addEventListener('error', () => {
                progressText.textContent = 'Falhou!';
                progressBar.style.backgroundColor = '#ef4444';
                fileNotice.textContent = 'Ocorreu um erro de rede.';
                fileNotice.style.color = 'red';
            });

            // Abre a conexão e envia os dados
            xhr.open('POST', imz_ajax_data.ajax_url, true); // URL AJAX global
            xhr.send(formData);

            // Reseta a barra de progresso no início do upload
            progressBar.style.width = '0%';
            progressText.textContent = '0%';
            progressBar.style.backgroundColor = '#3b82f6'; // Azul padrão
        }
    }

    // --- LÓGICA DE ALTERNÂNCIA PARA DOWNLOAD GRATUITO/PAGO ---
    dashboard.addEventListener('change', function(e) {
        // Verifica se o evento veio de um dos checkboxes de download dentro de um formulário de settings
        if (e.target.matches('.imz-download-toggle') || e.target.matches('.imz-paid-download-toggle')) {
            const form = e.target.closest('form.imz-music-settings-form'); // Target o form específico da música
            if (!form) return;

            const freeToggle = form.querySelector('.imz-download-toggle'); // Checkbox Gratuito
            const paidToggle = form.querySelector('.imz-paid-download-toggle'); // Checkbox Pago
            const priceGroup = form.querySelector('.imz-paid-price-group'); // Div do preço

            // Lógica de alternância: marcar um desmarca o outro
            if (e.target === freeToggle && freeToggle.checked) {
                if (paidToggle) paidToggle.checked = false; // Desmarca o pago
            } else if (e.target === paidToggle && paidToggle.checked) {
                if (freeToggle) freeToggle.checked = false; // Desmarca o gratuito
            }

            // Mostra/Esconde o campo de preço baseado no estado do checkbox PAGO
            if (priceGroup && paidToggle) { // Verifica se ambos existem
                if (paidToggle.checked && !paidToggle.disabled) { // Só mostra se o pago estiver marcado E não estiver desativado (não-PRO)
                    priceGroup.style.display = 'block';
                } else {
                    priceGroup.style.display = 'none';
                }
            }
        }
    });
    // --- FIM DA LÓGICA DE ALTERNÂNCIA ---

    // --- FUNÇÃO GENÉRICA PARA TRATAR FORMULÁRIOS AJAX ---
    // Recebe o formulário, a ação AJAX, o nome do nonce e uma função de callback opcional
    function handleAjaxForm(form, action, nonceName, onSuccess) {
        form.addEventListener('submit', function (e) {
            e.preventDefault(); // Impede submissão normal
            const submitButton = form.querySelector('button[type="submit"]');

            // Desativa o botão enquanto processa (feedback de resultado via toast)
            if(submitButton) submitButton.disabled = true;

            const formData = new FormData(form);
            formData.append('action', action); // Adiciona a ação AJAX
            // Adiciona o nonce correto do objeto global
            // Verifica se o nonce existe antes de adicionar
            if (imz_ajax_data && imz_ajax_data[nonceName]) {
                 formData.append(nonceName, imz_ajax_data[nonceName]);
            } else {
                console.error('Nonce não encontrado:', nonceName);
                imzToast('Erro de configuração (nonce). Contacte o suporte.', 'error');
                if(submitButton) submitButton.disabled = false;
                return; // Impede o envio se o nonce não for encontrado
            }


            // Envia a requisição AJAX
            fetch(imz_ajax_data.ajax_url, {
                method: 'POST',
                body: new URLSearchParams(formData) // Envia como 'application/x-www-form-urlencoded'
            })
            .then(response => response.json()) // Converte a resposta para JSON
            .then(result => {
                if (result.success) { // Se o PHP retornar sucesso
                    imzToast(result.data.message, 'success');
                    if (onSuccess) {
                        onSuccess(result, form); // Executa a função de callback (se existir)
                    } else if(submitButton) {
                        submitButton.disabled = false; // Reativa o botão se não houver callback
                    }
                } else { // Se o PHP retornar erro
                    throw new Error(result.data.message || 'Ocorreu um erro desconhecido.');
                }
            })
            .catch(error => { // Erro na requisição AJAX ou erro lançado pelo PHP
                imzToast(error.message, 'error');
                if(submitButton) submitButton.disabled = false; // Reativa o botão em caso de erro
            });
        });
    }

    // --- INICIALIZAR TODOS OS FORMULÁRIOS DO PAINEL ---

    // 1. Formulário de Reivindicação (Claim)
    const claimForm = dashboard.querySelector('form.imz-claim-form'); //
    if (claimForm) {
        initializeClaimUploader(claimForm); // Prepara o uploader específico deste formulário
        handleAjaxForm(claimForm, 'imz_claim_music', 'nonce_claim_music', (result, form) => { // Ação AJAX
            form.reset(); // Limpa o formulário após sucesso
            // Resetar o estado visual do uploader
            form.querySelector('.imz-progress-bar').style.width = '0%';
            form.querySelector('.imz-progress-text').textContent = '0%';
            form.querySelector('.imz-file-notice').textContent = '';
            form.querySelector('#claim_document_upload').disabled = false; // Reativa o input de ficheiro
            const submitBtn = form.querySelector('button[type="submit"]');
            if(submitBtn) submitBtn.disabled = false; // Reativa o botão
        });
    }

    // 2. Formulário de Método de Pagamento
    const payoutMethodForm = dashboard.querySelector('form#imz-payout-method-form'); //
    if (payoutMethodForm) {
        handleAjaxForm(payoutMethodForm, 'imz_save_payout_method', 'nonce_payout_method', () => { // Ação AJAX
            // Recarrega a página após 2 segundos para mostrar o painel principal
            setTimeout(() => location.reload(), 2000);
        });
    }

    // 3. Formulário de Pedido de Pagamento (Saque)
    const requestPayoutForm = dashboard.querySelector('form#imz-payout-request-form'); //
    if (requestPayoutForm) {
        handleAjaxForm(requestPayoutForm, 'imz_request_payout', 'nonce_request_payout', () => { // Ação AJAX
             // Recarrega a página após 2 segundos para atualizar os saldos
            setTimeout(() => location.reload(), 2000);
        });
    }

    // 4. Formulários de Definições de Músicas (Múltiplos, um para cada música)
    const musicSettingsForms = dashboard.querySelectorAll('form.imz-music-settings-form'); //
    musicSettingsForms.forEach(form => {
        handleAjaxForm(form, 'imz_save_music_settings', 'nonce_save_settings', (result, form) => { // Ação AJAX
            const submitBtn = form.querySelector('button[type="submit"]');
            if(submitBtn) submitBtn.disabled = false; // Reativa o botão
            // A mensagem de sucesso já foi mostrada, não é preciso fazer mais nada aqui
            // Opcional: Fechar o acordeão após salvar?
             // const header = form.closest('.imz-music-item').querySelector('.imz-music-item-header');
             // if(header && header.classList.contains('active')) {
             //    header.click(); // Simula um clique para fechar
             // }
        });
    });

    // 5. Formulário de Takedown (Proteção Digital)
    const takedownForm = dashboard.querySelector('form.imz-takedown-form'); //
    if (takedownForm) {
        handleAjaxForm(takedownForm, 'imz_submit_takedown', 'nonce_submit_takedown', () => { // Ação AJAX
            // Recarrega a página após 2 segundos para atualizar o histórico de pedidos
            setTimeout(() => location.reload(), 2000);
        });
    }

    // 6. Formulários de Ação de Compra (Múltiplos, um para cada pedido pendente)
    const purchaseActionForms = dashboard.querySelectorAll('form.imz-purchase-action-form'); //
    purchaseActionForms.forEach(form => {
        form.addEventListener('submit', function(e) {
            e.preventDefault(); // Impede submissão normal

            // Determina qual botão foi clicado ("contacted" ou "cancel")
            const actionType = e.submitter ? e.submitter.value : null;
            if (!actionType) return; // Sai se não conseguir identificar o botão clicado

            const submitButton = e.submitter;
            const messagesDiv = form.querySelector('.imz-form-messages');
            const requestId = form.querySelector('input[name="request_id"]').value; // ID do pedido de compra

            messagesDiv.innerHTML = '<div class="imz-message imz-message-warning" style="margin: 0;">A processar...</div>';
            submitButton.disabled = true;
            // Desativa o outro botão também para evitar cliques duplos
            const otherButton = form.querySelector(`button[type="submit"]:not([value="${actionType}"])`);
            if (otherButton) otherButton.disabled = true;


            const formData = new FormData();
            formData.append('request_id', requestId);
            // Usa o nonce específico para estas ações
            if (imz_ajax_data && imz_ajax_data.nonce_purchase_action) {
                 formData.append('nonce', imz_ajax_data.nonce_purchase_action);
            } else {
                 console.error('Nonce não encontrado: nonce_purchase_action');
                 messagesDiv.innerHTML = '<div class="imz-message imz-message-error" style="margin: 0;">Erro de configuração (nonce purchase). Contacte o suporte.</div>';
                 submitButton.disabled = false;
                 if (otherButton) otherButton.disabled = false;
                 return;
            }


            let actionName = '';
            // Define a ação AJAX correta com base no botão clicado
            if (actionType === 'contacted') {
                actionName = 'imz_artist_contacted_buyer'; // Handler PHP
            } else if (actionType === 'cancel') {
                actionName = 'imz_artist_cancel_buyer'; // Handler PHP
            }
            formData.append('action', actionName);

            // Envia a requisição AJAX
            fetch(imz_ajax_data.ajax_url, {
                method: 'POST',
                body: new URLSearchParams(formData)
            })
            .then(response => response.json())
            .then(result => {
                if (result.success) { // Se o PHP retornar sucesso
                     // MODIFICAÇÃO PARA MOSTRAR O CÓDIGO CORRETAMENTE:
                    if (actionType === 'contacted') {
                        // Encontra o container das ações (onde estavam os botões)
                        const actionContainer = form.closest('.imz-music-item-settings');
                        if(actionContainer){
                            // Substitui o conteúdo pelo resultado (código + link)
                            actionContainer.innerHTML = `<div class="imz-message imz-message-success" style="margin: 0;">${result.data.message}</div>`;
                        } else {
                            // Fallback se não encontrar o container (comportamento anterior)
                            messagesDiv.innerHTML = `<div class="imz-message imz-message-success" style="margin: 0;">${result.data.message}</div>`;
                            form.style.display = 'none';
                        }
                    } else if (actionType === 'cancel') { // Comportamento para Cancelar (como estava)
                         messagesDiv.innerHTML = `<div class="imz-message imz-message-success" style="margin: 0;">${result.data.message}</div>`;
                         form.style.display = 'none'; // Esconde o formulário
                        // Remove visualmente o item da lista após 2 segundos
                        setTimeout(() => {
                            const itemToRemove = document.getElementById('purchase-request-' + requestId);
                            if (itemToRemove) itemToRemove.style.display = 'none';
                        }, 2000);
                    }
                    // FIM DA MODIFICAÇÃO
                } else { // Se o PHP retornar erro
                    throw new Error(result.data.message || 'Ocorreu um erro desconhecido.');
                }
            })
            .catch(error => { // Erro na requisição AJAX ou erro lançado pelo PHP
                messagesDiv.innerHTML = `<div class="imz-message imz-message-error" style="margin: 0;">${error.message}</div>`;
                // Reativa ambos os botões em caso de erro
                submitButton.disabled = false;
                 if (otherButton) otherButton.disabled = false;
            });
        });
    });

}); // Fim do DOMContentLoaded

// =============================================================================
// GRÁFICO DE ATIVIDADE (Chart.js)
// =============================================================================
document.addEventListener('DOMContentLoaded', function() {
    var chartCanvas = document.getElementById('imz-activity-chart');
    if (!chartCanvas || typeof Chart === 'undefined') return;

    var imzChart = null;
    var currentPeriod = '7days';

    function getChartColors() {
        var dashboard = document.querySelector('.artist-dashboard');
        var theme = dashboard ? dashboard.getAttribute('data-theme') : 'dark';
        if (theme === 'light') {
            return {
                downloadBg: 'rgba(37, 99, 235, 0.15)',
                downloadBorder: 'rgba(37, 99, 235, 1)',
                boostBg: 'rgba(16, 185, 129, 0.15)',
                boostBorder: 'rgba(16, 185, 129, 1)',
                playBg: 'rgba(245, 158, 11, 0.12)',
                playBorder: 'rgba(245, 158, 11, 1)',
                gridColor: 'rgba(0, 0, 0, 0.08)',
                textColor: '#374151',
                tooltipBg: '#ffffff',
                tooltipText: '#111827',
                tooltipBorder: '#e5e7eb'
            };
        }
        return {
            downloadBg: 'rgba(255, 255, 255, 0.08)',
            downloadBorder: 'rgba(255, 255, 255, 0.9)',
            boostBg: 'rgba(16, 185, 129, 0.15)',
            boostBorder: 'rgba(16, 185, 129, 0.9)',
            playBg: 'rgba(245, 158, 11, 0.12)',
            playBorder: 'rgba(245, 158, 11, 0.9)',
            gridColor: 'rgba(255, 255, 255, 0.06)',
            textColor: '#888888',
            tooltipBg: '#1a1a1a',
            tooltipText: '#ffffff',
            tooltipBorder: '#2a2a2a'
        };
    }

    function loadChart(period) {
        var loading = document.getElementById('imz-chart-loading');
        if (loading) loading.style.display = 'flex';

        var fd = new FormData();
        fd.append('action', 'imz_get_dashboard_chart_data');
        fd.append('period', period);
        fd.append('nonce', imz_ajax_data.nonce_chart_data);

        fetch(imz_ajax_data.ajax_url, { method: 'POST', body: fd })
            .then(function(r) { return r.json(); })
            .then(function(result) {
                if (loading) loading.style.display = 'none';
                if (!result.success) return;

                var data = result.data;
                var colors = getChartColors();

                if (imzChart) imzChart.destroy();

                imzChart = new Chart(chartCanvas.getContext('2d'), {
                    type: 'line',
                    data: {
                        labels: data.labels,
                        datasets: [
                            {
                                label: 'Downloads',
                                data: data.downloads,
                                borderColor: colors.downloadBorder,
                                backgroundColor: colors.downloadBg,
                                fill: true,
                                tension: 0.4,
                                pointRadius: 4,
                                pointHoverRadius: 6,
                                pointBackgroundColor: colors.downloadBorder,
                                borderWidth: 2
                            },
                            {
                                label: 'Impulsionamentos',
                                data: data.boosts,
                                borderColor: colors.boostBorder,
                                backgroundColor: colors.boostBg,
                                fill: true,
                                tension: 0.4,
                                pointRadius: 4,
                                pointHoverRadius: 6,
                                pointBackgroundColor: colors.boostBorder,
                                borderWidth: 2
                            },
                            {
                                label: 'Plays',
                                data: data.plays || [],
                                borderColor: colors.playBorder,
                                backgroundColor: colors.playBg,
                                fill: true,
                                tension: 0.4,
                                pointRadius: 4,
                                pointHoverRadius: 6,
                                pointBackgroundColor: colors.playBorder,
                                borderWidth: 2
                            }
                        ]
                    },
                    options: {
                        responsive: true,
                        maintainAspectRatio: false,
                        interaction: { mode: 'index', intersect: false },
                        plugins: {
                            legend: { display: false },
                            tooltip: {
                                backgroundColor: colors.tooltipBg,
                                titleColor: colors.tooltipText,
                                bodyColor: colors.tooltipText,
                                borderColor: colors.tooltipBorder,
                                borderWidth: 1,
                                cornerRadius: 8,
                                padding: 12,
                                displayColors: true,
                                boxPadding: 4
                            }
                        },
                        scales: {
                            x: {
                                grid: { color: colors.gridColor, drawBorder: false },
                                ticks: { color: colors.textColor, font: { size: 11 } }
                            },
                            y: {
                                beginAtZero: true,
                                grid: { color: colors.gridColor, drawBorder: false },
                                ticks: {
                                    color: colors.textColor,
                                    font: { size: 11 },
                                    stepSize: 1,
                                    callback: function(val) { return Number.isInteger(val) ? val : ''; }
                                }
                            }
                        }
                    }
                });
            })
            .catch(function() {
                if (loading) loading.style.display = 'none';
            });
    }

    // Period toggle buttons
    document.querySelectorAll('.imz-period-btn').forEach(function(btn) {
        btn.addEventListener('click', function() {
            document.querySelectorAll('.imz-period-btn').forEach(function(b) { b.classList.remove('active'); });
            this.classList.add('active');
            currentPeriod = this.getAttribute('data-period');
            loadChart(currentPeriod);
        });
    });

    // Initial load
    loadChart(currentPeriod);

    // =============================================================================
    // TOGGLE DARK/LIGHT MODE
    // =============================================================================
    var themeToggle = document.getElementById('imz-theme-toggle');
    var dashboard = document.querySelector('.artist-dashboard');

    if (themeToggle && dashboard) {
        themeToggle.addEventListener('click', function() {
            var current = dashboard.getAttribute('data-theme') || 'dark';
            var next = current === 'dark' ? 'light' : 'dark';
            dashboard.setAttribute('data-theme', next);
            // As variáveis CSS do tema são tratadas em design-tokens.css
            // (.artist-dashboard[data-theme="light"])

            // Recarregar gráfico com novas cores
            loadChart(currentPeriod);

            // Salvar preferência via AJAX
            var fd = new FormData();
            fd.append('action', 'imz_save_theme_preference');
            fd.append('theme', next);
            fd.append('nonce', imz_ajax_data.nonce_theme_pref);
            fetch(imz_ajax_data.ajax_url, { method: 'POST', body: fd });
        });
    }

});