// modais.js - Gerenciamento de Modais

const Modal = {
    criarOverlay() {
        let overlay = document.getElementById('modal-overlay');
        if (!overlay) {
            overlay = document.createElement('div');
            overlay.id = 'modal-overlay';
            overlay.className = 'fixed inset-0 bg-gray-900 bg-opacity-50 z-40 hidden flex items-center justify-center p-4 transition-opacity duration-300';
            document.body.appendChild(overlay);
        }
        return overlay;
    },

    abrir(id) {
        const modal = document.getElementById(id);
        const overlay = this.criarOverlay();
        
        if (modal) {
            overlay.classList.remove('hidden');
            modal.classList.remove('hidden');
            
            // Animação de entrada
            setTimeout(() => {
                overlay.classList.add('opacity-100');
                modal.classList.add('scale-100', 'opacity-100');
                modal.classList.remove('scale-95', 'opacity-0');
            }, 10);
            
            // Fechar ao clicar fora
            overlay.onclick = (e) => {
                if (e.target === overlay) this.fechar(id);
            };
        }
    },

    fechar(id) {
        const modal = document.getElementById(id);
        const overlay = document.getElementById('modal-overlay');
        
        if (modal && overlay) {
            // Animação de saída
            modal.classList.remove('scale-100', 'opacity-100');
            modal.classList.add('scale-95', 'opacity-0');
            overlay.classList.remove('opacity-100');
            
            setTimeout(() => {
                modal.classList.add('hidden');
                overlay.classList.add('hidden');
            }, 300);
        }
    }
};
