// script.js - Lógica Principal do Aplicativo (Aprimorado e Finalizado pelo Cometê)
// Última Alteração: Adicionado listener com depuração para o campo de ID de produto.

import { DataService } from './api.js';
const localforage = window.localforage;

document.addEventListener('DOMContentLoaded', async () => {
    // --- BANCO DE DADOS (AGORA SERÁ PERSISTENTE VIA API/INDEXEDDB) ---
    let products = [];
    let mainInventory = [];
    let vehicleInventory = { montana: [], uno: [], pajero: [], estoqueAlternativo: [] };
    let redirectInventory = [];
    let transactionLog = [];
    let userList = [];
    let clientList = [];
    let clientActivities = [];
    let towersData = []; 
    let rectificationItems = [];
    
    let currentUser = null;
    let currentVehicle = null;
    let currentVehicleName = '';
    let itemChart = null;
    let rectificationChart = null;

    let clientActivityChart = null; // Variável para guardar a instância do gráfico
    // --- SELETORES ---
    const pageEstoque = document.getElementById('page-estoque');
    const pageVeiculos = document.getElementById('page-veiculos');
    const pageMovimentacoes = document.getElementById('page-movimentacoes');
    const pageUsuarios = document.getElementById('page-usuarios');
    const pageStatus = document.getElementById('page-status');

    const navEstoque = document.getElementById('nav-estoque');
    const navVeiculos = document.getElementById('nav-veiculos');
    const navMovimentacoes = document.getElementById('nav-movimentacoes');
    const navUsuarios = document.getElementById('nav-usuarios');
    const navStatus = document.getElementById('nav-status');
    
    const mobileMenuButton = document.getElementById('mobile-menu-button');
    const mobileMenu = document.getElementById('mobile-menu');
    const mobileNavStatus = document.getElementById('mobile-nav-status');
    const mobileNavEstoque = document.getElementById('mobile-nav-estoque');
    const mobileNavVeiculos = document.getElementById('mobile-nav-veiculos');
    const mobileNavMovimentacoes = document.getElementById('mobile-nav-movimentacoes');
    const mobileNavUsuarios = document.getElementById('mobile-nav-usuarios');

    const openClientModalButton = document.getElementById('open-client-modal-button');
    const clientModal = document.getElementById('client-modal');
    const clientModalCloseButton = document.getElementById('client-modal-close-button');
    const clientTabs = document.querySelectorAll('.client-tab');
    const sectionClientRegistration = document.getElementById('section-client-registration');
    const sectionClientStatus = document.getElementById('section-client-status');
    const clientRegistrationForm = document.getElementById('client-registration-form');
    const clientStatusTableBody = document.getElementById('client-status-table-body');
    const clientStatusNoResults = document.getElementById('client-status-no-results');

    const userTabs = document.querySelectorAll('.user-tab');
    const sectionUserList = document.getElementById('section-user-list');
    const sectionClientActivity = document.getElementById('section-client-activity');
    const sectionRectification = document.getElementById('section-rectification');
    // Em script.js, na área dos addEventListener

    // [NOVO] Event listener para o filtro de mês do gráfico
    document.getElementById('activity-month-filter')?.addEventListener('change', (e) => {
    renderClientActivityChart(e.target.value);
});

sectionRectification.addEventListener('click', async (e) => {
    // 1. Verifica se o clique foi no botão de "Retirar"
    const withdrawButton = e.target.closest('.withdraw-from-rectification-button');
    if (!withdrawButton) {
        return; // Se não foi, ignora o clique
    }
    
    // 2. Pega o patrimônio do botão que foi clicado
    const patrimonio = withdrawButton.dataset.patrimonioId;
    if (!patrimonio) {
        console.error('Botão de retirada não possui data-patrimonio-id');
        return;
    }

    showGlobalLoading('Retirando da retífica...');

    try {
        // 3. Chama a nova função da API
        const result = await DataService.removeItemFromRectification({ patrimonio }, currentUser.role);

        // 4. Se deu tudo certo, atualiza os dados e a tela
        showFeedbackModal('Sucesso!', result.message, 'success');
        
        // Recarrega os inventários de retífica e redirecionamento
        await loadRectificationItems();
        await loadRedirectInventory();

        // Re-renderiza as tabelas para mostrar o estado atualizado
        renderRectificationView();
        
        // Se a aba de redirecionamento estiver visível, atualiza ela também
        if (!document.getElementById('section-redirecionamento').classList.contains('hidden')) {
            renderRedirectView();
        }

    } catch (error) {
        showFeedbackModal('Erro', error.message, 'error');
    } finally {
        hideGlobalLoading();
    }
});

    const clientActivityForm = document.getElementById('client-activity-form');
    
    const activityCurrentUserName = document.getElementById('activity-current-user-name');
    const activityCurrentUserId = document.getElementById('activity-current-user-id');
    const activityOtherUsersSelect = document.getElementById('activity-other-users-select');

    const activityVehicleSelect = document.getElementById('activity-vehicle');
    const activityPatrimonioSelect = document.getElementById('activity-patrimonio'); // Select original para desktop

    const openPatrimonioModalButton = document.getElementById('open-patrimonio-modal-button');
    const patrimonioSelectModal = document.getElementById('patrimonio-select-modal');
    const closePatrimonioModalButton = document.getElementById('close-patrimonio-modal-button');
    const patrimonioCheckboxList = document.getElementById('patrimonio-checkbox-list');
    const patrimonioModalNoResults = document.getElementById('patrimonio-modal-no-results');
    const confirmPatrimonioSelectionButton = document.getElementById('confirm-patrimonio-selection-button');
    const activityPatrimonioDisplay = document.getElementById('activity-patrimonio-display');
    const activityPatrimonioValues = document.getElementById('activity-patrimonio-values');


    const activityDateInput = document.getElementById('activity-date');
    const activityClientInput = document.getElementById('activity-client');
    const clientSuggestionsContainer = document.getElementById('client-suggestions');
    const activityTowerInput = document.getElementById('activity-tower');
    const activitySectorInput = document.getElementById('activity-sector');

    const stockTabs = document.querySelectorAll('.stock-tab');
    const sectionCadastro = document.getElementById('section-cadastro');
    const sectionSaldo = document.getElementById('section-saldo');
    const sectionRedirecionamento = document.getElementById('section-redirecionamento');
    const stockForm = document.getElementById('stock-form');
    const stockProdutoIdInput = document.getElementById('stock-produto-id');
    
    const stockProdutoNomeInput = document.getElementById('stock-produto-nome');
    const macAddressGroup = document.getElementById('mac-address-group');
    const macAddressInput = document.getElementById('stock-mac-address');
    stockProdutoNomeInput.addEventListener('keyup', () => {
    if (stockProdutoNomeInput.value.trim().toLowerCase() === 'roteador') {
        macAddressGroup.classList.remove('hidden');
    } else {
        macAddressGroup.classList.add('hidden');
        macAddressInput.value = ''; // Limpa o campo se não for um roteador
    }
});

    const stockProdutoEnderecoInput = document.getElementById('stock-produto-endereco');
    const stockProdutoPatrimonioInput = document.getElementById('stock-produto-patrimonio');
    const stockSearchInput = document.getElementById('stock-search-input');
    const stockTableBody = document.getElementById('stock-table-body');
    const stockNoResults = document.getElementById('stock-no-results');
    const redirectTableBody = document.getElementById('redirect-table-body');
    const redirectNoResults = document.getElementById('redirect-no-results');
    const movimentacoesTableBody = document.getElementById('movimentacoes-table-body');
    const movimentacoesNoResults = document.getElementById('movimentacoes-no-results');
    const userForm = document.getElementById('user-form');
    const userTableBody = document.getElementById('user-table-body');
    const userNoResults = document.getElementById('user-no-results');
    const userSubmitButton = document.getElementById('user-submit-button');
    const userNameInput = document.getElementById('user-name');
    const userEmailInput = document.getElementById('user-email');
    const userPasswordInput = document.getElementById('user-password');
    const userRoleInput = document.getElementById('user-role');

    const vehicleCards = document.querySelectorAll('.vehicle-card');
    const vehicleModal = document.getElementById('vehicle-modal');
    const vehicleModalTitle = document.getElementById('vehicle-modal-title');
    const vehicleModalCloseButton = document.getElementById('vehicle-modal-close-button');
    const vehicleTabs = document.querySelectorAll('.vehicle-tab');
    const vehicleSaldoTableBody = document.getElementById('vehicle-saldo-table-body');
    const vehicleNoResults = document.getElementById('vehicle-no-results');
    const vehicleSearchInput = document.getElementById('vehicle-search-input');
    const vehicleAddForm = document.getElementById('vehicle-add-form');
    const addProdutoIdInput = document.getElementById('add-produto-id');
    const addProdutoNomeInput = document.getElementById('add-produto-nome');
    const addProdutoPatrimonioSelect = document.getElementById('add-produto-patrimonio');
    const addIdNotFoundError = document.getElementById('add-id-not-found-error');
    const vehicleRemoveForm = document.getElementById('vehicle-remove-form');
    const removeProdutoIdInput = document.getElementById('remove-produto-id');
    const removeProdutoNomeInput = document.getElementById('remove-produto-nome');
    const removeProdutoPatrimonioSelect = document.getElementById('remove-produto-patrimonio');
    const removeIdNotFoundError = document.getElementById('remove-id-not-found-error');
    
    // Modais
    const genericModal = document.getElementById('generic-modal');
    const genericModalTitle = document.getElementById('generic-modal-title');
    const genericModalContent = document.getElementById('generic-modal-content');
    const genericModalCloseButton = document.getElementById('generic-modal-close-button');
    const feedbackModal = document.getElementById('feedback-modal');
    const modalIconContainer = document.getElementById('modal-icon-container');
    const modalTitle = document.getElementById('modal-title');
    const modalMessage = document.getElementById('modal-message');
    const modalCloseButton = feedbackModal.querySelector('#modal-close-button');
    const successIcon = `<i class="fas fa-check-circle fa-2x text-green-500"></i>`;
    const errorIcon = `<i class="fas fa-times-circle fa-2x text-red-500"></i>`;
    const infoIcon = `<i class="fas fa-info-circle fa-2x text-blue-500"></i>`;

    // NOVOS SELETORES PARA INDICADORES DE CARREGAMENTO
    const globalLoadingOverlay = document.getElementById('global-loading-overlay');
    const loadingMessage = document.getElementById('loading-message');
    const statusLoadingIndicator = document.getElementById('status-loading-indicator');
    const statusContent = document.getElementById('status-content');
    const stockTableLoadingIndicator = document.getElementById('stock-table-loading-indicator');
    const stockTableContent = document.getElementById('stock-table-content');
    const redirectTableLoadingIndicator = document.getElementById('redirect-table-loading-indicator');
    const redirectTableContent = document.getElementById('redirect-table-content');
    const movimentacoesTableLoadingIndicator = document.getElementById('movimentacoes-table-loading-indicator');
    const movimentacoesTableContent = document.getElementById('movimentacoes-table-content');
    const userTableLoadingIndicator = document.getElementById('user-table-loading-indicator');
    const userTableContent = document.getElementById('user-table-content');
    const rectificationTableLoadingIndicator = document.getElementById('rectification-table-loading-indicator');
    const rectificationTableContent = document.getElementById('rectification-table-content');
    const clientStatusTableLoadingIndicator = document.getElementById('client-status-table-loading-indicator');
    const clientStatusTableContent = document.getElementById('client-status-table-content');
    
    // --- DEFINIÇÃO DE TODAS AS FUNÇÕES ---
    let isMobileMenuOpen = false;

    function toggleMobileMenu() {
        if (isMobileMenuOpen) {
            mobileMenu.classList.add('mobile-menu-close');
            mobileMenu.classList.remove('mobile-menu-open');
            mobileMenu.addEventListener('animationend', function handler() {
                mobileMenu.classList.add('hidden');
                mobileMenu.removeEventListener('animationend', handler);
            });
        } else {
            mobileMenu.classList.remove('hidden', 'mobile-menu-close');
            mobileMenu.classList.add('mobile-menu-open');
        }
        isMobileMenuOpen = !isMobileMenuOpen;
    }

    function showGlobalLoading(message = 'Processando operação...') {
        loadingMessage.textContent = message;
        globalLoadingOverlay.classList.remove('hidden');
        document.body.style.overflow = 'hidden';
    }

    function hideGlobalLoading() {
        globalLoadingOverlay.classList.add('hidden');
        document.body.style.overflow = '';
    }

    function toggleTableLoading(indicatorElement, contentElement, show) {
        if (indicatorElement && contentElement) {
            indicatorElement.classList.toggle('hidden', !show);
            contentElement.classList.toggle('hidden', show);
        }
    }

    function showPage(pageName) {
        if (!hasPageAccess(pageName)) {
            showFeedbackModal('Acesso Negado', 'Você não tem permissão para acessar esta página.', 'error');
            return;
        }
        document.querySelectorAll('main > div').forEach(page => page.classList.add('hidden'));
        document.getElementById(`page-${pageName}`).classList.remove('hidden');
        document.querySelectorAll('header nav a').forEach(link => {
            link.classList.remove('nav-link-active');
            link.classList.add('nav-link-inactive');
        });
        const navLink = document.getElementById(`nav-${pageName}`);
        if(navLink) {
            navLink.classList.add('nav-link-active');
        }
        if (!mobileMenu.classList.contains('hidden')) {
            toggleMobileMenu();
        }
        loadPageData(pageName);
    }

    async function loadPageData(pageName) {
    try {
        switch (pageName) {
            case 'status':
                toggleTableLoading(statusLoadingIndicator, statusContent, true);
                await Promise.all([
                    loadProducts(),
                    loadInventory(),
                    loadVehicleInventories(),
                    loadRedirectInventory(),
                    loadUsers(),
                    loadClientActivities(),
                    loadRectificationItems(),
                    loadTowers() // ADICIONE ESTA LINHA
                    
                ]);
                renderStatusDashboard(); // Esta linha já existe
                toggleTableLoading(statusLoadingIndicator, statusContent, false);
                break;
                const monthFilter = document.getElementById('activity-month-filter');
                if (monthFilter) {
                    const today = new Date();
                    const year = today.getFullYear();
                    const month = String(today.getMonth() + 1).padStart(2, '0');
                    const currentMonth = `${year}-${month}`;

                    monthFilter.value = currentMonth;
                    renderClientActivityChart(currentMonth);
                }
                break;
                    
                    // ADICIONE ESTA NOVA FUNÇÃO
async function loadTowers() {
    try {
        const result = await DataService.getTowers(currentUser.role);
        towersData = result.data;
        await saveDataToStorage('towersData', towersData); // Opcional, para offline
    } catch (error) {
        towersData = await loadDataFromStorage('towersData');
        console.warn('Erro ao carregar torres do servidor, usando cache local:', error);
    }
}
                case 'estoque':
                    toggleTableLoading(stockTableLoadingIndicator, stockTableContent, true);
                    toggleTableLoading(redirectTableLoadingIndicator, redirectTableContent, true);
                    await Promise.all([
                        loadProducts(),
                        loadInventory(),
                        loadRedirectInventory()
                    ]);
                    const currentStockTab = document.querySelector('#page-estoque .stock-tab.text-indigo-600');
                    const currentStockTabName = currentStockTab ? currentStockTab.id.replace('tab-', '') : null;
                    if (currentStockTabName && hasStockTabAccess(currentStockTabName)) {
                        switchStockTab(currentStockTabName);
                    } else {
                        switchStockTab(hasStockTabAccess('saldo') ? 'saldo' : 'cadastro');
                    }
                    toggleTableLoading(stockTableLoadingIndicator, stockTableContent, false);
                    toggleTableLoading(redirectTableLoadingIndicator, redirectTableContent, false);
                    break;
                case 'veiculos':
                    await Promise.all([
                        loadProducts(),
                        loadInventory(),
                        loadVehicleInventories(),
                        loadRedirectInventory()
                    ]);
                    if (currentUser.role === 'Administrador' || currentUser.role === 'Operador') {
                        switchVehicleModalTab('saldo');
                    } else {
                         switchVehicleModalTab('adicionar');
                    }
                    break;
                case 'movimentacoes':
                    toggleTableLoading(movimentacoesTableLoadingIndicator, movimentacoesTableContent, true);
                    await loadTransactionLogs();
                    renderLogView();
                    toggleTableLoading(movimentacoesTableLoadingIndicator, movimentacoesTableContent, false);
                    break;
                case 'usuarios':
                    toggleTableLoading(userTableLoadingIndicator, userTableContent, true);
                    toggleTableLoading(rectificationTableLoadingIndicator, rectificationTableContent, true);
                    toggleTableLoading(clientStatusTableLoadingIndicator, clientStatusTableContent, true);
                    await Promise.all([
                        loadUsers(),
                        loadClients(),
                        loadClientActivities(),
                        loadRectificationItems(),
                        loadTowers()
                        
                    ]);
                    const currentUserTab = document.querySelector('#page-usuarios .user-tab.text-indigo-600');
                    const currentUserTabName = currentUserTab ? currentUserTab.id.replace('tab-', '') : null;
                    if (currentUserTabName && hasUserTabAccess(currentUserTabName)) {
                        switchUserTab(currentUserTabName);
                    } else {
                        switchUserTab(getDefaultUserTab());
                    }
                    toggleTableLoading(userTableLoadingIndicator, userTableContent, false);
                    toggleTableLoading(rectificationTableLoadingIndicator, rectificationTableContent, false);
                    toggleTableLoading(clientStatusTableLoadingIndicator, clientStatusTableContent, false);
                    break;
            }
        } catch (error) {
            console.error(`Erro ao carregar dados da página ${pageName}:`, error);
            showFeedbackModal('Erro de Carregamento', `Não foi possível carregar os dados para esta página: ${error.message}`, 'error');
            toggleTableLoading(statusLoadingIndicator, statusContent, false);
            toggleTableLoading(stockTableLoadingIndicator, stockTableContent, false);
            toggleTableLoading(redirectTableLoadingIndicator, redirectTableContent, false);
            toggleTableLoading(movimentacoesTableLoadingIndicator, movimentacoesTableContent, false);
            toggleTableLoading(userTableLoadingIndicator, userTableContent, false);
            toggleTableLoading(rectificationTableLoadingIndicator, rectificationTableContent, false);
            toggleTableLoading(clientStatusTableLoadingIndicator, clientStatusTableContent, false);
        }
    }

    function showFeedbackModal(title, message, type = 'success') {
        modalTitle.textContent = title;
        modalMessage.textContent = message;
        let icon = successIcon;
        if (type === 'error') icon = errorIcon;
        if (type === 'info') icon = infoIcon;
        modalIconContainer.innerHTML = icon;
        feedbackModal.classList.remove('hidden');
    }

    function hideFeedbackModal() {
        feedbackModal.classList.add('hidden');
    }
    
    function showInfoModal(title, content) {
        genericModalTitle.textContent = title;
        genericModalContent.innerHTML = content;
        genericModal.classList.remove('hidden');
    }

    function hideInfoModal() {
        genericModal.classList.add('hidden');
    }
    
    function updateWelcomeMessage() {
        if (currentUser) {
            document.getElementById('user-welcome').textContent = `Olá, ${currentUser.name || 'Usuário'}! (${currentUser.role || 'N/A'})`; 
        } else {
            document.getElementById('user-welcome').textContent = '';
        }
    }

// Versão CORRIGIDA
function checkLoginStatus() {
    const user = sessionStorage.getItem('currentUser');
    if (user) {
        currentUser = JSON.parse(user);

        // --- LÓGICA DE REDIRECIONAMENTO ADICIONADA ---
        // Se o usuário for 'Financeiro', redireciona imediatamente e para a execução.
        if (currentUser.role === 'Financeiro') {
            window.location.href = 'financeiro.html';
            return; // Impede que o resto do script da index.html execute para ele
        }
        // --- FIM DA LÓGICA DE REDIRECIONAMENTO ---

        // Para todos os outros usuários, a lógica normal da página principal continua
        updateWelcomeMessage();
        applyPermissions();
        showPage(getDefaultPage());

    } else {
        window.location.href = 'login.html';
    }
}

    function logout() {
        sessionStorage.removeItem('currentUser');
        window.location.href = 'login.html';
    }

    // VERSÃO CORRIGIDA
    // VERSÃO FINAL E SEGURA
function hasPageAccess(pageName) {
    if (!currentUser) return false;
    const userRole = currentUser.role;

    // Mapeamento explícito de quem vê o quê.
    const permissions = {
        'Desenvolvedor': ['status', 'estoque', 'veiculos', 'movimentacoes', 'usuarios', 'financeiro'],
        'Administrador': ['status', 'estoque', 'veiculos', 'movimentacoes', 'usuarios', 'financeiro'],
        'Estoquista':    ['status', 'estoque', 'veiculos', 'movimentacoes', 'usuarios'],
        'Operador':      ['veiculos', 'usuarios'],
        'Suporte':       ['veiculos', 'usuarios'],
        'Financeiro':    ['financeiro'] // Apenas a página 'financeiro'
    };

    if (permissions[userRole]) {
        return permissions[userRole].includes(pageName);
    }

    return false;
}

    // VERSÃO CORRIGIDA
function hasUserTabAccess(tabName) {
    if (!currentUser) return false;
    const userRole = currentUser.role;

    if (userRole === 'Estoquista' || userRole === 'Desenvolvedor') {
        return true;
    }

    switch (userRole) {
        case 'Administrador':
            return ['user-list', 'rectification', 'client-activity'].includes(tabName);
        case 'Operador':
        case 'Suporte': // Adicionado Suporte aqui
            return ['client-activity', 'rectification'].includes(tabName);
        default:
            return false;
    }
}

    // VERSÃO CORRIGIDA
    function hasStockTabAccess(tabName) {
    if (!currentUser) return false;

    if (['Estoquista', 'Desenvolvedor', 'Administrador'].includes(currentUser.role)) {
        return true;
    }

    // Lógica para os outros...
    if (currentUser.role === 'Operador') {
        return tabName === 'saldo';
    }

    return false;

}

    // VERSÃO CORRIGIDA
// Versão CORRIGIDA
function hasVehicleModalTabAccess(tabName) {
    if (!currentUser) return false;
    const userRole = currentUser.role;

    if (['Estoquista', 'Desenvolvedor', 'Administrador'].includes(userRole)) {
        return true;
    }

    // Lógica para Operador e Suporte (acesso idêntico)
    if (userRole === 'Operador' || userRole === 'Suporte') {
        return tabName === 'saldo'; // Permite que ambos vejam apenas a aba 'saldo'
    }

    return false;
}

function getDefaultPage() {
    if (!currentUser) return 'status';
    switch (currentUser.role) {
        case 'Estoquista':
        case 'Administrador':
        case 'Desenvolvedor': // Adicionado para clareza
            return 'status';
        case 'Operador':
        case 'Suporte':
            return 'veiculos';
        case 'Financeiro': // <-- CORREÇÃO PRINCIPAL ADICIONADA AQUI
            return 'financeiro';
        default:
            return 'login.html'; // Por segurança, desloga se o cargo for desconhecido
    }
}

function getDefaultUserTab() {
    if (!currentUser) return 'user-list';
    switch (currentUser.role) {
        case 'Estoquista':
        case 'Administrador':
            return 'user-list';
        case 'Operador':
        case 'Suporte': // Adicionado Suporte aqui
            return 'client-activity';
        default:
            return 'user-list';
    }
}

    // VERSÃO FINAL, COMPLETA E RESPONSIVA
function applyPermissions() {
    if (!currentUser) return;

    // --- 1. LÓGICA DE VISIBILIDADE DE PÁGINAS (MENU) ---
    // Esta parte controla quais links do menu são visíveis
    navStatus.classList.toggle('hidden', !hasPageAccess('status'));
    navEstoque.classList.toggle('hidden', !hasPageAccess('estoque'));
    navVeiculos.classList.toggle('hidden', !hasPageAccess('veiculos'));
    navMovimentacoes.classList.toggle('hidden', !hasPageAccess('movimentacoes'));
    navUsuarios.classList.toggle('hidden', !hasPageAccess('usuarios'));
    document.getElementById('nav-financeiro').classList.toggle('hidden', !hasPageAccess('financeiro')); // ESSA LINHA É CRUCIAL

    // --- 2. LÓGICA DE HABILITAÇÃO DE AÇÕES ---
    // (Esta parte permanece como definimos anteriormente, mas incluída aqui para garantir)
    const fullActionAccessRoles = ['Estoquista', 'Desenvolvedor'];
    const userManagementRoles = ['Estoquista', 'Desenvolvedor', 'Administrador'];
    const clientManagementRoles = ['Desenvolvedor', 'Estoquista', 'Administrador', 'Suporte'];

    const canPerformAllActions = fullActionAccessRoles.includes(currentUser.role);
    const canManageUsers = userManagementRoles.includes(currentUser.role);
    const canManageClients = clientManagementRoles.includes(currentUser.role);

    if (userForm) {
        userForm.querySelectorAll('input, select, button').forEach(el => {
            el.disabled = !canManageUsers;
        });
    }
    if (stockForm) {
        stockForm.querySelectorAll('input, select, button').forEach(el => {
            el.disabled = !canPerformAllActions;
        });
    }

    const clientModalButton = document.getElementById('open-client-modal-button');
    const clientCard = document.getElementById('card-manage-clients');
    const userPageClientButton = document.getElementById('usuarios-page-manage-clients-button');

    if (clientModalButton) { clientModalButton.classList.toggle('hidden', !canManageClients); }
    if (clientCard) { clientCard.classList.toggle('hidden', !canManageClients); }
    if (userPageClientButton) { userPageClientButton.classList.toggle('hidden', !canManageClients); }

    if (vehicleAddForm) {
        vehicleAddForm.querySelectorAll('input, select, button').forEach(el => {
            el.disabled = !canPerformAllActions;
        });
    }
    if (vehicleRemoveForm) {
        vehicleRemoveForm.querySelectorAll('input, select, button').forEach(el => {
            el.disabled = !canPerformAllActions;
        });
    }
    document.querySelectorAll('.withdraw-from-rectification-button').forEach(button => {
        button.disabled = !canPerformAllActions;
    });


    // --- 3. LÓGICA DE EXIBIÇÃO DE ABAS INTERNAS ---
    // Esta parte depende das funções has...Access que já corrigimos.
    
    userTabs.forEach(tab => {
        tab.classList.toggle('hidden', !hasUserTabAccess(tab.id.replace('tab-','')));
    });
    stockTabs.forEach(tab => {
        tab.classList.toggle('hidden', !hasStockTabAccess(tab.id.replace('tab-','')));
    });
    vehicleTabs.forEach(tab => {
        tab.classList.toggle('hidden', !hasVehicleModalTabAccess(tab.dataset.tab));
    });
    
    // Lógica final que garante que a aba correta seja exibida ao carregar a página
    // (Esta parte pode permanecer como estava no seu código original)
    const currentPageElement = document.querySelector('main > div:not(.hidden)');
    if (currentPageElement) {
        const pageId = currentPageElement.id;
        if (pageId === 'page-usuarios' && !document.querySelector('#page-usuarios .user-tab:not(.hidden)')) {
            switchUserTab(getDefaultUserTab());
        }
        // Adicionar lógica similar para outras páginas com abas se necessário
    }
}

    async function loadDataFromStorage(key) {
        try {
            const data = await localforage.getItem(key);
            return data || [];
        } catch (error) {
            console.error(`Erro ao carregar ${key} do IndexedDB:`, error);
            return [];
        }
    }

    async function saveDataToStorage(key, data) {
        try {
            await localforage.setItem(key, data);
        } catch (error) {
            console.error(`Erro ao salvar ${key} no IndexedDB:`, error);
        }
    }

    async function loadProducts() {
        try {
            const result = await DataService.getProductsInfo(currentUser.role);
            products = result.data;
            await saveDataToStorage('products', products);
        } catch (error) {
            products = await loadDataFromStorage('products');
            if (products.length === 0) showFeedbackModal('Erro', 'Não foi possível carregar definições de produtos. Modo offline ou erro de rede/API.', 'error');
            console.warn('Erro ao carregar produtos do servidor, usando cache local:', error);
        }
    }

    async function loadInventory() {
        try {
            const result = await DataService.getInventory(currentUser.role);
            mainInventory = result.data;
            await saveDataToStorage('mainInventory', mainInventory);
        } catch (error) {
            mainInventory = await loadDataFromStorage('mainInventory');
            if (mainInventory.length === 0) showFeedbackModal('Erro', 'Não foi possível carregar estoque principal. Modo offline ou erro de rede/API.', 'error');
            console.warn('Erro ao carregar inventário principal do servidor, usando cache local:', error);
        }
    }

    // NOVA VERSÃO OTIMIZADA DA FUNÇÃO
    async function loadVehicleInventories() {
        try {
            // Faz uma única chamada para pegar todos os inventários
            const result = await DataService.getAllVehicleInventories(currentUser.role);
            
            // Atualiza a variável local com os dados recebidos
            vehicleInventory = result.data;
    
            // Salva cada inventário no cache local individualmente
            for (const name in vehicleInventory) {
                if (Object.hasOwnProperty.call(vehicleInventory, name)) {
                    await saveDataToStorage(`vehicleInventory_${name}`, vehicleInventory[name]);
                }
            }
        } catch (error) {
            console.error('Falha ao carregar inventários de veículos do servidor, usando cache local.', error);
            // Se a chamada principal falhar, tenta carregar do cache como antes
            const vehicleNames = ['montana', 'uno', 'pajero', 'estoqueAlternativo'];
            for (const name of vehicleNames) {
                vehicleInventory[name] = await loadDataFromStorage(`vehicleInventory_${name}`);
            }
        }
    }

    async function loadRedirectInventory() {
        try {
            const result = await DataService.getRedirectInventory(currentUser.role);
            redirectInventory = result.data;
            await saveDataToStorage('redirectInventory', redirectInventory);
        } catch (error) {
            redirectInventory = await loadDataFromStorage('redirectInventory');
            console.warn('Erro ao carregar inventário de redirecionamento do servidor, usando cache local:', error);
        }
    }

    async function loadTransactionLogs() {
        try {
            const result = await DataService.getTransactionLogs(currentUser.role);
            transactionLog = result.data;
            await saveDataToStorage('transactionLog', transactionLog);
        } catch (error) {
            transactionLog = await loadDataFromStorage('transactionLog');
            console.warn('Erro ao carregar logs de transação do servidor, usando cache local:', error);
        }
    }

    async function loadUsers() {
        try {
            const result = await DataService.getUsers(currentUser.role);
            userList = result.data;
            await saveDataToStorage('userList', userList);
        }  catch (error) {
            userList = await loadDataFromStorage('userList');
            if (userList.length === 0) showFeedbackModal('Erro', 'Não foi possível carregar a lista de usuários. Modo offline ou erro de rede/API.', 'error');
            console.warn('Erro ao carregar usuários do servidor, usando cache local:', error);
        }
    }

    async function loadClients() {
        try {
            const result = await DataService.getClients(currentUser.role);
            clientList = result.data;
            await saveDataToStorage('clientList', clientList);
        } catch (error) {
            clientList = await loadDataFromStorage('clientList');
            if (clientList.length === 0) showFeedbackModal('Erro', 'Não foi possível carregar a lista de clientes. Modo offline ou erro de rede/API.', 'error');
            console.warn('Erro ao carregar clientes do servidor, usando cache local:', error);
        }
    }

    async function loadClientActivities() {
        try {
            const result = await DataService.getClientActivities(currentUser.role);
            clientActivities = result.data;
            await saveDataToStorage('clientActivities', clientActivities);
        } catch (error)
        {
            clientActivities = await loadDataFromStorage('clientActivities');
            console.warn('Erro ao carregar atividades de cliente do servidor, usando cache local:', error);
        }
    }

    async function loadRectificationItems() {
        try {
            const result = await DataService.getRectificationItems(currentUser.role);
            rectificationItems = result.data;
            await saveDataToStorage('rectificationItems', rectificationItems);
        } catch (error) {
            rectificationItems = await loadDataFromStorage('rectificationItems');
            console.warn('Erro ao carregar itens de retífica do servidor, usando cache local:', error);
        }
    }

    async function logTransaction(action, patrimonio, source, destination) {
        if (!currentUser) return;
        const logData = {
        timestamp: new Date().toISOString(),
        user: currentUser.name,
        action_log: action, // <---- CORREÇÃO: mude 'action' para 'action_log: action'
        patrimonio,
        source,
        destination
    };
        try {
            await DataService.logTransaction(logData, currentUser.role);
            transactionLog.unshift(logData);
            await saveDataToStorage('transactionLog', transactionLog);
        } catch (error) {
            console.error('Erro ao registrar transação online, adicionando à fila de sincronização:', error);
            await enqueuePendingOperation({ type: 'LOG_TRANSACTION', payload: logData });
            transactionLog.unshift(logData);
            showFeedbackModal('Offline', `Transação de ${action} será registrada quando a conexão for reestabelecida.`, 'info');
        }
    }

    function renderLogView() {
        movimentacoesTableBody.innerHTML = '';
        movimentacoesNoResults.classList.toggle('hidden', transactionLog && transactionLog.length > 0);
        if (transactionLog) {
            transactionLog.forEach(log => {
                const formattedTimestamp = log.timestamp 
                    ? new Date(log.timestamp).toLocaleString('pt-BR', { 
                        year: 'numeric', month: 'numeric', day: 'numeric',
                        hour: '2-digit', minute: '2-digit', second: '2-digit',
                        timeZone: 'America/Sao_Paulo' 
                      })
                    : 'N/A';
                movimentacoesTableBody.innerHTML += `
                    <tr>
                        <td class="td-style">${formattedTimestamp}</td>
                        <td class="td-style">${log.user || 'N/A'}</td>
                        <td class="td-style">${log.action || 'N/A'}</td>
                        <td class="td-style font-semibold text-gray-700">${log.patrimonio || 'N/A'}</td>
                        <td class="td-style">${log.source || 'N/A'}</td>
                        <td class="td-style">${log.destination || 'N/A'}</td>
                    </tr>
                `;
            });
        }
    }
    
    function getTotalStockById(productId) {
        let total = 0;
        total += mainInventory.filter(item => String(item.id) === String(productId)).length;
        for (const vehicle in vehicleInventory) {
            total += vehicleInventory[vehicle].filter(item => String(item.id) === String(productId)).length;
        }
        return total;
    }
    
    function renderStatusDashboard() {
        const totalProducts = new Set([...mainInventory, ...Object.values(vehicleInventory).flat(), ...redirectInventory].map(i => i.id)).size;
        const totalVehiclesWithItems = Object.values(vehicleInventory).filter(vehicle => vehicle.length > 0).length;
        const totalUsers = userList.length;
        try {
    DataService.getConsumptionLogCount(currentUser.role)
        .then(consumptionResult => {
        document.getElementById('status-total-consumption').textContent = consumptionResult.data.total;
        });
} catch (error) {
    console.error("Falha ao carregar contagem de consumo:", error);
    document.getElementById('status-total-consumption').textContent = "?";
}
        const totalRectification = rectificationItems.length;
        const buyList = Object.values(products).filter(productInfo => {
            const currentStock = getTotalStockById(productInfo.id);
            const safetyStock = Number(productInfo.safetyStock) || 0;
            return currentStock <= safetyStock;
        });
        document.getElementById('status-total-products').textContent = totalProducts;
        document.getElementById('status-total-vehicles').textContent = totalVehiclesWithItems;
        document.getElementById('status-total-buy').textContent = buyList.length;
        document.getElementById('status-total-rectification').textContent = totalRectification;
        document.getElementById('status-total-users').textContent = totalUsers;
        const ctx = document.getElementById('item-distribution-chart').getContext('2d');
        const labels = ['Estoque Principal', ...Object.keys(vehicleInventory).map(name => name.charAt(0).toUpperCase() + name.slice(1))];
        const data = [mainInventory.length, ...Object.values(vehicleInventory).map(vehicle => vehicle.length)];
        if(itemChart) {
            itemChart.destroy();
        }
        DataService.getClients(currentUser.role)
        .then(result => {
            document.getElementById('status-total-clients').textContent = result.data.length;
        })
        .catch(error => {
            console.error("Falha ao carregar contagem de clientes:", error);
            document.getElementById('status-total-clients').textContent = "?";
        });
        itemChart = new Chart(ctx, {
            type: 'doughnut',
            data: {
                labels: labels,
                datasets: [{
                    label: 'Distribuição de Itens',
                    data: data,
                    backgroundColor: [
                        'rgba(59, 130, 246, 0.7)',
                        'rgba(16, 185, 129, 0.7)',
                        'rgba(107, 114, 128, 0.7)',
                        'rgba(245, 158, 11, 0.7)',
                        'rgba(239, 68, 68, 0.7)'
                    ],
                    borderColor: '#fff',
                    borderWidth: 2
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    legend: { position: 'top' },
                }
            }
        });
        renderClientActivityDashboard();
        renderRectificationChart();
        document.getElementById('status-total-towers').textContent = towersData.length;
        DataService.getHistoricoCombustivel({}, currentUser.role)
    .then(result => {
        // Esta linha coloca o número de registros (ex: 33) dentro do elemento com o ID correto
        document.getElementById('status-total-fillups').textContent = result.data.length;
    })
    .catch(error => {
        console.error("Falha ao carregar resumo de combustível:", error);
        document.getElementById('status-total-fillups').textContent = "?";
    });
    }

    function renderRectificationChart() {
        const ctx = document.getElementById('rectification-chart').getContext('2d');
        const rectificationCounts = rectificationItems.reduce((acc, item) => {
            const productName = getProductName(item.id);
            acc[productName] = (acc[productName] || 0) + 1;
            return acc;
        }, {});
        const labels = Object.keys(rectificationCounts);
        const data = Object.values(rectificationCounts);
        if (rectificationChart) {
            rectificationChart.destroy();
        }
        rectificationChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: labels,
                datasets: [{
                    label: 'Itens em Retífica por Produto',
                    data: data,
                    backgroundColor: 'rgba(245, 158, 11, 0.8)',
                    borderColor: 'rgba(245, 158, 11, 1)',
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                scales: { y: { beginAtZero: true, title: { display: true, text: 'Quantidade de Itens' } } },
                plugins: { legend: { display: false } }
            }
        });
    }
    
    function renderClientActivityDashboard(searchTerm = '') {
        const dashboard = document.getElementById('client-activity-dashboard');
        dashboard.innerHTML = '';
        const term = searchTerm.toLowerCase().trim();
        let activitiesToDisplay = clientActivities;
        if (term) {
            activitiesToDisplay = activitiesToDisplay.filter(act => String(act.clientName).toLowerCase().includes(term));
        }
        if (activitiesToDisplay.length === 0) {
            dashboard.innerHTML = '<p class="text-center text-gray-500">Nenhuma atividade encontrada.</p>';
            return;
        }
        activitiesToDisplay.forEach(act => {
            const formattedDate = act.date 
    ? new Date(act.date).toLocaleString('pt-BR', { 
        year: 'numeric', month: '2-digit', day: '2-digit',
        hour: '2-digit', minute: '2-digit', second: '2-digit',
        timeZone: 'America/Sao_Paulo' 
      })
    : 'N/A';
            const card = `
                <div class="activity-card">
                    <div class="activity-card-header">
                        <span class="font-bold">${act.clientName || 'N/A'}</span>
                        <span class="text-sm text-gray-500">${formattedDate}</span>
                    </div>
                    <div class="activity-card-body">
                        <p><strong>Motivo:</strong> ${act.reason || 'N/A'}</p>
                        <p><strong>Patrimônio:</strong> ${act.patrimonio || 'N/A'}</p>
                        <p><strong>Executado por:</strong> ${act.userName || 'N/A'}</p>
                        ${act.tower ? `<p><strong>Torre:</strong> ${act.tower || 'N/A'}</p>` : ''}
                        ${act.sector ? `<p><strong>Setor:</strong> ${act.sector || 'N/A'}</p>` : ''}
                    </div>
                </div>
            `;
            dashboard.innerHTML += card;
        });
    }

    function renderRectificationSummaryModal() {
        let content = '<ul class="space-y-2">';
        if (rectificationItems.length > 0) {
            const groupedRectification = rectificationItems.reduce((acc, item) => {
                const productName = getProductName(item.id);
                acc[productName] = (acc[productName] || 0) + 1;
                return acc;
            }, {});
            Object.entries(groupedRectification).forEach(([productName, count]) => {
                content += `<li class="p-2 bg-orange-100 rounded-md">${productName} - <span class="font-bold">${count} itens</span></li>`;
            });
        } else {
            content += '<li>Nenhum item em retífica.</li>';
        }
        content += '</ul>';
        showInfoModal('Itens em Retífica', content);
    }

    function switchStockTab(activeTabName) {
        if (!hasStockTabAccess(activeTabName)) {
            const fallbackTab = hasStockTabAccess('saldo') ? 'saldo' : 'cadastro';
            if (activeTabName !== fallbackTab) {
                showFeedbackModal('Acesso Negado', 'Você não tem permissão para acessar esta seção.', 'error');
                switchStockTab(fallbackTab); 
            }
            return;
        }
        stockTabs.forEach(tab => {
            const isTabActive = tab.id === `tab-${activeTabName}`;
            tab.className = `stock-tab whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm ${isTabActive ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300'}`;
        });
        sectionCadastro.classList.toggle('hidden', activeTabName !== 'cadastro');
        sectionSaldo.classList.toggle('hidden', activeTabName !== 'saldo');
        sectionRedirecionamento.classList.toggle('hidden', activeTabName !== 'redirecionamento');
        if (activeTabName === 'saldo') {
            toggleTableLoading(stockTableLoadingIndicator, stockTableContent, true);
            renderStockView(stockSearchInput.value.trim());
            toggleTableLoading(stockTableLoadingIndicator, stockTableContent, false);
        }
        if (activeTabName === 'redirecionamento') {
            toggleTableLoading(redirectTableLoadingIndicator, redirectTableContent, true);
            renderRedirectView();
            toggleTableLoading(redirectTableLoadingIndicator, redirectTableContent, false);
        }
    }

    function getProductName(id) {
        const product = products.find(p => String(p.id) === String(id));
        return product ? product.nome || 'Produto Desconhecido' : 'Produto Desconhecido';
    }

    function renderStockView(searchTerm = '') {
        stockTableBody.innerHTML = '';
        const term = searchTerm.toLowerCase().trim();
        let inventoryToDisplay = mainInventory;
        if (term) {
            inventoryToDisplay = inventoryToDisplay.filter(item =>
                String(item.id).toLowerCase().includes(term) ||
                (item.produto && String(item.produto).toLowerCase().includes(term)) ||
                String(item.patrimonio).toLowerCase().includes(term)
            );
        }
        stockNoResults.classList.toggle('hidden', inventoryToDisplay.length > 0);
        const grouped = inventoryToDisplay.reduce((acc, item) => {
            const productId = String(item.id);
            acc[productId] = acc[productId] || [];
            acc[productId].push(item);
            return acc;
        }, {});
        Object.values(grouped).forEach(group => {
            const firstItem = group[0];
            let patrimonioCellContent;
            if (group.length > 1) {
                const patrimoniosList = group.map(item => `<div class="p-1">${item.patrimonio}</div>`).join('');
                patrimonioCellContent = `<details><summary class="font-medium text-indigo-600 hover:text-indigo-800">Ver (${group.length})</summary><div class="mt-2 text-left bg-gray-50 p-2 rounded-md shadow-inner">${patrimoniosList}</div></details>`;
            } else {
                patrimonioCellContent = firstItem?.patrimonio || 'N/A';
            }
            stockTableBody.innerHTML += `<tr>
                <td class="td-style">${firstItem.id || 'N/A'}</td>
                <td class="td-style">${firstItem.produto || 'N/A'}</td>
                <td class="td-style">${firstItem.endereco || 'N/A'}</td>
                <td class="td-style">${patrimonioCellContent}</td>
                <td class="td-style font-semibold">${group.length}</td>
            </tr>`;
        });
    }

    function renderProductSummary() {
        const container = document.getElementById('product-summary-content');
        if (!container) return;

        // 1. Cria um mapa para contar as quantidades
        const quantityMap = new Map();

        // 2. Conta os itens do inventário principal
        mainInventory.forEach(item => {
            quantityMap.set(item.id, (quantityMap.get(item.id) || 0) + 1);
        });

        // 3. Conta os itens de todos os veículos
        for (const vehicle in vehicleInventory) {
            vehicleInventory[vehicle].forEach(item => {
                quantityMap.set(item.id, (quantityMap.get(item.id) || 0) + 1);
            });
        }

        // 4. Ordena os produtos por ID
        const sortedProducts = [...products].sort((a, b) => {
            // Converte IDs para número para uma ordenação numérica correta
            return parseInt(a.id, 10) - parseInt(b.id, 10);
        });

        // 5. Monta o HTML do resumo
        container.innerHTML = `
            <table class="min-w-full divide-y divide-gray-200">
                <thead class="bg-gray-50">
                    <tr>
                        <th class="th-style">ID</th>
                        <th class="th-style text-left">Nome do Produto</th>
                        <th class="th-style">Qtd. Total</th>
                    </tr>
                </thead>
                <tbody class="bg-white divide-y divide-gray-200">
                    ${sortedProducts.map(product => `
                        <tr>
                            <td class="td-style font-mono">${product.id}</td>
                            <td class="td-style text-left font-medium text-gray-800">${product.nome || 'Nome não definido'}</td>
                            <td class="td-style font-bold text-lg">${quantityMap.get(product.id) || 0}</td>
                        </tr>
                    `).join('')}
                </tbody>
            </table>
        `;
    }

    // VERSÃO CORRIGIDA
function renderRedirectView() {
    redirectTableBody.innerHTML = '';
    redirectNoResults.classList.toggle('hidden', redirectInventory.length > 0);

    // Define a lista de quem pode usar o botão de ações
    const allowedRoles = ['Estoquista', 'Desenvolvedor'];
    const canPerformAction = allowedRoles.includes(currentUser.role);

    redirectInventory.forEach(item => {
        // Adiciona o atributo 'disabled' ao botão se o usuário não tiver permissão
        const actionCellContent = `
            <div class="relative inline-block text-left">
                <button type="button" class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 action-dropdown-button" 
                        id="options-menu-${item.patrimonio}" aria-haspopup="true" aria-expanded="true" ${!canPerformAction ? 'disabled' : ''}>
                    Ações <i class="fas fa-ellipsis-v ml-2 -mr-1 text-gray-500"></i>
                </button>
                <div class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 hidden z-10 action-dropdown-menu" role="menu" aria-orientation="vertical" aria-labelledby="options-menu-${item.patrimonio}">
                    <div class="py-1" role="none">
                        <span class="block px-4 py-2 text-sm text-gray-700 font-bold">Redirecionar para:</span>
                        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 redirect-option" data-patrimonio-id="${item.patrimonio}" data-destination="mainInventory">Estoque Principal</a>
                        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 redirect-option" data-patrimonio-id="${item.patrimonio}" data-destination="montana">Montana</a>
                        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 redirect-option" data-patrimonio-id="${item.patrimonio}" data-destination="uno">Uno</a>
                        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 redirect-option" data-patrimonio-id="${item.patrimonio}" data-destination="pajero">Pajero</a>
                        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 redirect-option" data-patrimonio-id="${item.patrimonio}" data-destination="estoqueAlternativo">Estoque Alternativo</a>
                        <div class="border-t border-gray-100"></div>
                        <a href="#" class="block px-4 py-2 text-sm text-red-700 hover:bg-red-100 send-to-rectification-option" data-patrimonio-id="${item.patrimonio}">Enviar p/ Retífica</a>
                    </div>
                </div>
            </div>
        `;
        redirectTableBody.innerHTML += `
            <tr>
                <td class="td-style">${item.id || 'N/A'}</td>
                <td class="td-style">${item.produto || 'N/A'}</td>
                <td class="td-style font-semibold text-gray-700">${item.patrimonio || 'N/A'}</td>
                <td class="td-style">${item.removedFrom || 'N/A'}</td>
                <td class="td-style">${actionCellContent}</td>
            </tr>
        `;
    });
}
    
    function switchUserTab(activeTabName) {
        // Confere se o usuário tem permissão para ver a aba, senão volta para a padrão
        if (!hasUserTabAccess(activeTabName)) {
            const fallbackTab = getDefaultUserTab();
            if (activeTabName !== fallbackTab) {
                showFeedbackModal('Acesso Negado', 'Você não tem permissão para acessar esta seção.', 'error');
                switchUserTab(fallbackTab); 
            }
            return;
        }

        // Atualiza a aparência das abas (qual está ativa)
        userTabs.forEach(tab => {
            const isTabActive = tab.id === `tab-${activeTabName}`;
            tab.className = `user-tab whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm ${isTabActive ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300'}`;
        });

        // Mostra a seção correta e esconde as outras
        sectionUserList.classList.toggle('hidden', activeTabName !== 'user-list');
        sectionClientActivity.classList.toggle('hidden', activeTabName !== 'client-activity');
        sectionRectification.classList.toggle('hidden', activeTabName !== 'rectification');

        // Lógica específica para cada aba
        if (activeTabName === 'user-list') {
            toggleTableLoading(userTableLoadingIndicator, userTableContent, true);
            renderUserView();
            toggleTableLoading(userTableLoadingIndicator, userTableContent, false);
        }
        
        if (activeTabName === 'client-activity') {
            // *** AQUI ESTÁ A CORREÇÃO ***
            // Garante que os dados do usuário logado e da lista de usuários sejam preenchidos
            activityDateInput.value = new Date().toLocaleDateString('pt-BR');
            if (currentUser) {
                activityCurrentUserName.value = currentUser.name; // Pega o nome do usuário logado
                activityCurrentUserId.value = currentUser.id;
            }

            activityOtherUsersSelect.innerHTML = ''; // Limpa a lista antes de preencher
            // Filtra a lista de usuários para não incluir o usuário logado
            const otherUsers = userList.filter(user => 
    String(user.id) !== String(currentUser.id) && 
    user.role !== 'Desenvolvedor'
);
            otherUsers.forEach(user => {
                const option = document.createElement('option');
                option.value = user.id;
                option.textContent = user.name; // Usa a propriedade 'name' que vem da API
                activityOtherUsersSelect.appendChild(option);
            });
            
            // Prepara a lista de patrimônios
            populatePatrimonioSelects();
            populateConsumablesSelect();
            populateTowerSelect();

            // Adicione estas duas funções no seu script.js

// Esta função popula o dropdown de Torres
function populateTowerSelect() {
    const select = document.getElementById('activity-tower-select');
    if (!select) return;

    select.innerHTML = '<option value="">Selecione uma Torre</option>'; // Opção padrão
    
    if (towersData && towersData.length > 0) {
        towersData.forEach(torre => {
            // Usamos o NOME da torre como valor para facilitar
            const option = new Option(torre.nome, torre.nome);
            select.add(option);
        });
    } else {
        select.innerHTML = '<option value="">Nenhuma torre cadastrada</option>';
    }
}

// Esta função atualiza o dropdown de Setores com base na Torre selecionada
function updateSectorSelect() {
    const towerSelect = document.getElementById('activity-tower-select');
    const sectorSelect = document.getElementById('activity-sector-select');
    const selectedTowerName = towerSelect.value;

    sectorSelect.innerHTML = '<option value="">Selecione um Setor</option>'; // Limpa e reseta
    sectorSelect.disabled = true; // Mantém desabilitado por padrão

    if (selectedTowerName) {
        const selectedTower = towersData.find(t => t.nome === selectedTowerName);
        if (selectedTower && selectedTower.setores && selectedTower.setores.length > 0) {
            selectedTower.setores.forEach(setor => {
                const option = new Option(setor, setor);
                sectorSelect.add(option);
            });
            sectorSelect.disabled = false; // Habilita o dropdown de setores
        } else {
            sectorSelect.innerHTML = '<option value="">Nenhum setor nesta torre</option>';
        }
    }
}
        }

        if (activeTabName === 'rectification') { 
            toggleTableLoading(rectificationTableLoadingIndicator, rectificationTableContent, true);
            renderRectificationView(); 
            toggleTableLoading(rectificationTableLoadingIndicator, rectificationTableContent, false);
        }
    }

    function renderUserView() {
        userTableBody.innerHTML = '';
        userNoResults.classList.toggle('hidden', userList.length > 0);
        userList.forEach(user => {
            userTableBody.innerHTML += `
                <tr>
                    <td class="td-style">${user.id || 'N/A'}</td>
                    <td class="td-style">${user.name || 'N/A'}</td>
                    <td class="td-style">${user.role || 'N/A'}</td>
                </tr>
            `;
        });
    }

    function renderRectificationView() {
        const rectificationTableBody = document.getElementById('rectification-table-body');
        const rectificationNoResults = document.getElementById('rectification-no-results');
        rectificationTableBody.innerHTML = '';
        rectificationNoResults.classList.toggle('hidden', rectificationItems.length > 0);
        if (rectificationItems.length === 0) {
            rectificationNoResults.classList.remove('hidden');
            return;
        }
        rectificationItems.forEach(item => {
            const actionCellContent = `<div class="flex justify-center items-center h-full"><button class="btn-primary-small withdraw-from-rectification-button" data-patrimonio-id="${item.patrimonio}">Retirar da Retífica</button></div>`;
            rectificationTableBody.innerHTML += `
                <tr>
                    <td class="td-style">${item.id || 'N/A'}</td>
                    <td class="td-style">${item.produto || 'N/A'}</td>
                    <td class="td-style font-semibold text-gray-700">${item.patrimonio || 'N/A'}</td>
                    <td class="td-style">${item.removedFrom || 'N/A'}</td>
                    <td class="td-style">${actionCellContent}</td>
                </tr>
            `;
        });
        applyStyles();
    }

    function switchClientTab(activeTabName) {
        clientTabs.forEach(tab => {
            const isTabActive = tab.id === `tab-${activeTabName}`;
            tab.className = `client-tab whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm ${isTabActive ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300'}`;
        });
        document.getElementById('section-client-registration').classList.toggle('hidden', activeTabName !== 'client-registration');
        document.getElementById('section-client-status').classList.toggle('hidden', activeTabName !== 'client-status');
        if (activeTabName === 'client-status') {
            toggleTableLoading(clientStatusTableLoadingIndicator, clientStatusTableContent, true);
            renderClientStatus();
            toggleTableLoading(clientStatusTableLoadingIndicator, clientStatusTableContent, false);
        }
    }

    function renderClientStatus() {
        clientStatusTableBody.innerHTML = '';
        clientStatusNoResults.classList.toggle('hidden', clientList.length > 0);
        clientList.forEach(client => {
            const clientLatestActivities = clientActivities.filter(act => String(act.clientId) === String(client.id));
            const lastActivity = clientLatestActivities.length > 0 
                ? clientLatestActivities.reduce((latest, current) => new Date(current.date) > new Date(latest.date) ? current : latest, clientLatestActivities[0])
                : {};
            clientStatusTableBody.innerHTML += `
                <tr>
                    <td class="td-style">${client.id || 'N/A'}</td>
                    <td class="td-style">${client.name || 'N/A'}</td>
                    <td class="td-style">${client.tower || 'N/A'}</td>
                    <td class="td-style">${client.sector || 'N/A'}</td>
                    <td class="td-style">${lastActivity.userName || 'N/A'}</td>
                    <td class="td-style">${lastActivity.patrimonio || 'N/A'}</td>
                    <td class="td-style">${lastActivity.reason || 'N/A'}</td>
                    <td class="td-style">${lastActivity.date ? new Date(lastActivity.date).toLocaleString('pt-BR', { year: 'numeric', month: 'numeric', day: 'numeric', hour: '2-digit', minute: '2-digit' }) : 'N/A'}</td>
                </tr>
            `;
        });
    }

    function openVehicleModal(vehicleId, vehicleNameParam) {
        currentVehicle = vehicleId;
        currentVehicleName = vehicleNameParam;
        vehicleModalTitle.textContent = `Gerenciar Carga: ${vehicleNameParam}`;
        const currentVehicleModalTab = document.querySelector('.vehicle-tab.text-indigo-600');
        const currentVehicleModalTabName = currentVehicleModalTab ? currentVehicleModalTab.dataset.tab : null;
        if (currentVehicleModalTabName && hasVehicleModalTabAccess(currentVehicleModalTabName)) {
            switchVehicleModalTab(currentVehicleModalTabName);
        } else {
            if (currentUser.role === 'Administrador' || currentUser.role === 'Operador' || currentUser.role === 'Suporte') {
                switchVehicleModalTab('saldo');
            } else {
                 switchVehicleModalTab('adicionar');
            }
        }
        vehicleModal.classList.remove('hidden');
    }

    // Esta função fecha o modal do veículo e limpa os formulários internos
    function closeVehicleModal() {
        vehicleModal.classList.add('hidden');
        currentVehicle = null;
        currentVehicleName = '';
        vehicleAddForm.reset(); 
        vehicleRemoveForm.reset();
        addIdNotFoundError.classList.add('hidden');
        removeIdNotFoundError.classList.add('hidden');
    }

    function closeVehicleModal() {
        vehicleModal.classList.add('hidden');
        currentVehicle = null;
        currentVehicleName = '';
        vehicleAddForm.reset(); 
        vehicleRemoveForm.reset();
        addIdNotFoundError.classList.add('hidden');
        removeIdNotFoundError.classList.add('hidden');
    }

    function switchVehicleModalTab(activeTabName) {
        if (!hasVehicleModalTabAccess(activeTabName)) {
            const fallbackTab = (currentUser.role === 'Administrador' || currentUser.role === 'Operador') ? 'saldo' : 'adicionar';
            if (activeTabName !== fallbackTab) {
                showFeedbackModal('Acesso Negado', 'Você não tem permissão para acessar esta seção do veículo.', 'error');
                switchVehicleModalTab(fallbackTab);
            }
            return;
        }
        vehicleTabs.forEach(tab => {
            const isTabActive = tab.dataset.tab === activeTabName;
            tab.classList.toggle('hidden', !hasVehicleModalTabAccess(tab.dataset.tab));
            tab.className = `vehicle-tab whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm ${isTabActive ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300'}`;
            document.getElementById(`vehicle-section-${tab.dataset.tab}`).classList.toggle('hidden', !isTabActive);
        });
        if (activeTabName === 'saldo') {
            loadVehicleInventories().then(() => {
                renderVehicleSaldo(vehicleSearchInput.value.trim());
            });
        }
    }

    // Adicione esta nova função ao seu script.js
async function populateConsumablesSelect() {
    const select = document.getElementById('activity-consumables-select');
    if (!select) return;
    select.innerHTML = ''; // Limpa opções antigas
    try {
        const result = await DataService.getItensConsumiveis(currentUser.role);
        if (result.data && result.data.length > 0) {
            result.data.forEach(item => {
                const option = new Option(`${item.nome} (Estoque: ${item.quantidadeEstoque})`, item.nome);
                select.add(option);
            });
        }
    } catch (error) {
        console.error("Erro ao carregar itens de consumo:", error);
    }
}

    function renderVehicleSaldo(searchTerm = '') {
        vehicleSaldoTableBody.innerHTML = '';
        const term = searchTerm.toLowerCase().trim();
        let items = vehicleInventory[currentVehicle] || [];
        if (term) {
            items = items.filter(item =>
                String(item.id).toLowerCase().includes(term) ||
                (item.produto && String(item.produto).toLowerCase().includes(term)) ||
                String(item.patrimonio).toLowerCase().includes(term)
            );
        }
        vehicleNoResults.classList.toggle('hidden', items.length > 0);
        const grouped = items.reduce((acc, item) => {
            const productId = String(item.id);
            acc[productId] = acc[productId] || [];
            acc[productId].push(item);
            return acc;
        }, {});
        Object.values(grouped).forEach(group => {
            const firstItem = group[0];
            let patrimonioCellContent;
            if (group.length > 1) {
                const patrimoniosList = group.map(item => `<div class="p-1">${item.patrimonio}</div>`).join('');
                patrimonioCellContent = `<details><summary class="font-medium text-indigo-600 hover:text-indigo-800">Ver (${group.length})</summary><div class="mt-2 text-left bg-gray-50 p-2 rounded-md shadow-inner">${patrimoniosList}</div></details>`;
            } else {
                patrimonioCellContent = firstItem?.patrimonio || 'N/A';
            }
            vehicleSaldoTableBody.innerHTML += `<tr>
                <td class="td-style">${firstItem.id || 'N/A'}</td>
                <td class="td-style">${firstItem.produto || 'N/A'}</td>
                <td class="td-style">${patrimonioCellContent}</td>
                <td class="td-style font-semibold">${group.length}</td>
            </tr>`;
        });
    }

    async function enqueuePendingOperation(operation) {
        const pendingOperations = await localforage.getItem('pendingOperations') || [];
        pendingOperations.push(operation);
        await localforage.setItem('pendingOperations', pendingOperations);
        if ('sync' in navigator) {
            try {
                await navigator.serviceWorker.ready;
                await navigator.serviceWorker.sync.register('sync-pending-operations');
            } catch (error) {
                console.error('Falha ao registrar sync event:', error);
            }
        }
    }

    window.syncPendingOperations = async () => {
        const pendingOperations = await localforage.getItem('pendingOperations') || [];
        if (pendingOperations.length === 0) {
            console.log('Nenhuma operação pendente para sincronizar.');
            return;
        }
        showGlobalLoading('Sincronizando operações pendentes...');
        let successfulOperations = [];
        for (let i = 0; i < pendingOperations.length; i++) {
            const op = pendingOperations[i];
            try {
                const userRoleToSend = currentUser ? currentUser.role : 'OfflineUser';
                await DataService.callApi(op.type, op.payload, userRoleToSend);
                successfulOperations.push(i);
            } catch (error) {
                console.error(`Falha na sincronização da operação ${op.type}:`, error);
                showFeedbackModal('Erro Sincronização', `Falha ao sincronizar uma operação: ${error.message}. Tentaremos novamente mais tarde.`, 'error');
            }
        }
        const newPendingOperations = pendingOperations.filter((_, idx) => !successfulOperations.includes(idx));
        await localforage.setItem('pendingOperations', newPendingOperations);
        hideGlobalLoading();
        if (newPendingOperations.length === 0) {
            showFeedbackModal('Sincronização Completa', 'Todas as operações offline foram sincronizadas com sucesso!', 'success');
        } else {
            showFeedbackModal('Sincronização Parcial', `${successfulOperations.length} operações sincronizadas. ${newPendingOperations.length} falharam.`, 'info');
        }
        const currentPageElement = document.querySelector('main > div:not(.hidden)');
        if (currentPageElement) {
            loadPageData(currentPageElement.id.replace('page-', ''));
        }
    };

    window.addEventListener('online', () => {
        console.log('Online! Tentando sincronizar operações pendentes...');
        window.syncPendingOperations();
    });
    window.addEventListener('offline', () => {
        showFeedbackModal('Modo Offline', 'Você está offline. As operações serão salvas e sincronizadas quando a conexão for reestabelecida.', 'info');
    });

    async function populatePatrimonioSelects() {
        const selectedVehicle = activityVehicleSelect.value;
        const desktopSelect = activityPatrimonioSelect;
        const mobileCheckboxList = patrimonioCheckboxList;
        desktopSelect.innerHTML = '';
        mobileCheckboxList.innerHTML = '';
        patrimonioModalNoResults.classList.add('hidden');
        desktopSelect.add(new Option('Selecione...', ''));
        activityPatrimonioDisplay.value = 'Nenhum patrimônio selecionado';
        activityPatrimonioValues.value = '';
        if (selectedVehicle) {
            try {
                const vehicleItems = vehicleInventory[selectedVehicle] || [];
                if (vehicleItems && vehicleItems.length > 0) {
                    vehicleItems.forEach(item => {
                        const desktopOption = new Option(`${item.patrimonio} - ${item.produto || getProductName(item.id)}`, item.patrimonio);
                        desktopSelect.add(desktopOption);
                        const checkboxId = `patrimonio-checkbox-${item.patrimonio}`;
                        const checkboxItemHtml = `
                            <div class="patrimonio-checkbox-item">
                                <input type="checkbox" id="${checkboxId}" value="${item.patrimonio}" data-product-name="${item.produto || getProductName(item.id)}">
                                <label for="${checkboxId}">${item.patrimonio} - ${item.produto || getProductName(item.id)}</label>
                            </div>`;
                        mobileCheckboxList.insertAdjacentHTML('beforeend', checkboxItemHtml);
                    });
                } else {
                    patrimonioModalNoResults.classList.remove('hidden');
                }
            } catch (error) {
                console.error('Erro ao carregar itens do veículo para atividade:', error);
                showFeedbackModal('Erro', 'Não foi possível carregar itens do veículo.', 'error');
                patrimonioModalNoResults.classList.remove('hidden');
            }
        }
    }
    
    function applyStyles() {
        document.querySelectorAll('.th-style').forEach(el => el.className = 'px-6 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider');
        document.querySelectorAll('.td-style').forEach(el => el.className = 'px-6 py-4 whitespace-nowrap text-sm text-gray-500 text-center align-middle');
        document.querySelectorAll('.form-input').forEach(el => el.className = 'mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm');
        document.querySelectorAll('.btn-primary').forEach(el => el.className += ' flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500');
        document.querySelectorAll('.btn-primary-small').forEach(el => el.className += ' flex justify-center py-1 px-3 border border-transparent rounded-md shadow-sm text-xs font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500');
        document.querySelectorAll('.btn-secondary-small').forEach(el => el.className += ' flex justify-center py-1 px-3 border border-gray-300 rounded-md shadow-sm text-xs font-medium text-gray-700 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500');
        document.querySelectorAll('.btn-danger').forEach(el => el.className += ' flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500');
        document.querySelectorAll('.btn-secondary').forEach(el => el.className += ' mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm');
        document.querySelectorAll('.table-no-results').forEach(el => el.className = 'text-center py-8 text-gray-500');
        document.querySelectorAll('.form-label').forEach(el => el.className = 'block text-sm font-medium text-gray-600');
        document.querySelectorAll('.error-text').forEach(el => el.className = 'text-red-500 text-xs mt-1');
        document.querySelectorAll('.vehicle-card').forEach(el => el.className += ' bg-white p-6 rounded-lg shadow-md text-center cursor-pointer');
        document.querySelectorAll('.activity-card').forEach(el => el.className += ' bg-white p-4 rounded-lg shadow-sm border-l-4 border-indigo-500');
    }

    // --- EVENT LISTENERS ---
    navEstoque.addEventListener('click', (e) => { e.preventDefault(); showPage('estoque'); });
    navVeiculos.addEventListener('click', (e) => { e.preventDefault(); showPage('veiculos'); });
    navMovimentacoes.addEventListener('click', (e) => { e.preventDefault(); showPage('movimentacoes'); });
    navUsuarios.addEventListener('click', (e) => { e.preventDefault(); showPage('usuarios'); });
    navStatus.addEventListener('click', (e) => { e.preventDefault(); showPage('status'); });
    mobileMenuButton.addEventListener('click', toggleMobileMenu);
    mobileNavStatus.addEventListener('click', (e) => { e.preventDefault(); showPage('status'); });
    mobileNavEstoque.addEventListener('click', (e) => { e.preventDefault(); showPage('estoque'); });
    mobileNavVeiculos.addEventListener('click', (e) => { e.preventDefault(); showPage('veiculos'); });
    mobileNavMovimentacoes.addEventListener('click', (e) => { e.preventDefault(); showPage('movimentacoes'); });
    mobileNavUsuarios.addEventListener('click', (e) => { e.preventDefault(); showPage('usuarios'); });
    document.getElementById('logout-button').addEventListener('click', logout);
    document.getElementById('card-buy-items').addEventListener('click', async () => { /* ... */ });
    document.getElementById('card-total-products').addEventListener('click', () => {
    renderProductSummary(); // Chama a nova função para montar o conteúdo
    document.getElementById('product-summary-modal').classList.remove('hidden'); // Mostra o modal
});

    document.getElementById('product-summary-close-button').addEventListener('click', () => {
    document.getElementById('product-summary-modal').classList.add('hidden');
});
    document.getElementById('card-vehicle-items').addEventListener('click', async () => { /* ... */ });
    document.getElementById('card-active-users').addEventListener('click', async () => { /* ... */ });
    document.getElementById('card-rectification-items').addEventListener('click', async () => { /* ... */ });

    genericModalCloseButton.addEventListener('click', hideInfoModal);
    stockTabs.forEach(tab => tab.addEventListener('click', () => switchStockTab(tab.id.replace('tab-',''))));
    userTabs.forEach(tab => tab.addEventListener('click', function() { switchUserTab(this.id.replace('tab-','')); }));
    stockSearchInput.addEventListener('keyup', (e) => renderStockView(e.target.value));
    modalCloseButton.addEventListener('click', hideFeedbackModal);
    // ADICIONE ESTE NOVO LISTENER NO FINAL DO SEU SCRIPT.JS

// --- LÓGICA COMPLETA E CORRIGIDA PARA O MODAL DE CLIENTES (COM CARREGAMENTO DE DADOS) ---

// Função central que CARREGA OS DADOS e depois abre o modal
async function openClientManagementModal() {
    showGlobalLoading('Carregando dados dos clientes...');
    try {
        // Garante que os dados mais recentes sejam buscados do servidor
        await Promise.all([loadClients(), loadClientActivities()]);
        
        // Define a aba de cadastro como padrão
        switchClientTab('client-registration');
        
        // Exibe o modal
        const clientModal = document.getElementById('client-modal');
        if (clientModal) {
            clientModal.classList.remove('hidden');
        }
    } catch (error) {
        showFeedbackModal('Erro', `Não foi possível carregar os dados dos clientes: ${error.message}`, 'error');
    } finally {
        hideGlobalLoading();
    }
}

// 1. Listener para o CARD "Gerenciar Clientes" na página inicial
document.getElementById('card-manage-clients')?.addEventListener('click', openClientManagementModal);

// 2. Listener para o BOTÃO "Gerenciar Clientes" que fica na página de estoque
document.getElementById('open-client-modal-button')?.addEventListener('click', openClientManagementModal);

// 3. Listener para o NOVO botão na página de Usuários (ADICIONE ESTA LINHA)
document.getElementById('usuarios-page-manage-clients-button')?.addEventListener('click', openClientManagementModal);
// 4. Listener para o BOTÃO DE FECHAR (X) do modal de clientes
document.getElementById('client-modal-close-button')?.addEventListener('click', () => {
    const clientModal = document.getElementById('client-modal');
    if (clientModal) {
        clientModal.classList.add('hidden');
    }
});

// 5. Listener para as ABAS 'Cadastro' e 'Status'
document.querySelectorAll('.client-tab').forEach(tab => {
    tab.addEventListener('click', function() {
        const tabName = this.id.replace('tab-', '');
        switchClientTab(tabName);
    });
});

// --- FIM DO BLOCO DE CÓDIGO ---

    // Adicione este listener no final do seu script.js
    document.getElementById('activity-consumables-select')?.addEventListener('change', (e) => {
    const selectedOptions = Array.from(e.target.selectedOptions);
    const cableGroup = document.getElementById('cable-length-group');
    const cableInput = document.getElementById('activity-cable-length');
    
    // Procura se alguma opção selecionada inclui a palavra "cabo"
    const isCableSelected = selectedOptions.some(opt => opt.textContent.toLowerCase().includes('cabo'));

    if (isCableSelected) {
        cableGroup.classList.remove('hidden');
    } else {
        cableGroup.classList.add('hidden');
        cableInput.value = ''; // Limpa o valor se não houver cabo selecionado
    }
    // Adicione este listener no final do seu script.js
    document.getElementById('activity-tower-select')?.addEventListener('change', updateSectorSelect);
});
    
    // VERSÃO DE DEPURAÇÃO: Listener para preencher automaticamente os dados do produto
    stockProdutoIdInput.addEventListener('input', async () => {
        // Limpa o console a cada nova digitação para facilitar a leitura
        console.clear();

        const productId = stockProdutoIdInput.value.trim();
        console.log("1. Buscando por ID:", productId); // Log 1: Mostra o ID digitado

        // Se o campo de ID estiver vazio, limpa e habilita os outros campos
        if (!productId) {
            stockProdutoNomeInput.value = '';
            stockProdutoEnderecoInput.value = '';
            stockProdutoNomeInput.readOnly = false;
            stockProdutoEnderecoInput.readOnly = false;
            return;
        }

        // A variável 'mainInventory' já guarda os dados carregados do estoque.
        console.log("2. Estado do Inventário no momento da busca:", mainInventory); // Log 2: Mostra o que há na variável mainInventory

        // Procura o item no inventário principal (dados da aba "Saldo")
        const existingItem = mainInventory.find(item => String(item.id).trim() === String(productId));

        console.log("3. Item Encontrado:", existingItem); // Log 3: Mostra o resultado da busca

        if (existingItem) {
            // Se encontrou um item com o mesmo ID, preenche os campos
            stockProdutoNomeInput.value = existingItem.produto || getProductName(existingItem.id);
            stockProdutoEnderecoInput.value = existingItem.endereco;
            stockProdutoNomeInput.readOnly = true;
            stockProdutoEnderecoInput.readOnly = true;
            stockProdutoPatrimonioInput.focus();
            console.log("4. Ação: Preencheu os campos.");
        } else {
            // Se não encontrou (é um produto novo), limpa e habilita os campos
            stockProdutoNomeInput.value = '';
            stockProdutoEnderecoInput.value = '';
            stockProdutoNomeInput.readOnly = false;
            stockProdutoEnderecoInput.readOnly = false;
            console.log("4. Ação: Limpou os campos para novo produto.");
        }
    });

    stockForm.addEventListener('submit', async (e) => {
    e.preventDefault(); // Impede o recarregamento da página

    const produtoId = stockProdutoIdInput.value.trim();
    const produtoNome = stockProdutoNomeInput.value.trim();
    const endereco = stockProdutoEnderecoInput.value.trim();
    const patrimonio = stockProdutoPatrimonioInput.value.trim();

    if (!produtoId || !produtoNome || !endereco || !patrimonio) {
        showFeedbackModal('Erro de Validação', 'Todos os campos são obrigatórios para o cadastro.', 'error');
        return;
    }

    // Payload para a ação de adicionar o item
    const payload = {
    id: produtoId,
    produto_nome: produtoNome,
    endereco: endereco,
    patrimonio: patrimonio,
    mac_address: document.getElementById('stock-mac-address').value.trim() // <-- LINHA ADICIONADA
};

    showGlobalLoading('Cadastrando item...');

    try {
        // Verifica se a definição do produto (ex: ID 1 = "Antena") já existe
        const productExists = products.some(p => p.id === produtoId);

        // Se não existir na lista local, cria a definição do produto primeiro no banco
        if (!productExists) {
            await DataService.addProductDefinition({ id: produtoId, name: produtoNome, safetyStock: 0 }, currentUser.role);
            // Atualiza a lista local de produtos após adicionar
            await loadProducts(); 
        }

        // Em seguida, adiciona o item ao inventário
        const result = await DataService.addInventoryItem(payload, currentUser.role);

        hideGlobalLoading();
        showFeedbackModal('Sucesso!', result.message, 'success');

        // Limpa o formulário e recarrega a visão do estoque para mostrar o novo item
        stockForm.reset();
        stockProdutoNomeInput.readOnly = false;
        stockProdutoEnderecoInput.readOnly = false;
        await loadInventory();
        renderStockView(); // Atualiza a tabela na aba "Saldo"

    } catch (error) {
        hideGlobalLoading();
        showFeedbackModal('Erro no Cadastro', error.message, 'error');
    }
});
    vehicleCards.forEach(card => card.addEventListener('click', () => openVehicleModal(card.dataset.vehicle, card.dataset.vehicleName)));
    vehicleModalCloseButton.addEventListener('click', closeVehicleModal);
    vehicleTabs.forEach(tab => tab.addEventListener('click', () => switchVehicleModalTab(tab.dataset.tab)));
    vehicleSearchInput.addEventListener('keyup', (e) => renderVehicleSaldo(e.target.value));
    // Listener para preencher automaticamente os dados no modal de adicionar item ao veículo
    addProdutoIdInput.addEventListener('input', async () => {
    const productId = addProdutoIdInput.value.trim();

    // Limpa os campos de resultado anteriores
    addProdutoNomeInput.value = '';
    addProdutoPatrimonioSelect.innerHTML = '';
    addIdNotFoundError.classList.add('hidden');

    if (!productId) {
        return; // Se o campo estiver vazio, não faz nada
    }

    // Filtra o inventário principal para encontrar todos os itens com o ID digitado
    // A busca é feita no 'mainInventory', que é o seu "Saldo do Estoque"
    const availableItems = mainInventory.filter(item => String(item.id) === String(productId));

    if (availableItems.length > 0) {
        // Se encontrou itens...
        // Esconde a mensagem de erro
        addIdNotFoundError.classList.add('hidden');

        // Preenche o nome do produto (pegando do primeiro item encontrado)
        addProdutoNomeInput.value = availableItems[0].produto;

        // Preenche a lista de seleção de Patrimônio com todos os itens disponíveis
        availableItems.forEach(item => {
            const option = document.createElement('option');
            option.value = item.patrimonio;
            option.textContent = item.patrimonio;
            addProdutoPatrimonioSelect.appendChild(option);
        });

    } else {
        // Se não encontrou nenhum item com aquele ID no estoque principal...
        // Mostra a mensagem de erro
        addIdNotFoundError.classList.remove('hidden');
    }
});
    vehicleAddForm.addEventListener('submit', async (e) => {
        e.preventDefault(); // Impede o recarregamento da página
        console.clear();
        console.log("--- DEBUG: Início do Envio do Formulário ---");

        const patrimonio = addProdutoPatrimonioSelect.value;
        console.log("1. Patrimônio selecionado:", patrimonio);

        if (!patrimonio) {
            showFeedbackModal('Erro', 'Por favor, selecione um patrimônio para adicionar.', 'error');
            return;
        }

        // VAMOS INSPECIONAR AS VARIÁVEIS IMPORTANTES
        console.log("2. Chave do veículo que estamos usando (currentVehicle):", currentVehicle);
        console.log("3. Objeto completo do inventário de veículos (vehicleInventory):", JSON.parse(JSON.stringify(vehicleInventory)));

        // Esta é a linha onde o erro acontece. Vamos verificar o que há nela.
        const targetInventoryArray = vehicleInventory[currentVehicle];
        console.log("4. Array de destino encontrado (vehicleInventory[currentVehicle]):", targetInventoryArray);

        // Verificação de segurança para dar uma mensagem de erro mais clara
        if (typeof targetInventoryArray === 'undefined') {
            console.error("ERRO GRAVE: O array para este veículo é 'undefined'. Verifique se a chave em 'vehicleInventory' (log 3) bate exatamente com a chave 'currentVehicle' (log 2).");
            showFeedbackModal('Erro Crítico', `O inventário para o veículo '${currentVehicle}' não foi encontrado.`, 'error');
            return;
        }
        
        const payload = {
            patrimonio: patrimonio,
            vehicleName: currentVehicleName
        };

        showGlobalLoading('Movendo item...');

        try {
            const result = await DataService.addItemToVehicle(payload, currentUser.role);
            await logTransaction('Adicionado ao Veículo', patrimonio, 'Estoque Principal', currentVehicleName);
            
            hideGlobalLoading();
            showFeedbackModal('Sucesso!', result.message, 'success');

            const itemIndex = mainInventory.findIndex(item => item.patrimonio === patrimonio);
            if (itemIndex > -1) {
                const [movedItem] = mainInventory.splice(itemIndex, 1);
                // A linha corrigida:
                targetInventoryArray.push(movedItem);
                
                await saveDataToStorage('mainInventory', mainInventory);
                await saveDataToStorage(`vehicleInventory_${currentVehicle}`, targetInventoryArray);
            }

            vehicleAddForm.reset();
            addProdutoNomeInput.value = '';
            addProdutoPatrimonioSelect.innerHTML = '';
            renderStockView();
            renderVehicleSaldo(); // Re-renderiza o saldo do veículo

        } catch (error) {
            hideGlobalLoading();
            showFeedbackModal('Erro na Operação', error.message, 'error');
        }
    });
    // Listener para o autocomplete do formulário de RETIRADA
removeProdutoIdInput.addEventListener('input', async () => {
    const productId = removeProdutoIdInput.value.trim();
    removeProdutoNomeInput.value = '';
    removeProdutoPatrimonioSelect.innerHTML = '';
    removeIdNotFoundError.classList.add('hidden');

    if (!productId) return;

    // A busca agora é feita no inventário DO VEÍCULO ATUAL
    const availableItems = vehicleInventory[currentVehicle].filter(item => String(item.id) === String(productId));

    if (availableItems.length > 0) {
        removeProdutoNomeInput.value = availableItems[0].produto;
        availableItems.forEach(item => {
            const option = new Option(item.patrimonio, item.patrimonio);
            removeProdutoPatrimonioSelect.add(option);
        });
    } else {
        removeIdNotFoundError.classList.remove('hidden');
    }
});

// Listener para o envio do formulário de RETIRADA
vehicleRemoveForm.addEventListener('submit', async (e) => {
    e.preventDefault();
    const patrimonio = removeProdutoPatrimonioSelect.value;
    if (!patrimonio) {
        showFeedbackModal('Erro', 'Por favor, selecione um patrimônio para retirar.', 'error');
        return;
    }

    const payload = { patrimonio, vehicleName: currentVehicleName };
    showGlobalLoading('Retirando item do veículo...');

    try {
        const result = await DataService.removeItemFromVehicle(payload, currentUser.role);
        
        await logTransaction('Retirado do Veículo', patrimonio, currentVehicleName, 'Redirecionamento');

        hideGlobalLoading();
        showFeedbackModal('Sucesso!', result.message, 'success');

        // Atualiza o estado local
        const vehicleInv = vehicleInventory[currentVehicle];
        const itemIndex = vehicleInv.findIndex(item => item.patrimonio === patrimonio);
        if (itemIndex > -1) {
            const [movedItem] = vehicleInv.splice(itemIndex, 1);
            movedItem.removedFrom = currentVehicleName; // Adiciona a origem
            redirectInventory.push(movedItem);
            await saveDataToStorage(`vehicleInventory_${currentVehicle}`, vehicleInv);
            await saveDataToStorage('redirectInventory', redirectInventory);
        }

        vehicleRemoveForm.reset();
        removeProdutoNomeInput.value = '';
        removeProdutoPatrimonioSelect.innerHTML = '';
        renderVehicleSaldo(); // Atualiza a tabela de saldo do veículo
        renderRedirectView(); // Atualiza a tabela de redirecionamento

    } catch (error) {
        hideGlobalLoading();
        showFeedbackModal('Erro na Operação', error.message, 'error');
    }
});
    vehicleRemoveForm.addEventListener('submit', async (e) => { /* ... */ });
    redirectTableBody.addEventListener('click', async (e) => { /* ... */ });
    document.addEventListener('click', (e) => { /* ... */ });
    sectionRectification.addEventListener('click', async (e) => { /* ... */ });
    userForm.addEventListener('submit', async (e) => {
    e.preventDefault();
    const payload = {
        name: userNameInput.value.trim(),
        email: userEmailInput.value.trim(),
        password: userPasswordInput.value.trim(),
        role: userRoleInput.value
    };

    if (!payload.name || !payload.email || !payload.password) {
        showFeedbackModal('Erro', 'Nome, e-mail e senha são obrigatórios.', 'error');
        return;
    }

    showGlobalLoading('Cadastrando usuário...');
    try {
        const result = await DataService.addUser(payload, currentUser.role);
        hideGlobalLoading();
        showFeedbackModal('Sucesso!', result.message, 'success');
        userForm.reset();
        await loadUsers(); // Recarrega a lista de usuários
        renderUserView(); // Re-renderiza a tabela
    } catch (error) {
        hideGlobalLoading();
        showFeedbackModal('Erro no Cadastro', error.message, 'error');
    }
});

    // Versão CORRIGIDA
redirectTableBody.addEventListener('click', async (e) => {
    // Parte 1: Abrir e fechar o menu dropdown (não muda)
    const dropdownButton = e.target.closest('.action-dropdown-button');
    if (dropdownButton) {
        e.preventDefault();
        const menu = dropdownButton.nextElementSibling;
        document.querySelectorAll('.action-dropdown-menu').forEach(m => {
            if (m !== menu) m.classList.add('hidden');
        });
        menu.classList.toggle('hidden');
        return;
    }

    // Parte 2: Lidar com o clique em uma das opções do menu
    const option = e.target.closest('.redirect-option, .send-to-rectification-option');
    if (option) {
        e.preventDefault();
        const patrimonio = option.dataset.patrimonioId;
        let payload = { patrimonio };

        // --- LÓGICA DE INTERCEPTAÇÃO ADICIONADA AQUI ---
        if (option.classList.contains('redirect-option')) {
            const destination = option.dataset.destination;
            payload.destination = destination;

            // SE o destino for o estoque principal, PEÇA O ENDEREÇO
            if (destination === 'mainInventory') {
                const newAddress = prompt("Por favor, digite o novo endereço de armazenagem para este item:");
                if (!newAddress || newAddress.trim() === '') {
                    alert('Operação cancelada. O endereço é obrigatório.');
                    return; // Para a execução se o usuário cancelar ou não digitar nada
                }
                payload.endereco = newAddress.trim(); // Adiciona o endereço ao payload
            }
        }
        // --- FIM DA LÓGICA DE INTERCEPTAÇÃO ---

        showGlobalLoading('Processando redirecionamento...');

        try {
            let successMessage = '';
            if (option.classList.contains('redirect-option')) {
                const result = await DataService.redirectItem(payload, currentUser.role);
                successMessage = result.message;
                await logTransaction('Redirecionado', patrimonio, 'Redirecionamento', payload.destination);
            } else if (option.classList.contains('send-to-rectification-option')) {
                const result = await DataService.addItemToRectification(payload, currentUser.role);
                successMessage = result.message;
                await logTransaction('Enviado p/ Retífica', patrimonio, 'Redirecionamento', 'Retífica');
            }

            hideGlobalLoading();
            showFeedbackModal('Sucesso!', successMessage, 'success');

            // Atualiza o estado local para refletir a mudança instantaneamente
            await Promise.all([
                loadInventory(),
                loadVehicleInventories(),
                loadRedirectInventory(),
                loadRectificationItems()
            ]);
            // Re-renderiza as tabelas relevantes
            renderRedirectView();
            renderStockView();
            renderRectificationView();

        } catch (error) {
            hideGlobalLoading();
            showFeedbackModal('Erro na Operação', error.message, 'error');
        }
    }
});

    // Adiciona um listener para fechar o menu se clicar fora
    document.addEventListener('click', (e) => {
        if (!e.target.closest('.action-dropdown-button')) {
            document.querySelectorAll('.action-dropdown-menu').forEach(m => m.classList.add('hidden'));
        }
    });
    activityVehicleSelect.addEventListener('change', populatePatrimonioSelects);
    openPatrimonioModalButton.addEventListener('click', () => { /* ... */ });
    closePatrimonioModalButton.addEventListener('click', () => { /* ... */ });
    confirmPatrimonioSelectionButton.addEventListener('click', () => { /* ... */ });
    // Listener para a busca de clientes no formulário de atividade
activityClientInput.addEventListener('keyup', () => {
    const searchTerm = activityClientInput.value.toLowerCase().trim();
    clientSuggestionsContainer.innerHTML = ''; // Limpa sugestões anteriores

    if (searchTerm.length < 2) { // Só busca a partir de 2 caracteres
        clientSuggestionsContainer.classList.add('hidden');
        return;
    }

    // Filtra a lista de clientes com base no que foi digitado
    const filteredClients = clientList.filter(client => 
        client.name.toLowerCase().includes(searchTerm)
    );

    if (filteredClients.length > 0) {
        // Se encontrou clientes, mostra a caixa de sugestões
        clientSuggestionsContainer.classList.remove('hidden');

        // Cria um item de lista para cada cliente encontrado
        filteredClients.forEach(client => {
            const suggestionItem = document.createElement('div');
            suggestionItem.className = 'p-2 hover:bg-indigo-100 cursor-pointer';
            suggestionItem.textContent = client.name;

            // Adiciona um evento de clique para preencher o campo ao selecionar
            suggestionItem.addEventListener('click', () => {
                activityClientInput.value = client.name;
                // Se a tabela de clientes tiver as colunas 'tower' e 'sector', podemos preenchê-las também
                // Exemplo:
                // activityTowerInput.value = client.tower || '';
                // activitySectorInput.value = client.sector || '';
                clientSuggestionsContainer.classList.add('hidden');
            });

            clientSuggestionsContainer.appendChild(suggestionItem);
        });
    } else {
        // Se não encontrou, esconde a caixa
        clientSuggestionsContainer.classList.add('hidden');
    }
});
    // ACHE ESTE EVENT LISTENER NO SEU SCRIPT.JS E SUBSTITUA-O INTEIRAMENTE POR ESTE BLOCO:
clientActivityForm.addEventListener('submit', async (e) => {
    e.preventDefault();

    // --- Início da Seção de Coleta de Dados ---

    // Pega o nome do cliente DIRETAMENTE do elemento no momento do submit
    const clientNameInput = document.getElementById('activity-client').value.trim();

    // Validação imediata do nome do cliente
    if (!clientNameInput) {
        showFeedbackModal('Erro', 'O campo "Cliente" é obrigatório.', 'error');
        return;
    }
    
    const foundClient = clientList.find(c => c.name === clientNameInput);
    if (!foundClient) {
        showFeedbackModal('Erro', 'Cliente inválido. Por favor, selecione um cliente da lista de sugestões.', 'error');
        return;
    }

    const selectedPatrimonios = Array.from(document.getElementById('activity-patrimonio').selectedOptions).map(opt => opt.value);
    if (document.getElementById('activity-patrimonio-values').value) {
        selectedPatrimonios.push(...document.getElementById('activity-patrimonio-values').value.split(','));
    }
    
    // Validação imediata do patrimônio
    if (selectedPatrimonios.length === 0) {
        showFeedbackModal('Erro', 'Pelo menos um patrimônio deve ser selecionado.', 'error');
        return;
    }

    const selectedConsumables = Array.from(document.getElementById('activity-consumables-select').selectedOptions).map(opt => opt.value);
    const otherSelectedUsers = Array.from(document.getElementById('activity-other-users-select').selectedOptions).map(opt => opt.textContent);
    const allExecutors = [currentUser.name, ...otherSelectedUsers].join(', ');

    // --- Fim da Seção de Coleta de Dados ---

    // Montagem do Payload com os dados já validados
    const payload = {
        clientId: foundClient.id,
        clientName: clientNameInput,
        userName: allExecutors,
        patrimonio: selectedPatrimonios.join(', '),
        reason: document.getElementById('activity-reason').value,
        tower: document.getElementById('activity-tower-select').value,
        sector: document.getElementById('activity-sector-select').value,
        consumables: JSON.stringify(selectedConsumables),
        cable_length: document.getElementById('activity-cable-length').value
    };

    showGlobalLoading('Registrando atividade...');

    try {
        const result_activity = await DataService.addClientActivity(payload, currentUser.role);

        const vehicleName = document.getElementById('activity-vehicle').value;
        for (const patrimonio of selectedPatrimonios) {
            await DataService.removeItemFromVehicle({ patrimonio, vehicleName }, currentUser.role);
            await logTransaction('Usado em Atividade', patrimonio, vehicleName, 'Redirecionamento');
        }

        hideGlobalLoading();
        showFeedbackModal('Sucesso!', result_activity.message, 'success');

        clientActivityForm.reset();
        document.getElementById('activity-patrimonio-display').value = 'Nenhum patrimônio selecionado';
        document.getElementById('activity-patrimonio-values').value = '';
        document.getElementById('cable-length-group').classList.add('hidden');
        document.getElementById('activity-sector-select').disabled = true;


        await Promise.all([
            loadClientActivities(),
            loadVehicleInventories(),
            loadRedirectInventory()
        ]);

        populatePatrimonioSelects();
        populateConsumablesSelect();

    } catch (error) {
        hideGlobalLoading();
        showFeedbackModal('Erro no Registro', error.message, 'error');
    }
});

// COLE ESTE BLOCO DE CÓDIGO INTEIRO DENTRO DO SEU SCRIPT.JS

// Esta função popula o dropdown de Torres
function populateTowerSelect() {
    const select = document.getElementById('activity-tower-select');
    if (!select) return;

    select.innerHTML = '<option value="">Selecione uma Torre</option>'; // Opção padrão
    
    if (towersData && towersData.length > 0) {
        towersData.forEach(torre => {
            // Usamos o NOME da torre como valor para facilitar
            const option = new Option(torre.nome, torre.nome);
            select.add(option);
        });
    } else {
        select.innerHTML = '<option value="">Nenhuma torre cadastrada</option>';
    }
}

// Esta função atualiza o dropdown de Setores com base na Torre selecionada
function updateSectorSelect() {
    const towerSelect = document.getElementById('activity-tower-select');
    const sectorSelect = document.getElementById('activity-sector-select');
    const selectedTowerName = towerSelect.value;

    sectorSelect.innerHTML = '<option value="">Selecione um Setor</option>'; // Limpa e reseta
    sectorSelect.disabled = true; // Mantém desabilitado por padrão

    if (selectedTowerName) {
        const selectedTower = towersData.find(t => t.nome === selectedTowerName);
        if (selectedTower && selectedTower.setores && selectedTower.setores.length > 0) {
            selectedTower.setores.forEach(setor => {
                const option = new Option(setor, setor);
                sectorSelect.add(option);
            });
            sectorSelect.disabled = false; // Habilita o dropdown de setores
        } else {
            sectorSelect.innerHTML = '<option value="">Nenhum setor nesta torre</option>';
        }
    }
}
    document.getElementById('client-activity-search').addEventListener('keyup', (e) => { renderClientActivityDashboard(e.target.value); });

    // --- INICIALIZAÇÃO DA APLICAÇÃO ---
    // ===================================================================
// ===== NOVO BLOCO PARA O MODAL DE RESUMO DE VEÍCULOS (ADICIONAR) =====
// ===================================================================

const cardVehicleItems = document.getElementById('card-vehicle-items');

/**
 * Monta o conteúdo HTML do resumo de veículos de forma organizada e estilizada.
 * @param {object} vehicleData - Os dados de inventário dos veículos.
 */
function renderVehicleSummaryContent(vehicleData) {
    const contentContainer = document.getElementById('generic-modal-content');
    
    // Filtra apenas veículos que têm itens
    const vehiclesWithItems = Object.entries(vehicleData).filter(([_, items]) => Array.isArray(items) && items.length > 0);

    if (vehiclesWithItems.length === 0) {
        contentContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum veículo com itens no momento.</p>';
        return;
    }

    let finalHtml = '';

    vehiclesWithItems.forEach(([vehicleName, items]) => {
        // Agrupa os itens por nome de produto (ex: "Bola", "Caderno")
        const groupedByProduct = items.reduce((acc, item) => {
            const productName = item.produto || 'Produto sem nome';
            if (!acc[productName]) {
                acc[productName] = [];
            }
            acc[productName].push(item.patrimonio); // Adiciona o patrimônio à lista do produto
            return acc;
        }, {});

        // Monta o HTML para cada veículo
        finalHtml += `
            <div class="bg-slate-50 border border-slate-200 rounded-lg p-4 mb-4">
                <h4 class="text-lg font-bold text-indigo-700 mb-2">
                    ${vehicleName.charAt(0).toUpperCase() + vehicleName.slice(1)} - ${items.length} item(s)
                </h4>
                <div class="space-y-1 pl-2">
                    ${Object.entries(groupedByProduct).map(([productName, patrimonios]) => `
                        <div class="text-sm">
                            <span class="font-semibold text-slate-800">${productName}:</span>
                            <span class="font-mono text-slate-600">${patrimonios.join(', ')}.</span>
                        </div>
                    `).join('')}
                </div>
            </div>
        `;
    });

    contentContainer.innerHTML = finalHtml;
}

/**
 * Abre o modal e inicia o carregamento dos dados do resumo de veículos.
 */
async function openVehicleSummaryModal() {
    // Reutiliza o modal genérico já existente
    showInfoModal('Resumo de Itens nos Veículos', '<p class="text-center py-8">Carregando...</p>');

    try {
        // Busca os dados mais recentes dos inventários dos veículos
        const result = await DataService.getAllVehicleInventories(currentUser.role);
        renderVehicleSummaryContent(result.data);
    } catch (error) {
        document.getElementById('generic-modal-content').innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar dados: ${error.message}</p>`;
        console.error("Erro ao buscar resumo de veículos:", error);
    }
}

// Adiciona o novo evento de clique ao card
if (cardVehicleItems) {
    cardVehicleItems.addEventListener('click', openVehicleSummaryModal);
}

// ===================================================================
// ======================= FIM DO NOVO BLOCO =========================
// ===================================================================

    // =====================================================================
// ===== NOVO BLOCO PARA O MODAL "ITENS PARA COMPRAR" (ADICIONAR) =====
// =====================================================================

const cardBuyItems = document.getElementById('card-buy-items');

/**
 * Monta o conteúdo HTML da lista de compras dentro do modal genérico.
 */
/**
 * Monta o conteúdo HTML da lista de compras dentro do modal genérico.
 * (VERSÃO CORRIGIDA)
 */
function renderItemsToBuyContent() {
    // Pega o container de conteúdo do modal genérico
    const contentContainer = document.getElementById('generic-modal-content');

    // Define o HTML inicial com a barra de busca e uma área para a lista
    contentContainer.innerHTML = `
        <div class="mb-4">
            <div class="flex items-center relative w-full h-12 rounded-full focus-within:shadow-lg bg-white border-2 border-slate-200 overflow-hidden transition">
                <div class="grid place-items-center h-full w-12 text-slate-400"><i class="fas fa-search"></i></div>
                <input class="peer h-full w-full outline-none text-sm text-slate-700 pr-2" type="text" id="items-to-buy-search" placeholder="Pesquisar por nome ou ID..." />
            </div>
        </div>
        <div id="items-to-buy-list-container">
            <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        </div>
    `;

    const listContainer = document.getElementById('items-to-buy-list-container');
    const searchInput = document.getElementById('items-to-buy-search');

    // Chama a API para buscar o resumo completo de produtos
    DataService.getProductsSummary(currentUser.role)
        .then(result => {
            const allProducts = result.data;
            // Filtra a lista para pegar apenas os itens que precisam ser comprados
            const itemsToBuy = allProducts.filter(p => parseInt(p.quantidadeTotal) <= parseInt(p.safetyStock));

            // Função interna para desenhar a lista de cards
            const renderList = (items) => {
                if (items.length === 0) {
                    listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum item atingiu o estoque de segurança. Tudo certo!</p>';
                    return;
                }
                
                // --- AQUI ESTAVA O ERRO ---
                // Trocamos 'clientsToRender.map(client =>' por 'items.map(product =>'
                // E ajustamos os campos para mostrar os dados corretos do produto.
                listContainer.innerHTML = items.map(product => `
                    <div class="grid grid-cols-4 items-center gap-4 p-3 bg-red-50 border border-red-200 rounded-lg mb-2">
                        <div class="col-span-2">
                            <p class="font-bold text-slate-800">${product.nome}</p>
                            <p class="text-xs text-slate-500 font-mono">ID: ${product.id}</p>
                        </div>
                        <div class="text-center">
                            <p class="text-lg font-bold text-red-600">${product.quantidadeTotal}</p>
                            <p class="text-xs text-slate-500">Em Estoque</p>
                        </div>
                        <div class="text-center">
                            <p class="text-lg font-semibold text-slate-600">${product.safetyStock}</p>
                            <p class="text-xs text-slate-500">Mínimo</p>
                        </div>
                    </div>
                `).join('');
            };

            // Renderiza a lista inicial com todos os itens que precisam de compra
            renderList(itemsToBuy);

            // Adiciona o evento de 'keyup' para filtrar a lista em tempo real
            searchInput.addEventListener('keyup', () => {
                const searchTerm = searchInput.value.toLowerCase().trim();
                // Filtra a lista de itens a comprar que já foi pré-calculada
                const filteredItems = itemsToBuy.filter(p =>
                    p.nome.toLowerCase().includes(searchTerm) ||
                    String(p.id).toLowerCase().includes(searchTerm)
                );
                renderList(filteredItems);
            });
        })
        .catch(error => {
            // Em caso de erro, exibe uma mensagem clara
            listContainer.innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar lista de compras: ${error.message}</p>`;
        });
}


/**
 * Abre o modal de "Itens para Comprar".
 */
function openItemsToBuyModal() {
    // A função showInfoModal já existe no seu script.js e abre o modal genérico
    showInfoModal('Lista de Compras (Estoque Baixo)', 'Carregando...');
    // Chama a função para montar o conteúdo
    renderItemsToBuyContent();
}

// Adiciona o novo evento de clique para o card
if (cardBuyItems) {
    cardBuyItems.addEventListener('click', openItemsToBuyModal);
}
// =======================================================================
// ===== NOVO BLOCO PARA O MODAL "ITENS EM RETÍFICA" (ADICIONAR) =====
// =======================================================================

const cardRectificationItems = document.getElementById('card-rectification-items');

/**
 * Monta o conteúdo do modal de retífica, agrupando itens e com busca.
 */
function renderRectificationSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');

    // Adiciona o HTML da busca e uma área para a lista
    contentContainer.innerHTML = `
        <div class="mb-4">
            <div class="flex items-center relative w-full h-12 rounded-full focus-within:shadow-lg bg-white border-2 border-slate-200 overflow-hidden transition">
                <div class="grid place-items-center h-full w-12 text-slate-400"><i class="fas fa-search"></i></div>
                <input class="peer h-full w-full outline-none text-sm text-slate-700 pr-2" type="text" id="rectification-summary-search" placeholder="Pesquisar por nome ou ID..." />
            </div>
        </div>
        <div id="rectification-list-container">
            <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        </div>
    `;

    const listContainer = document.getElementById('rectification-list-container');
    const searchInput = document.getElementById('rectification-summary-search');

    // Busca os dados da retífica usando o DataService
    DataService.getRectificationItems(currentUser.role)
        .then(result => {
            const allItems = result.data;

            // Função interna para desenhar a lista de cards
            const renderList = (items) => {
                if (items.length === 0) {
                    listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Não há itens em retífica no momento.</p>';
                    return;
                }

                // Agrupa os itens por ID do produto para o layout que você pediu
                const groupedItems = items.reduce((acc, item) => {
                    const id = item.id;
                    if (!acc[id]) {
                        acc[id] = {
                            name: item.produto,
                            patrimonios: []
                        };
                    }
                    acc[id].patrimonios.push(item.patrimonio);
                    return acc;
                }, {});
                
                let sequentialNumber = 0;
                listContainer.innerHTML = Object.entries(groupedItems).map(([productId, productData]) => {
                    sequentialNumber++;
                    return `
                        <div class="bg-slate-50 border border-slate-200 rounded-lg p-4 mb-3">
                            <h5 class="text-md font-bold text-orange-700">
                                Item ${productId} - ${productData.patrimonios.length} unidade(s)
                            </h5>
                            <div class="mt-2 pl-2 text-sm">
                                <span class="font-semibold text-slate-800">${sequentialNumber} - ${productData.name}:</span>
                                <span class="font-mono text-slate-600">${productData.patrimonios.join(', ')}.</span>
                            </div>
                        </div>
                    `;
                }).join('');
            };

            // Renderiza a lista inicial
            renderList(allItems);

            // Adiciona a funcionalidade de busca
            searchInput.addEventListener('keyup', () => {
                const searchTerm = searchInput.value.toLowerCase().trim();
                const filteredItems = allItems.filter(item =>
                    item.produto.toLowerCase().includes(searchTerm) ||
                    String(item.id).toLowerCase().includes(searchTerm)
                );
                renderList(filteredItems);
            });

        })
        .catch(error => {
            listContainer.innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar itens da retífica: ${error.message}</p>`;
        });
}

/**
 * Abre o modal de resumo da retífica.
 */
function openRectificationModal() {
    // Reutiliza a função showInfoModal que já abre o modal genérico
    showInfoModal('Resumo de Itens em Retífica', 'Carregando...');
    renderRectificationSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardRectificationItems) {
    cardRectificationItems.addEventListener('click', openRectificationModal);
}

// ===================================================================
// =====   NOVO BLOCO PARA O MODAL "USUÁRIOS CADASTRADOS"   =====
// ===================================================================

const cardActiveUsers = document.getElementById('card-active-users');

/**
 * Monta o conteúdo do modal de usuários com uma lista simples e busca.
 */
function renderUsersSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');

    // Adiciona o HTML da busca e a área para a lista
    contentContainer.innerHTML = `
        <div class="mb-4">
            <div class="flex items-center relative w-full h-12 rounded-full focus-within:shadow-lg bg-white border-2 border-slate-200 overflow-hidden transition">
                <div class="grid place-items-center h-full w-12 text-slate-400"><i class="fas fa-search"></i></div>
                <input class="peer h-full w-full outline-none text-sm text-slate-700 pr-2" type="text" id="users-summary-search" placeholder="Pesquisar por nome ou ID..." />
            </div>
        </div>
        <div id="users-list-container">
            <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        </div>
    `;

    const listContainer = document.getElementById('users-list-container');
    const searchInput = document.getElementById('users-summary-search');

    // Busca os dados dos usuários usando o DataService
    DataService.getUsers(currentUser.role)
        .then(result => {
            const allUsers = result.data;

            // Função interna para desenhar a lista simples
            const renderList = (users) => {
                if (users.length === 0) {
                    listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum usuário encontrado.</p>';
                    return;
                }
                
                // Cria uma lista simples, como solicitado
                listContainer.innerHTML = `
                    <div class="divide-y divide-slate-200">
                        ${users.map(user => `
                            <div class="flex items-center p-3">
                                <span class="font-mono text-sm text-slate-500 w-12">ID: ${user.id}</span>
                                <span class="font-medium text-slate-800">${user.name}</span>
                            </div>
                        `).join('')}
                    </div>
                `;
            };

            // Renderiza a lista inicial
            renderList(allUsers);

            // Adiciona a funcionalidade de busca
            searchInput.addEventListener('keyup', () => {
                const searchTerm = searchInput.value.toLowerCase().trim();
                const filteredUsers = allUsers.filter(user =>
                    user.name.toLowerCase().includes(searchTerm) ||
                    String(user.id).toLowerCase().includes(searchTerm)
                );
                renderList(filteredUsers);
            });
        })
        .catch(error => {
            listContainer.innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar usuários: ${error.message}</p>`;
        });
}

/**
 * Abre o modal de resumo de usuários.
 */
function openUsersSummaryModal() {
    // Reutiliza a função showInfoModal que abre o modal genérico
    showInfoModal('Usuários Cadastrados', 'Carregando...');
    renderUsersSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardActiveUsers) {
    cardActiveUsers.addEventListener('click', openUsersSummaryModal);
}
// ===================================================================
// =====   NOVO BLOCO PARA O MODAL "RESUMO DE TORRES"       =====
// ===================================================================

const cardDashboardTowers = document.getElementById('card-dashboard-towers');

/**
 * Monta o conteúdo do modal de resumo de torres, replicando o visual da página "Gerenciar".
 * (VERSÃO CORRIGIDA COM SETORES)
 */
function renderTowersSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');

    // Adiciona a busca e a área da lista
    contentContainer.innerHTML = `
        <div class="mb-4">
            <div class="flex items-center relative w-full h-12 rounded-full focus-within:shadow-lg bg-white border-2 border-slate-200 overflow-hidden transition">
                <div class="grid place-items-center h-full w-12 text-slate-400"><i class="fas fa-search"></i></div>
                <input class="peer h-full w-full outline-none text-sm text-slate-700 pr-2" type="text" id="towers-summary-search" placeholder="Pesquisar por nome da torre..." />
            </div>
        </div>
        <div id="towers-list-container">
            <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        </div>
    `;

    const listContainer = document.getElementById('towers-list-container');
    const searchInput = document.getElementById('towers-summary-search');

    // Busca os dados das torres
    DataService.getTowers(currentUser.role)
        .then(result => {
            const allTowers = result.data;

            // Função para desenhar a lista (lógica agora inclui os SETORES)
            const renderList = (towers) => {
                if (towers.length === 0) {
                    listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhuma torre encontrada.</p>';
                    return;
                }

                listContainer.innerHTML = towers.map(torre => {
                    const totalItens = torre.itens ? torre.itens.length : 0;
                    const totalSetores = torre.setores ? torre.setores.length : 0;

                    // Lógica para listar os setores
                    const setoresHtml = totalSetores > 0
                        ? `<ul class="space-y-1">${torre.setores.map(setor => `<li class="text-sm text-slate-600">- ${setor}</li>`).join('')}</ul>`
                        : '<p class="text-sm text-slate-500 italic">Nenhum setor cadastrado.</p>';

                    // Lógica para listar os itens (agrupados)
                    const groupedItems = (torre.itens || []).reduce((acc, item) => {
                        const productName = item.nomeProduto || 'Item sem nome';
                        if (!acc[productName]) {
                            acc[productName] = { count: 0, patrimonios: [] };
                        }
                        acc[productName].count++;
                        acc[productName].patrimonios.push(item.patrimonio);
                        return acc;
                    }, {});

                    const itensHtml = totalItens > 0
                        ? `<ul class="space-y-1">${Object.entries(groupedItems).map(([productName, data]) => `
                            <li class="text-sm text-slate-600">
                                <strong>${productName}</strong> (${data.count}): 
                                <span class="font-mono text-xs text-indigo-700">${data.patrimonios.join(', ')}</span>
                            </li>`).join('')}</ul>`
                        : '<p class="text-sm text-slate-500 italic">Nenhum item alocado.</p>';

                    // Montagem do card final, agora com as duas seções
                    return `
                        <div class="bg-white border border-slate-200 rounded-lg shadow-sm p-5 mb-4">
                            <h3 class="text-lg font-bold text-slate-800 border-b pb-2 mb-3">
                                ${torre.nome}
                                <span class="text-sm font-medium text-indigo-600 ml-2">(${totalSetores} setores e ${totalItens} itens)</span>
                            </h3>
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                                <div>
                                    <h4 class="font-semibold text-slate-700 mb-2">Setores:</h4>
                                    ${setoresHtml}
                                </div>
                                <div>
                                    <h4 class="font-semibold text-slate-700 mb-2">Itens Alocados:</h4>
                                    ${itensHtml}
                                </div>
                            </div>
                        </div>
                    `;
                }).join('');
            };

            // Renderiza a lista inicial
            renderList(allTowers);

            // Adiciona a funcionalidade de busca
            searchInput.addEventListener('keyup', () => {
                const searchTerm = searchInput.value.toLowerCase().trim();
                const filteredTowers = allTowers.filter(torre =>
                    torre.nome.toLowerCase().includes(searchTerm)
                );
                renderList(filteredTowers);
            });
        })
        .catch(error => {
            listContainer.innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar torres: ${error.message}</p>`;
        });
}
/**
 * Abre o modal de resumo de torres.
 */
function openTowersSummaryModal() {
    showInfoModal('Resumo de Torres Cadastradas', 'Carregando...');
    renderTowersSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardDashboardTowers) {
    cardDashboardTowers.addEventListener('click', openTowersSummaryModal);
}
// =======================================================================
// ===== NOVO BLOCO PARA O MODAL "RESUMO DE CONSUMO" (ADICIONAR) =====
// =======================================================================

const cardDashboardConsumption = document.getElementById('card-dashboard-consumption');

// SUBSTITUA A SUA FUNÇÃO renderConsumptionSummaryContent POR ESTA VERSÃO FINAL:

/**
 * Monta o conteúdo completo do modal de consumo, com abas, rankings e filtro de data.
 * (VERSÃO FINAL E CORRIGIDA)
 */
function renderConsumptionSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');

    // Estrutura HTML inicial do modal com abas. A div wrapper corrige o fundo.
    contentContainer.innerHTML = `
        <div class="p-0"> 
            <div class="border-b border-gray-200 mb-4 px-6">
                <nav class="-mb-px flex space-x-6" aria-label="Tabs">
                    <button id="tab-consumo-resumo" class="consumo-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm text-indigo-600 border-indigo-500">Resumo por Usuário</button>
                    <button id="tab-consumo-ranking" class="consumo-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm text-gray-500 border-transparent hover:text-gray-700">Rankings Mensais</button>
                </nav>
            </div>
            <div id="consumo-tab-content" class="px-6 pb-6">
                <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
            </div>
        </div>
    `;

    const tabContent = document.getElementById('consumo-tab-content');
    let allConsumptionData = []; // Armazena os dados do mês atual para a primeira aba

    // Função para desenhar a aba de RANKING
    const renderRankingView = (dateString) => {
        const [year, month] = dateString.split('-');
        
        tabContent.innerHTML = `
            <div class="mb-4">
                <label for="ranking-month-picker" class="block text-sm font-medium text-gray-700">Selecione o Mês para o Ranking:</label>
                <input type="month" id="ranking-month-picker" value="${dateString}" class="mt-1 block w-full md:w-1/2 p-2 border border-gray-300 rounded-md">
            </div>
            <div id="ranking-results" class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        `;
        
        document.getElementById('ranking-month-picker').addEventListener('change', (e) => renderRankingView(e.target.value));

        const rankingResultsContainer = document.getElementById('ranking-results');

        DataService.getHistoricoConsumo({ month, year }, currentUser.role)
            .then(result => {
                const logs = result.data;
                const userRanking = logs.reduce((acc, log) => { acc[log.usuario_nome] = (acc[log.usuario_nome] || 0) + parseInt(log.quantidade_consumida); return acc; }, {});
                const sortedUsers = Object.entries(userRanking).sort(([, a], [, b]) => b - a);
                const materialRanking = logs.reduce((acc, log) => { acc[log.item_nome] = (acc[log.item_nome] || 0) + parseInt(log.quantidade_consumida); return acc; }, {});
                const sortedMaterials = Object.entries(materialRanking).sort(([, a], [, b]) => b - a);

                rankingResultsContainer.innerHTML = `
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        <div>
                            <h4 class="font-bold text-lg mb-2 text-slate-700">Top 5 Usuários</h4>
                            <ol class="list-decimal list-inside bg-white p-4 rounded-lg border space-y-2 h-48 overflow-y-auto">${sortedUsers.length > 0 ? sortedUsers.slice(0, 5).map(([name, qty]) => `<li><span class="font-semibold">${name}</span> - ${qty} unid.</li>`).join('') : '<li class="list-none">Nenhum dado para este mês.</li>'}</ol>
                        </div>
                        <div>
                            <h4 class="font-bold text-lg mb-2 text-slate-700">Top 5 Materiais</h4>
                            <ol class="list-decimal list-inside bg-white p-4 rounded-lg border space-y-2 h-48 overflow-y-auto">${sortedMaterials.length > 0 ? sortedMaterials.slice(0, 5).map(([name, qty]) => `<li><span class="font-semibold">${name}</span> - ${qty} unid.</li>`).join('') : '<li class="list-none">Nenhum dado para este mês.</li>'}</ol>
                        </div>
                    </div>`;
            }).catch(err => {
                rankingResultsContainer.innerHTML = `<p class="text-center text-red-500 py-8">Erro: ${err.message}</p>`;
            });
    };

    // Função para desenhar a aba de RESUMO POR USUÁRIO (com a busca)
    const renderUserSummaryView = (logs) => {
        tabContent.innerHTML = `
            <div class="mb-4">
                <input class="w-full p-2 border border-gray-300 rounded-md" type="text" id="consumption-search" placeholder="Buscar no histórico do mês atual..." />
            </div>
            <div id="consumption-list-container" class="max-h-[50vh] overflow-y-auto pr-2"></div>`;
        
        const listContainer = document.getElementById('consumption-list-container');
        const searchInput = document.getElementById('consumption-search');
        
        const renderList = (filteredLogs) => {
            if (filteredLogs.length === 0) {
                listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum registro encontrado.</p>';
                return;
            }
            const groupedByUser = filteredLogs.reduce((acc, log) => {
                const userName = log.usuario_nome;
                if (!acc[userName]) acc[userName] = [];
                acc[userName].push(log);
                return acc;
            }, {});
            listContainer.innerHTML = Object.entries(groupedByUser).map(([userName, userLogs]) => {
                const itemsGrouped = userLogs.reduce((acc, log) => {
                    const itemName = log.item_nome;
                    if (!acc[itemName]) acc[itemName] = 0;
                    acc[itemName] += parseInt(log.quantidade_consumida);
                    return acc;
                }, {});
                const distinctItemsCount = Object.keys(itemsGrouped).length;
                const totalQuantity = userLogs.reduce((sum, log) => sum + parseInt(log.quantidade_consumida), 0);
                return `
                    <div class="bg-slate-50 border rounded-lg p-4 mb-3">
                        <h4 class="font-bold text-indigo-700">${userName} - ${distinctItemsCount} itens, totalizando ${totalQuantity} quantidades</h4>
                        <ul class="mt-2 pl-4 list-disc list-inside text-sm">
                        ${Object.entries(itemsGrouped).map(([itemName, quantity]) => `<li><span class="font-semibold">${itemName}</span> - ${quantity} unidade(s)</li>`).join('')}
                        </ul>
                    </div>`;
            }).join('');
        };
        
        renderList(logs);
        searchInput.addEventListener('keyup', () => {
            const searchTerm = searchInput.value.toLowerCase().trim();
            const filtered = logs.filter(log => log.usuario_nome.toLowerCase().includes(searchTerm) || log.item_nome.toLowerCase().includes(searchTerm));
            renderList(filtered);
        });
    };
    
    // Função para controlar a troca de abas
    const switchTab = (activeTabId) => {
        document.querySelectorAll('.consumo-summary-tab').forEach(tab => {
            tab.className = `consumo-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm ${tab.id === activeTabId ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700'}`;
        });
        if (activeTabId === 'tab-consumo-resumo') {
            renderUserSummaryView(allConsumptionData);
        } else {
            const today = new Date();
            const year = today.getFullYear();
            const month = String(today.getMonth() + 1).padStart(2, '0');
            renderRankingView(`${year}-${month}`);
        }
    };
    
    // Carrega os dados do mês atual e inicializa a primeira aba
    const today = new Date();
    DataService.getHistoricoConsumo({ month: today.getMonth() + 1, year: today.getFullYear() }, currentUser.role)
        .then(result => {
            allConsumptionData = result.data;
            renderUserSummaryView(allConsumptionData);
            document.getElementById('tab-consumo-resumo').addEventListener('click', () => switchTab('tab-consumo-resumo'));
            document.getElementById('tab-consumo-ranking').addEventListener('click', () => switchTab('tab-consumo-ranking'));
        }).catch(err => {
            tabContent.innerHTML = `<p class="text-center text-red-500 py-8">Erro ao carregar dados: ${err.message}</p>`;
        });
}

/**
 * Abre o modal de resumo de consumo.
 */
function openConsumptionSummaryModal() {
    showInfoModal('Resumo de Consumo', 'Carregando...');
    renderConsumptionSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardDashboardConsumption) {
    cardDashboardConsumption.addEventListener('click', openConsumptionSummaryModal);
}
    // ===================================================================
// =====   NOVO BLOCO PARA O MODAL "RESUMO DE COMBUSTÍVEL"    =====
// ===================================================================

const cardDashboardFuel = document.getElementById('card-dashboard-fuel');

/**
 * Processa os dados brutos de abastecimento e agrupa por veículo.
 * @param {Array} logs - A lista de todos os registros de abastecimento.
 * @returns {object} - Um objeto com os dados calculados para cada veículo.
 */
function processFuelData(logs) {
    const dataByVehicle = logs.reduce((acc, log) => {
        const vehicleName = log.veiculo_nome;
        if (!acc[vehicleName]) {
            acc[vehicleName] = { logs: [], minHodo: Infinity, maxHodo: 0, totalLiters: 0, totalValue: 0 };
        }
        const hodo = parseInt(log.hodometro);
        acc[vehicleName].logs.push(log);
        acc[vehicleName].totalLiters += parseFloat(log.litros);
        acc[vehicleName].totalValue += parseFloat(log.valor_total);
        if (hodo < acc[vehicleName].minHodo) acc[vehicleName].minHodo = hodo;
        if (hodo > acc[vehicleName].maxHodo) acc[vehicleName].maxHodo = hodo;
        
        return acc;
    }, {});

    // Calcula os totais finais para cada veículo
    for (const vehicle in dataByVehicle) {
        const vData = dataByVehicle[vehicle];
        vData.fillupCount = vData.logs.length;
        vData.totalKm = (vData.fillupCount > 1) ? (vData.maxHodo - vData.minHodo) : 0;
    }
    return dataByVehicle;
}

// SUBSTITUA A SUA FUNÇÃO renderFuelSummaryContent POR ESTA VERSÃO FINAL:

/**
 * Monta o conteúdo completo do modal de combustível, com abas para visão geral e relatório mensal.
 * (VERSÃO FINAL COM SEPARAÇÃO DE DADOS)
 */
function renderFuelSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');

    // Estrutura HTML inicial do modal com abas
    contentContainer.innerHTML = `
        <div class="border-b border-gray-200 mb-4 px-6">
            <nav class="-mb-px flex space-x-6" aria-label="Tabs">
                <button id="tab-fuel-overview" class="fuel-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm text-indigo-600 border-indigo-500">Visão Geral</button>
                <button id="tab-fuel-report" class="fuel-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm text-gray-500 border-transparent hover:text-gray-700">Relatório Mensal</button>
            </nav>
        </div>
        <div id="fuel-tab-content" class="px-6 pb-6">
            <div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>
        </div>
    `;

    let allFuelLogs = []; // Armazena os dados GERAIS para a primeira aba

    // ---- Lógica da Aba 1: VISÃO GERAL (Usa a busca de TODOS os dados) ----
    const renderOverviewTab = (logs) => {
        // ... (Esta sub-função permanece exatamente igual à da resposta anterior, não precisa mudar nada nela)
    };

    // ---- Lógica da Aba 2: RELATÓRIO MENSAL (Usa a NOVA busca de dados mensais) ----
    const renderMonthlyReportTab = (dateString) => {
        const [year, month] = dateString.split('-');
        const tabContent = document.getElementById('fuel-tab-content');
        
        tabContent.innerHTML = `...`; // Código da interface da aba de relatório
        
        // CORREÇÃO PRINCIPAL: Usa a nova função da API
        DataService.getMonthlyFuelReport({ month, year }, currentUser.role)
            .then(result => {
                // ... (O resto da lógica para calcular e exibir a tabela do relatório permanece o mesmo)
            }).catch(err => { /*...*/ });
    };

    // Para evitar colar um bloco gigante de código de novo, a única mudança real está na linha acima.
    // Para garantir 100%, aqui está a função completa para substituir:
    const fullRenderFunction = () => {
        const tabContent = document.getElementById('fuel-tab-content');
        const overviewTabButton = document.getElementById('tab-fuel-overview');
        const reportTabButton = document.getElementById('tab-fuel-report');

        const renderOverviewView = (logs) => {
            const processedData = processFuelData(logs);
            const vehicles = Object.keys(processedData);
            if (vehicles.length === 0) { tabContent.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum registro de abastecimento encontrado.</p>'; return; }
            const ranking = vehicles.sort((a, b) => processedData[b].fillupCount - processedData[a].fillupCount);
            const grandTotalValue = Object.values(processedData).reduce((sum, v) => sum + v.totalValue, 0);
            tabContent.innerHTML = `
                <div id="fuel-accordion" class="space-y-2 max-h-[40vh] overflow-y-auto pr-2"><h4 class="text-lg font-bold text-slate-700 mb-2">Estatísticas por Veículo (Geral)</h4>${vehicles.map(vehicleName => { const data = processedData[vehicleName]; return `<div class="border border-slate-200 rounded-lg"><button class="accordion-header flex justify-between items-center w-full p-4 text-left font-semibold text-indigo-800"><span>${vehicleName}</span><i class="fas fa-chevron-down transition-transform"></i></button><div class="accordion-content hidden p-4 border-t border-slate-200 bg-slate-50"><ul class="space-y-2 text-sm"><li class="flex justify-between"><span>Abastecimentos:</span> <strong class="font-mono">${data.fillupCount}</strong></li><li class="flex justify-between"><span>KM Rodados:</span> <strong class="font-mono">${data.totalKm.toLocaleString('pt-BR')} km</strong></li><li class="flex justify-between"><span>Total de Litros:</span> <strong class="font-mono">${data.totalLiters.toFixed(2)} L</strong></li></ul></div></div>`; }).join('')}</div>
                <div class="mt-4 pt-4 border-t"><h4 class="text-lg font-bold text-slate-700 mb-2">Resumo Geral</h4><div class="bg-white p-4 rounded-lg border"><p class="font-semibold">Ranking (nº de abastecimentos):</p><ol class="list-decimal list-inside text-sm">${ranking.map(v => `<li>${v}: ${processedData[v].fillupCount} vezes</li>`).join('')}</ol><div class="flex justify-between items-center mt-4 pt-2 border-t"><span class="font-semibold">Valor Total Gasto (Geral):</span><strong class="text-xl text-green-700">R$ ${grandTotalValue.toFixed(2).replace('.', ',')}</strong></div></div></div>`;
            tabContent.querySelector('#fuel-accordion').addEventListener('click', e => { const header = e.target.closest('.accordion-header'); if (header) { header.nextElementSibling.classList.toggle('hidden'); header.querySelector('i').classList.toggle('rotate-180'); } });
        };

        const renderReportView = (dateString) => {
            const [year, month] = dateString.split('-');
            tabContent.innerHTML = `<div class="mb-4"><label for="report-month-picker" class="block text-sm font-medium text-gray-700">Selecione o Mês:</label><input type="month" id="report-month-picker" value="${dateString}" class="mt-1 block w-full md:w-1/2 p-2 border border-gray-300 rounded-md"></div><div id="report-results" class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div>`;
            document.getElementById('report-month-picker').addEventListener('change', e => renderReportView(e.target.value));
            DataService.getMonthlyFuelReport({ month, year }, currentUser.role).then(result => {
                const monthlyData = processFuelData(result.data);
                const resultsContainer = document.getElementById('report-results');
                if (Object.keys(monthlyData).length === 0) { resultsContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum abastecimento para este mês.</p>'; return; }
                let grandTotalFillups = 0, grandTotalLiters = 0, grandTotalKm = 0, grandTotalValue = 0;
                Object.values(monthlyData).forEach(d => { grandTotalFillups += d.fillupCount; grandTotalLiters += d.totalLiters; grandTotalKm += d.totalKm; grandTotalValue += d.totalValue; });
                resultsContainer.innerHTML = `<div class="overflow-x-auto"><table class="min-w-full divide-y divide-gray-200"><thead class="bg-gray-50"><tr><th class="th-style text-left">Veículo</th><th class="th-style">Qtd. Abastec.</th><th class="th-style">Litros</th><th class="th-style">KM Rodado</th><th class="th-style">Total Pago</th></tr></thead><tbody class="bg-white divide-y divide-gray-200">${Object.entries(monthlyData).map(([name, d]) => `<tr><td class="td-style text-left font-semibold">${name}</td><td class="td-style">${d.fillupCount}</td><td class="td-style">${d.totalLiters.toFixed(2)} L</td><td class="td-style">${d.totalKm.toLocaleString('pt-BR')} km</td><td class="td-style font-medium">R$ ${d.totalValue.toFixed(2).replace(',', '.')}</td></tr>`).join('')}</tbody><tfoot class="bg-slate-100 font-bold"><tr><td class="td-style text-left">TOTAL DO MÊS</td><td class="td-style">${grandTotalFillups}</td><td class="td-style">${grandTotalLiters.toFixed(2)} L</td><td class="td-style">${grandTotalKm.toLocaleString('pt-BR')} km</td><td class="td-style text-base text-green-700">R$ ${grandTotalValue.toFixed(2).replace(',', '.')}</td></tr></tfoot></table></div>`;
            }).catch(err => { document.getElementById('report-results').innerHTML = `<p class="text-center text-red-500 py-8">${err.message}</p>`; });
        };
        
        const switchTab = (tabToActivate) => {
            const isActiveReport = tabToActivate === 'report';
            overviewTabButton.className = `fuel-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm ${!isActiveReport ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700'}`;
            reportTabButton.className = `fuel-summary-tab whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm ${isActiveReport ? 'text-indigo-600 border-indigo-500' : 'text-gray-500 border-transparent hover:text-gray-700'}`;
            if (isActiveReport) {
                const today = new Date();
                renderReportView(`${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, '0')}`);
            } else {
                renderOverviewView(allFuelLogs);
            }
        };

        overviewTabButton.addEventListener('click', () => switchTab('overview'));
        reportTabButton.addEventListener('click', () => switchTab('report'));

        DataService.getHistoricoCombustivel({}, currentUser.role).then(result => {
            allFuelLogs = result.data;
            renderOverviewView(allFuelLogs);
        }).catch(err => { tabContent.innerHTML = `<p class="text-center text-red-500 py-8">${err.message}</p>`; });
    };
    fullRenderFunction();
}

/**
 * Abre o modal de resumo de combustível.
 */
function openFuelSummaryModal() {
    showInfoModal('Resumo de Combustível', 'Carregando...');
    renderFuelSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardDashboardFuel) {
    cardDashboardFuel.addEventListener('click', openFuelSummaryModal);
}
// SUBSTITUA O BLOCO DO MODAL DE CLIENTES POR ESTE:

const cardDashboardClients = document.getElementById('card-dashboard-clients');

/**
 * Monta o conteúdo do modal de resumo de clientes com detalhes da última atividade e histórico.
 * (VERSÃO FINAL E DETALHADA)
 */
function renderClientsSummaryContent() {
    const contentContainer = document.getElementById('generic-modal-content');
    contentContainer.innerHTML = `
        <div class="mb-4"><input class="w-full p-2 border border-gray-300 rounded-md" type="text" id="clients-summary-search" placeholder="Buscar por cliente, torre ou setor..." /></div>
        <div id="clients-list-container" class="max-h-[60vh] overflow-y-auto pr-2"><div class="text-center py-8"><i class="fas fa-spinner fa-spin text-indigo-600 text-2xl"></i></div></div>
    `;

    const listContainer = document.getElementById('clients-list-container');
    const searchInput = document.getElementById('clients-summary-search');

    DataService.getClientActivityDetails(currentUser.role)
        .then(result => {
            const allClientsData = result.data;
            const renderList = (clientsToRender) => {
                if (!Array.isArray(clientsToRender) || clientsToRender.length === 0) {
                    listContainer.innerHTML = '<p class="text-center text-gray-500 py-8">Nenhum cliente encontrado.</p>';
                    return;
                }
                listContainer.innerHTML = clientsToRender.map(client => {
                    // Encontra a atividade mais recente para este cliente
                    const lastActivity = client.patrimonios_used && client.patrimonios_used.length > 0
                        ? client.patrimonios_used[client.patrimonios_used.length - 1] // Supondo que o backend envie em ordem
                        : null;
                    
                    // Cria uma lista única de todos os patrimônios para o histórico
                    const uniquePatrimonios = [...new Map(client.patrimonios_used.map(item => [item['patrimonio'], item])).values()];

                    // HTML para a última atividade
                    let lastActivityHtml = '<p class="text-sm text-slate-500 italic">Nenhuma atividade recente encontrada.</p>';
                    if (lastActivity) {
                        const macDisplay = lastActivity.macAddress ? `, MAC: <span class="font-semibold text-blue-700">${lastActivity.macAddress}</span>` : '';
                        const productName = lastActivity.productName || 'Produto desconhecido';
                         lastActivityHtml = `<li class="flex justify-between"><span>${productName} - ${lastActivity.patrimonio}${macDisplay}</span></li>`;
                    }
                    
                    return `
                        <div class="bg-slate-50 border rounded-lg p-4 mb-3">
                            <h4 class="font-bold text-slate-800">${client.name || 'Cliente sem nome'}</h4>
                            <p class="text-xs text-slate-500">Torre: ${client.tower || 'Sem Registro'} - Setor: ${client.sector || 'Sem Registro'}</p>
                            
                            <div class="mt-3 pt-3 border-t">
                                <p class="text-sm font-semibold mb-1">Itens da Última Atividade:</p>
                                <ul class="list-none space-y-1 text-sm">${lastActivityHtml}</ul>
                            </div>
                            
                            <details class="mt-2 text-sm">
                                <summary class="cursor-pointer font-semibold text-indigo-600 hover:underline">Ver Histórico Completo de Itens</summary>
                                <ul class="list-disc list-inside pl-4 mt-2 bg-white p-2 rounded-md border">
                                    ${uniquePatrimonios.length > 0 ? uniquePatrimonios.map(p => {
                                        const macDisplay = p.macAddress ? `, MAC: <span class="font-semibold text-blue-700">${p.macAddress}</span>` : '';
                                        return `<li>${p.productName} - ${p.patrimonio}${macDisplay}</li>`;
                                    }).join('') : '<li>Nenhum item no histórico.</li>'}
                                </ul>
                            </details>

                            ${client.consumiveis_usados && client.consumiveis_usados.length > 0 ? `
                                <div class="mt-3 pt-3 border-t border-dashed">
                                    <p class="text-sm font-semibold mb-1">Itens de Consumo Registrados:</p>
                                    <ul class="list-disc list-inside pl-4 text-sm">${client.consumiveis_usados.map(item => `<li>${item}</li>`).join('')}</ul>
                                    ${client.metragem_cabo ? `<p class="text-sm mt-1"><strong>Metragem Cabo:</strong> ${client.metragem_cabo}</p>` : ''}
                                </div>` : ''
                            }
                        </div>`;
                }).join('');
            };
            renderList(allClientsData);
            searchInput.addEventListener('keyup', () => {
                const searchTerm = searchInput.value.toLowerCase().trim();
                const filteredClients = allClientsData.filter(c => (c.name && c.name.toLowerCase().includes(searchTerm)));
                renderList(filteredClients);
            });
        }).catch(error => {
            listContainer.innerHTML = `<p class="text-center text-red-500 py-8">${error.message}</p>`;
        });
}


/**
 * Abre o modal de resumo de clientes.
 */
function openClientsSummaryModal() {
    showInfoModal('Resumo de Clientes', 'Carregando...');
    renderClientsSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardDashboardClients) {
    cardDashboardClients.addEventListener('click', openClientsSummaryModal);
}

/**
 * Abre o modal de resumo de clientes.
 */
function openClientsSummaryModal() {
    showInfoModal('Resumo de Clientes', 'Carregando...');
    renderClientsSummaryContent();
}

// Adiciona o novo evento de clique ao card
if (cardDashboardClients) {
    cardDashboardClients.addEventListener('click', openClientsSummaryModal);
}
// [NOVO] Função para renderizar o gráfico de atividades de clientes
async function renderClientActivityChart(filterDate) {
    try {
        const result = await DataService.getClientActivitySummary({ filterDate }, currentUser.role);
        const data = result.data;

        const ctx = document.getElementById('clientActivityChart').getContext('2d');

        // Se um gráfico já existe, destrua-o para criar um novo
        if (clientActivityChart) {
            clientActivityChart.destroy();
        }

        // Prepara os dados para o formato do Chart.js
        const labels = data.map(item => item.clientName);
        const counts = data.map(item => item.activityCount);

        clientActivityChart = new Chart(ctx, {
            type: 'bar', // Tipo de gráfico: barras
            data: {
                labels: labels,
                datasets: [{
                    label: 'Nº de Atividades',
                    data: counts,
                    backgroundColor: 'rgba(79, 70, 229, 0.8)', // Cor índigo, com transparência
                    borderColor: 'rgba(79, 70, 229, 1)',
                    borderWidth: 1,
                    borderRadius: 5,
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: {
                        beginAtZero: true,
                        ticks: {
                            // Garante que apenas números inteiros apareçam no eixo Y
                            stepSize: 1 
                        }
                    }
                },
                plugins: {
                    legend: {
                        display: false // Esconde a legenda, pois o título já é claro
                    },
                    title: {
                        display: true,
                        text: `Resumo de Atividades para o mês selecionado`,
                        font: { size: 16 }
                    },
                    tooltip: {
                        callbacks: {
                            label: function(context) {
                                return ` Atividades: ${context.parsed.y}`;
                            }
                        }
                    }
                }
            }
        });

    } catch (error) {
        showToast(`Erro ao carregar dados do gráfico: ${error.message}`, 'error');
    }
}
    checkLoginStatus(); 
    applyStyles();

});
// Listener genérico para fechar QUALQUER modal
document.body.addEventListener('click', function(event) {
    // Procura por um botão com a classe 'modal-close-button'
    const closeButton = event.target.closest('.modal-close-button');
    if (closeButton) {
        // Encontra o modal pai mais próximo com a classe 'modal-overlay' e o esconde
        const modalToClose = closeButton.closest('.modal-overlay');
        if (modalToClose) {
            modalToClose.classList.add('hidden');
        }
    }
});