/**
 * VERSÃO DEBUG ULTRA SIMPLES - TH Suite Forms
 * Substitua temporariamente o frontend.js por este arquivo
 */
 
(function($) {
    'use strict';
    
    console.log('🚀 TH Suite Forms DEBUG v2 carregado!');
    
    // Configuração padrão se não carregar
    const config = window.THSF_Config || {
        validation: { 
            enabled: true, 
            global_required_fields: ['name', 'nome', 'email', 'telefone', 'phone'] 
        },
        masks: { enabled: true, auto_detect: true },
        toasts: { enabled: true, position: 'top-right' }
    };
    
    console.log('📋 Configuração carregada:', config);
    
    // Função de máscara de telefone brasileiro
    function applyPhoneMask(value) {
        const digits = value.replace(/\D/g, '').slice(0, 11); // Máximo 11 dígitos
        
        if (digits.length <= 10) {
            // Telefone fixo
            return digits.replace(/(\d{2})(\d{4})(\d{0,4})/, (match, p1, p2, p3) => {
                if (p3) return `(${p1}) ${p2}-${p3}`;
                if (p2) return `(${p1}) ${p2}`;
                if (p1) return `(${p1}`;
                return digits;
            });
        } else {
            // Celular
            return digits.replace(/(\d{2})(\d{5})(\d{0,4})/, (match, p1, p2, p3) => {
                if (p3) return `(${p1}) ${p2}-${p3}`;
                if (p2) return `(${p1}) ${p2}`;
                if (p1) return `(${p1}`;
                return digits;
            });
        }
    }
    
    // Verificar se campo é obrigatório
    function isFieldRequired($field) {
        const name = ($field.attr('name') || '').replace(/form_fields\[|\]/g, '').toLowerCase();
        const requiredFields = config.validation?.global_required_fields || [];
        
        const isRequired = requiredFields.some(pattern => {
            return name === pattern.toLowerCase() || name.includes(pattern.toLowerCase());
        });
        
        console.log('🔍 Verificando campo:', { name, isRequired, requiredFields });
        return isRequired;
    }
    
    // Toast simples
    function showToast(message, type = 'success') {
        console.log('🍞 Toast:', message, type);
        
        $('#debug-toast').remove();
        
        const colors = {
            success: '#28a745',
            error: '#dc3545',
            warning: '#ffc107'
        };
        
        const toast = $(`
            <div id="debug-toast" style="
                position: fixed; 
                top: 20px; 
                right: 20px; 
                background: ${colors[type] || colors.success}; 
                color: white; 
                padding: 15px 20px; 
                border-radius: 8px; 
                z-index: 999999;
                box-shadow: 0 4px 12px rgba(0,0,0,0.3);
                max-width: 300px;
            ">
                <strong>${type === 'error' ? 'Erro!' : 'Sucesso!'}</strong><br>
                ${message}
            </div>
        `);
        
        $('body').append(toast);
        
        setTimeout(() => {
            toast.fadeOut(300, () => toast.remove());
        }, type === 'error' ? 5000 : 3000);
    }
    
    // Aplicar máscaras
    function initMasks() {
        $('input[type="text"], input[type="tel"]').each(function() {
            const $input = $(this);
            const name = ($input.attr('name') || '').toLowerCase();
            const id = ($input.attr('id') || '').toLowerCase();
            
            console.log('🔍 Campo encontrado:', { name, id });
            
            if (name.includes('telefone') || id.includes('telefone') || 
                name.includes('phone') || id.includes('phone')) {
                
                console.log('📞 Campo de telefone detectado:', name || id);
                
                // Adicionar inputmode
                $input.attr('inputmode', 'numeric');
                
                // Aplicar máscara
                $input.on('input', function() {
                    const value = $(this).val();
                    const masked = applyPhoneMask(value);
                    if (masked !== value) {
                        const pos = this.selectionStart;
                        $(this).val(masked);
                        try {
                            this.setSelectionRange(pos, pos);
                        } catch(e) {
                            // Ignorar
                        }
                        console.log('📱 Máscara aplicada:', value, '->', masked);
                    }
                });
            }
        });
    }
    
    // Marcar campos obrigatórios
    function markRequiredFields() {
        $('.elementor-form input, .elementor-form textarea, .elementor-form select').each(function() {
            const $field = $(this);
            
            if (isFieldRequired($field)) {
                const $label = $(`.elementor-field-label[for="${$field.attr('id')}"]`);
                if ($label.length && !$label.find('.thsf-required').length) {
                    $label.append(' <span class="thsf-required" style="color: #dc3545; font-weight: bold;">*</span>');
                    console.log('⭐ Campo marcado como obrigatório:', $field.attr('name'));
                }
            }
        });
    }
    
    // Validar formulário
    function validateForm($form) {
        console.log('🔍 Validando formulário...');
        let hasErrors = false;
        let firstError = null;
        
        $form.find('input, textarea, select').each(function() {
            const $field = $(this);
            const value = $field.val().trim();
            const required = isFieldRequired($field);
            
            if (required && !value) {
                hasErrors = true;
                if (!firstError) firstError = $field;
                
                // Marcar campo com erro
                $field.css({
                    'border-color': '#dc3545',
                    'box-shadow': '0 0 0 0.2rem rgba(220, 53, 69, 0.25)'
                });
                
                console.log('❌ Campo obrigatório vazio:', $field.attr('name'));
            } else {
                // Remover erro
                $field.css({
                    'border-color': '',
                    'box-shadow': ''
                });
            }
        });
        
        return { valid: !hasErrors, firstError };
    }
    
    // Inicializar
    $(document).ready(function() {
        console.log('🔧 Inicializando TH Suite Forms Debug v2...');
        
        setTimeout(() => {
            initMasks();
            markRequiredFields();
            
            // Interceptar submit
            $(document).on('submit', '.elementor-form', function(e) {
                console.log('📤 Formulário submetido!');
                
                const $form = $(this);
                const validation = validateForm($form);
                
                if (!validation.valid) {
                    e.preventDefault();
                    e.stopPropagation();
                    
                    if (validation.firstError) {
                        validation.firstError.focus();
                    }
                    
                    showToast('Por favor, preencha todos os campos obrigatórios marcados com *', 'error');
                    return false;
                }
                
                // Se válido, mostrar toast de sucesso
                setTimeout(() => {
                    showToast('Formulário enviado com sucesso!', 'success');
                }, 1000);
            });
            
            // Observer para novos elementos
            const observer = new MutationObserver(function(mutations) {
                mutations.forEach(function(mutation) {
                    if (mutation.addedNodes.length) {
                        console.log('🔄 Novos elementos detectados...');
                        setTimeout(() => {
                            initMasks();
                            markRequiredFields();
                        }, 100);
                    }
                });
            });
            
            observer.observe(document.body, { childList: true, subtree: true });
            
        }, 500);
    });
    
    // API global
    window.THSF_Debug = {
        showToast,
        initMasks,
        markRequiredFields,
        validateForm,
        config
    };
    
})(jQuery);