<?php
/**
 * CHECKOUT DEBUG - Versão Instrumentada para Diagnóstico
 * Sistema de Checkout Profissional com múltiplos gateways - MODO DEBUG
 * 
 * @version 2.0-DEBUG
 * @author Checkout Pro 2025
 */

// ============================================================
// AMBIENTE PHP VERBORRÁGICO (FORÇAR EXIBIÇÃO DE ERROS)
// ============================================================

error_reporting(E_ALL);
ini_set('display_errors', 1);
ini_set('log_errors', 1);
ini_set('error_log', __DIR__ . '/../logs/debug_checkout.log');

// Desabilitar tratamento de erros padrão para ver tudo
set_error_handler(function($errno, $errstr, $errfile, $errline) {
    echo "<div style='background: #ff6b6b; color: white; padding: 10px; margin: 10px 0; border-radius: 5px;'>";
    echo "<strong>ERRO PHP:</strong> [$errno] $errstr em $errfile:$errline";
    echo "</div>";
    return false;
});

// ============================================================
// PAINEL DE STATUS DO SISTEMA
// ============================================================

$status_sistema = [
    'db_conexao' => false,
    'db_mensagem' => '',
    'config_token' => false,
    'config_db' => false,
    'gateway_helper' => false,
    'mercadopago_key' => false,
    'arquivos_js' => [],
    'arquivos_css' => []
];

// Testar conexão com banco
try {
    require __DIR__ . '/../config/config_db.php';
    $status_sistema['config_db'] = true;
    
    if (isset($pdo) && $pdo instanceof PDO) {
        $pdo->query("SELECT 1");
        $status_sistema['db_conexao'] = true;
        $status_sistema['db_mensagem'] = '✅ Conexão OK';
    } else {
        $status_sistema['db_mensagem'] = '❌ Variável $pdo não é uma instância de PDO';
    }
} catch (Exception $e) {
    $status_sistema['db_mensagem'] = '❌ Erro: ' . $e->getMessage();
}

// Testar arquivo de token
if (file_exists(__DIR__ . '/../config/token.php')) {
    $status_sistema['config_token'] = true;
    include_once __DIR__ . '/../config/token.php';
    if (defined('ACCESS_TOKEN') && !empty(ACCESS_TOKEN)) {
        $status_sistema['mercadopago_key'] = true;
    }
} else {
    $status_sistema['config_token'] = false;
}

// Testar gateway_helper
if (file_exists(__DIR__ . '/../backend/gateway_helper.php')) {
    $status_sistema['gateway_helper'] = true;
    require_once __DIR__ . '/../backend/gateway_helper.php';
} else {
    $status_sistema['gateway_helper'] = false;
}

// Verificar arquivos JS/CSS
$js_files = [
    '/views/js/checkout.js' => __DIR__ . '/../views/js/checkout.js'
];
foreach ($js_files as $path => $file) {
    $status_sistema['arquivos_js'][$path] = file_exists($file);
}

// Buscar configurações dos gateways
$mercadopago_public_key = null;
if (function_exists('get_gateway_config')) {
    $mercadopago_public_key = get_gateway_config('mercadopago', 'public_key');
}
if (empty($mercadopago_public_key) && defined('PUBLIC_KEY')) {
    $mercadopago_public_key = PUBLIC_KEY;
}

// ============================================================
// VERIFICAÇÃO DE GATEWAYS ATIVOS
// ============================================================

$mp_on = function_exists('gateway_ativado') ? gateway_ativado('mercadopago') : false;
$stripe_on = function_exists('gateway_ativado') ? gateway_ativado('stripe') : false;
$paypal_on = function_exists('gateway_ativado') ? gateway_ativado('paypal') : false;
$pagarme_on = function_exists('gateway_ativado') ? gateway_ativado('pagarme') : false;

$mercadopago_ativado = $mp_on;
$stripe_ativado = $stripe_on;
$paypal_ativado = $paypal_on;

$gateways_ativos = [];
if ($mp_on) $gateways_ativos[] = 'mercadopago';
if ($stripe_on) $gateways_ativos[] = 'stripe';
if ($paypal_on) $gateways_ativos[] = 'paypal';
if ($pagarme_on) $gateways_ativos[] = 'pagarme';

if (empty($gateways_ativos)) {
    $gateways_ativos[] = 'mercadopago'; // Fallback para debug
}

$primeira_aba = $gateways_ativos[0];

// Validar conexão com banco
if (!isset($pdo) || !($pdo instanceof PDO)) {
    $pdo = null; // Continuar mesmo sem DB para debug
}

// Buscar Pixel ID
$pixel_id = '';
if ($pdo) {
    try {
        $stmt = $pdo->prepare("SELECT valor FROM configuracoes WHERE chave = 'facebook_pixel_id' LIMIT 1");
        $stmt->execute();
        $config = $stmt->fetch(PDO::FETCH_ASSOC);
        $pixel_id = $config ? $config['valor'] : '';
    } catch (PDOException $e) {
        // Ignorar erro para debug
    }
}

// Lógica de Captura Robusta
$final_prod_id = filter_input(INPUT_GET, 'produto_id', FILTER_SANITIZE_NUMBER_INT);
$final_af_id = filter_input(INPUT_GET, 'ref', FILTER_SANITIZE_NUMBER_INT);
if (!$final_af_id) {
    $final_af_id = filter_input(INPUT_GET, 'af', FILTER_SANITIZE_NUMBER_INT);
}

// Validar produto_id
if (!$final_prod_id) {
    $final_prod_id = 1; // Fallback para debug
}

$produto_id = intval($final_prod_id);
if ($produto_id <= 0) {
    $produto_id = 1; // Fallback para debug
}

// Buscar produto principal
$produto = [
    'id' => $produto_id,
    'nome' => 'Produto de Teste',
    'descricao' => 'Descrição do produto de teste para debug',
    'imagem' => '',
    'preco_original' => 100.00,
    'preco_atual' => 99.90,
    'link_entregavel' => '',
    'checkout_background_color' => '#0f0c29',
    'checkout_banner' => '',
    'checkout_main_card_background' => '#1a1a2e',
    'checkout_text_color' => '#ffffff',
    'tipo_produto' => 'fisico', // Forçar físico para testar endereço
    'metodos_pagamento' => 'todos'
];

if ($pdo) {
    try {
        $sql = "SELECT id, nome, descricao, imagem, preco_original, preco_atual, link_entregavel, 
                       checkout_background_color, checkout_banner, checkout_main_card_background, checkout_text_color,
                       tipo_produto, metodos_pagamento
                FROM produtos WHERE id = :produto_id LIMIT 1";
        $stmt = $pdo->prepare($sql);
        $stmt->execute(['produto_id' => $produto_id]);
        $produto_db = $stmt->fetch(PDO::FETCH_ASSOC);
        if ($produto_db) {
            $produto = array_merge($produto, $produto_db);
        }
    } catch (PDOException $e) {
        // Usar dados padrão
    }
}

$is_produto_fisico = ($produto['tipo_produto'] ?? 'digital') === 'fisico';

// Função para gerar campos de endereço (mesma do original)
function gerarCamposEndereco($sufixo = '', $checkout_text_color = '#ffffff', $sempre_mostrar = false) {
    global $is_produto_fisico;
    
    if (!$sempre_mostrar && !$is_produto_fisico) {
        return '';
    }
    
    $id_sufixo_final = $sufixo ? '_' . $sufixo : '';
    $id_cep = 'input_cep' . $id_sufixo_final;
    $id_rua = 'input_logradouro' . $id_sufixo_final;
    $id_numero = 'input_numero' . $id_sufixo_final;
    $id_complemento = 'input_complemento' . $id_sufixo_final;
    $id_bairro = 'input_bairro' . $id_sufixo_final;
    $id_cidade = 'input_cidade' . $id_sufixo_final;
    $id_estado = 'input_estado' . $id_sufixo_final;
    
    ob_start();
    ?>
    <div class="endereco-container-<?= $sufixo; ?>" style="margin-top: 20px; margin-bottom: 20px; padding: 20px; background: rgba(102, 126, 234, 0.1); border: 2px dashed rgba(255,255,255,0.2); border-radius: 10px;">
        <h3 style="font-size: 16px; color: <?= $checkout_text_color; ?>; margin-bottom: 15px;">
            <i class="fas fa-map-marker-alt"></i> Endereço de Entrega
        </h3>
        
        <div class="form-group">
            <input type="text" id="<?= $id_cep; ?>" name="<?= $id_cep; ?>" placeholder="CEP (Ex: 01310-100)" maxlength="9" class="cep-input" required>
            <div class="error-message" id="error-<?= $id_cep; ?>"></div>
        </div>
        
        <div class="form-group">
            <input type="text" id="<?= $id_rua; ?>" name="<?= $id_rua; ?>" placeholder="Rua" required>
            <div class="error-message" id="error-<?= $id_rua; ?>"></div>
        </div>
        
        <div style="display: grid; grid-template-columns: 1fr 2fr; gap: 10px;">
            <div class="form-group">
                <input type="text" id="<?= $id_numero; ?>" name="<?= $id_numero; ?>" placeholder="Número" required>
                <div class="error-message" id="error-<?= $id_numero; ?>"></div>
            </div>
            <div class="form-group">
                <input type="text" id="<?= $id_complemento; ?>" name="<?= $id_complemento; ?>" placeholder="Complemento (opcional)">
            </div>
        </div>
        
        <div class="form-group">
            <input type="text" id="<?= $id_bairro; ?>" name="<?= $id_bairro; ?>" placeholder="Bairro" required>
            <div class="error-message" id="error-<?= $id_bairro; ?>"></div>
        </div>
        
        <div style="display: grid; grid-template-columns: 2fr 1fr; gap: 10px;">
            <div class="form-group">
                <input type="text" id="<?= $id_cidade; ?>" name="<?= $id_cidade; ?>" placeholder="Cidade" required>
                <div class="error-message" id="error-<?= $id_cidade; ?>"></div>
            </div>
            <div class="form-group">
                <input type="text" id="<?= $id_estado; ?>" name="<?= $id_estado; ?>" placeholder="UF" maxlength="2" required style="text-transform: uppercase;">
                <div class="error-message" id="error-<?= $id_estado; ?>"></div>
            </div>
        </div>
    </div>
    <?php
    return ob_get_clean();
}

$produtos_adicionais = [];
$checkout_background_color = $produto['checkout_background_color'];
$checkout_banner = $produto['checkout_banner'];
$checkout_main_card_background = $produto['checkout_main_card_background'];
$checkout_text_color = $produto['checkout_text_color'];
$numero_de_adicionais = 0;
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Checkout DEBUG - Diagnóstico Completo</title>
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="/fontawesome/css/all.min.css">
    
    <!-- SDKs de Pagamento -->
    <script src="https://sdk.mercadopago.com/js/v2"></script>
    <script src="https://www.mercadopago.com/v2/security.js" view="checkout"></script>
    
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
            background: <?= $checkout_background_color; ?>;
            color: <?= $checkout_text_color; ?>;
            padding: 20px;
        }
        
        .debug-panel {
            background: rgba(255, 255, 255, 0.1);
            border: 2px solid rgba(255, 255, 255, 0.3);
            border-radius: 10px;
            padding: 20px;
            margin-bottom: 20px;
        }
        
        .debug-panel h2 {
            color: #fff;
            margin-bottom: 15px;
            font-size: 18px;
        }
        
        .status-item {
            padding: 8px;
            margin: 5px 0;
            border-radius: 5px;
            background: rgba(255, 255, 255, 0.05);
        }
        
        .status-ok {
            background: rgba(76, 175, 80, 0.3);
            border-left: 4px solid #4caf50;
        }
        
        .status-error {
            background: rgba(244, 67, 54, 0.3);
            border-left: 4px solid #f44336;
        }
        
        .status-warning {
            background: rgba(255, 152, 0, 0.3);
            border-left: 4px solid #ff9800;
        }
        
        .error-banner {
            position: fixed;
            top: 10px;
            right: 10px;
            background: #f44336;
            color: white;
            padding: 15px 20px;
            border-radius: 8px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.3);
            z-index: 10000;
            max-width: 400px;
            display: none;
        }
        
        .error-banner.show {
            display: block;
            animation: slideIn 0.3s ease-out;
        }
        
        @keyframes slideIn {
            from {
                transform: translateX(400px);
                opacity: 0;
            }
            to {
                transform: translateX(0);
                opacity: 1;
            }
        }
        
        .modal {
            display: none;
            position: fixed;
            z-index: 10001;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.7);
            overflow: auto;
        }
        
        .modal-content {
            background: #1a1a2e;
            margin: 5% auto;
            padding: 30px;
            border: 2px solid #00c6ff;
            border-radius: 10px;
            width: 90%;
            max-width: 800px;
            max-height: 80vh;
            overflow-y: auto;
        }
        
        .modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20px;
            border-bottom: 2px solid #00c6ff;
            padding-bottom: 10px;
        }
        
        .modal-header h2 {
            color: #00c6ff;
        }
        
        .close {
            color: #aaa;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
        }
        
        .close:hover {
            color: #fff;
        }
        
        .payload-viewer {
            background: #0f0c29;
            padding: 15px;
            border-radius: 5px;
            margin: 10px 0;
            font-family: 'Courier New', monospace;
            font-size: 12px;
            overflow-x: auto;
        }
        
        .field-validation {
            padding: 5px;
            margin: 3px 0;
            border-radius: 3px;
        }
        
        .field-ok {
            background: rgba(76, 175, 80, 0.2);
            color: #4caf50;
        }
        
        .field-error {
            background: rgba(244, 67, 54, 0.2);
            color: #f44336;
        }
        
        .btn-test {
            background: linear-gradient(90deg, #00c6ff, #0072ff);
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            margin: 5px;
            font-weight: 600;
        }
        
        .btn-test:hover {
            background: linear-gradient(90deg, #0072ff, #00c6ff);
        }
    </style>
</head>
<body>
    <!-- Painel de Status do Sistema -->
    <div class="debug-panel">
        <h2>🔍 PAINEL DE STATUS DO SISTEMA</h2>
        
        <div class="status-item <?= $status_sistema['db_conexao'] ? 'status-ok' : 'status-error'; ?>">
            <strong>Banco de Dados:</strong> <?= $status_sistema['db_mensagem']; ?>
        </div>
        
        <div class="status-item <?= $status_sistema['config_db'] ? 'status-ok' : 'status-error'; ?>">
            <strong>Arquivo config_db.php:</strong> <?= $status_sistema['config_db'] ? '✅ Existe' : '❌ Não encontrado'; ?>
        </div>
        
        <div class="status-item <?= $status_sistema['config_token'] ? 'status-ok' : 'status-error'; ?>">
            <strong>Arquivo token.php:</strong> <?= $status_sistema['config_token'] ? '✅ Existe' : '❌ Não encontrado'; ?>
        </div>
        
        <div class="status-item <?= $status_sistema['gateway_helper'] ? 'status-ok' : 'status-error'; ?>">
            <strong>Arquivo gateway_helper.php:</strong> <?= $status_sistema['gateway_helper'] ? '✅ Existe' : '❌ Não encontrado'; ?>
        </div>
        
        <div class="status-item <?= $status_sistema['mercadopago_key'] ? 'status-ok' : 'status-warning'; ?>">
            <strong>Mercado Pago Access Token:</strong> <?= $status_sistema['mercadopago_key'] ? '✅ Configurado' : '⚠️ Não configurado ou vazio'; ?>
        </div>
        
        <?php foreach ($status_sistema['arquivos_js'] as $path => $exists): ?>
        <div class="status-item <?= $exists ? 'status-ok' : 'status-error'; ?>">
            <strong>Arquivo JS <?= htmlspecialchars($path); ?>:</strong> <?= $exists ? '✅ Existe' : '❌ Não encontrado'; ?>
        </div>
        <?php endforeach; ?>
        
        <div style="margin-top: 15px;">
            <button class="btn-test" onclick="testarConectividadeBackend()">🔗 Testar Conectividade Backend</button>
            <button class="btn-test" onclick="validarDOM()">🔍 Validar DOM</button>
            <button class="btn-test" onclick="validarFuncoesJS()">⚙️ Validar Funções JS</button>
        </div>
    </div>
    
    <!-- Banner de Erros JavaScript -->
    <div id="error-banner" class="error-banner">
        <div style="display: flex; justify-content: space-between; align-items: start;">
            <div>
                <strong>❌ ERRO JAVASCRIPT</strong>
                <div id="error-message" style="margin-top: 5px; font-size: 14px;"></div>
            </div>
            <span onclick="document.getElementById('error-banner').classList.remove('show')" style="cursor: pointer; margin-left: 10px;">✕</span>
        </div>
    </div>
    
    <!-- Modal de Payload Inspector -->
    <div id="payload-modal" class="modal">
        <div class="modal-content">
            <div class="modal-header">
                <h2>📋 O QUE SERÁ ENVIADO</h2>
                <span class="close" onclick="document.getElementById('payload-modal').style.display='none'">&times;</span>
            </div>
            <div id="payload-content"></div>
        </div>
    </div>
    
    <!-- Conteúdo do Checkout (Simplificado para Debug) -->
    <div class="debug-panel">
        <h2>🛒 CHECKOUT - MODO DEBUG</h2>
        
        <input type="hidden" id="hidden_tipo_produto" value="<?= $is_produto_fisico ? 'fisico' : 'digital'; ?>">
        <input type="hidden" id="hidden_produto_id" value="<?= $produto_id; ?>">
        <input type="hidden" id="hidden_afiliado_id" value="<?= $final_af_id ?? 0; ?>">
        <input type="hidden" id="hidden_metodos_pagamento" value="<?= $produto['metodos_pagamento'] ?? 'todos'; ?>">
        <input type="hidden" id="hidden_frete_cobrado" value="0">
        
        <div id="titulo-produto"><?= htmlspecialchars($produto['nome']); ?></div>
        <div id="descricao-produto"><?= htmlspecialchars($produto['descricao']); ?></div>
        <input type="hidden" id="link-entregavel" value="<?= htmlspecialchars($produto['link_entregavel']); ?>">
        
        <!-- Aba Mercado Pago - Cartão -->
        <div id="mercadopago-cartao" class="tab-content" style="display: block;">
            <h3>💳 Mercado Pago - Cartão (DEBUG)</h3>
            <?= gerarCamposEndereco('mp_cartao', $checkout_text_color, false); ?>
            <button type="button" id="btn-submit-mp-cartao" class="btn-test" onclick="simularEnvio('cartao')">
                🔍 SIMULAR ENVIO (Cartão)
            </button>
        </div>
        
        <!-- Aba Mercado Pago - PIX -->
        <div id="mercadopago-pix" class="tab-content" style="display: none;">
            <h3>📱 Mercado Pago - PIX (DEBUG)</h3>
            <?= gerarCamposEndereco('mp_pix', $checkout_text_color, false); ?>
            <button type="button" id="btn-pix-mp" class="btn-test" onclick="simularEnvio('pix')">
                🔍 SIMULAR ENVIO (PIX)
            </button>
        </div>
        
        <!-- Aba Mercado Pago - Boleto -->
        <div id="mercadopago-boleto" class="tab-content" style="display: none;">
            <h3>🧾 Mercado Pago - Boleto (DEBUG)</h3>
            <?= gerarCamposEndereco('mp_boleto', $checkout_text_color, true); ?>
            <input type="text" id="cpf_boleto_mp" placeholder="CPF (000.000.000-00)" maxlength="14" style="width: 100%; padding: 12px; margin: 10px 0; border: 2px solid #00c6ff; border-radius: 8px;">
            <button type="button" id="btn-boleto-mp" class="btn-test" onclick="simularEnvio('boleto')">
                🔍 SIMULAR ENVIO (Boleto)
            </button>
        </div>
    </div>
    
    <!-- Scripts -->
    <script>
        // ============================================================
        // FUNÇÕES CRÍTICAS - CRIAR PRIMEIRO (ANTES DO checkout.js)
        // ============================================================
        // Estas funções serão criadas ANTES do checkout.js carregar
        // Se o checkout.js já tiver essas funções, elas serão sobrescritas
        
        // Função detectarSufixoAbaAtiva - CRÍTICA
        window.detectarSufixoAbaAtiva = function() {
            console.log('🔍 [DEBUG] detectarSufixoAbaAtiva() - Iniciando detecção...');
            
            // Lista de abas conhecidas com seus respectivos sufixos
            const tabs = [
                { id: 'mercadopago-cartao', sufixo: 'mp_cartao' },
                { id: 'mercadopago-pix', sufixo: 'mp_pix' },
                { id: 'mercadopago-boleto', sufixo: 'mp_boleto' },
                { id: 'pagarme-cartao', sufixo: 'pagarme_cartao' },
                { id: 'pagarme-pix', sufixo: 'pagarme_pix' },
                { id: 'pagarme-boleto', sufixo: 'pagarme_boleto' },
                { id: 'stripe', sufixo: 'mp_cartao' },
                { id: 'paypal', sufixo: 'mp_cartao' }
            ];
            
            // Iterar sobre as abas e verificar qual está visível
            for (const tab of tabs) {
                const element = document.getElementById(tab.id);
                if (element) {
                    // Verificar se a aba está visível
                    const computedStyle = window.getComputedStyle(element);
                    const isVisible = computedStyle.display !== 'none' && 
                                    element.offsetParent !== null;
                    
                    if (isVisible) {
                        console.log('✅ [DEBUG] Aba ativa detectada:', tab.id, '-> Sufixo:', tab.sufixo);
                        return tab.sufixo;
                    }
                }
            }
            
            console.log('⚠️ [DEBUG] Nenhuma aba visível encontrada, retornando null');
            return null;
        };
        
        console.log('✅ [DEBUG] Função detectarSufixoAbaAtiva() DEFINIDA');

        // Função getEnderecoEntrega - CRÍTICA
        window.getEnderecoEntrega = function() {
            const tipoProduto = document.getElementById('hidden_tipo_produto')?.value;
            console.log('📍 [DEBUG] getEnderecoEntrega() chamada. Tipo produto:', tipoProduto);
            
            // Tentar detectar a aba ativa
            let sufixo = null;
            try {
                if (typeof detectarSufixoAbaAtiva === 'function') {
                    sufixo = detectarSufixoAbaAtiva();
                }
            } catch (error) {
                console.warn('⚠️ [DEBUG] Erro ao chamar detectarSufixoAbaAtiva():', error);
            }
            
            const isBoleto = sufixo && sufixo.includes('boleto');
            
            // Se não é físico e não é boleto, não precisa de endereço
            if (tipoProduto !== 'fisico' && !isBoleto) {
                return null;
            }
            
            // FALLBACK INTELIGENTE: Se a detecção falhar, buscar onde o usuário digitou
            if (!sufixo) {
                console.log('🔄 [DEBUG] Detecção de aba falhou, tentando Fallback Inteligente...');
                const possiveis = ['mp_cartao', 'mp_pix', 'mp_boleto', 'pagarme_cartao', 'pagarme_pix', 'pagarme_boleto'];
                for (const s of possiveis) {
                    const cepElement = document.getElementById('input_cep_' + s);
                    if (cepElement && cepElement.value && cepElement.value.trim().length > 0) {
                        sufixo = s;
                        console.log('✅ [DEBUG] Fallback encontrou sufixo com valor preenchido:', sufixo);
                        break;
                    }
                }
            }
            
            // Se ainda não encontrou sufixo, usar mp_cartao como padrão
            if (!sufixo) {
                sufixo = 'mp_cartao';
            }
            
            // Construir IDs dos campos usando o sufixo descoberto
            const id_cep = 'input_cep_' + sufixo;
            const id_rua = 'input_logradouro_' + sufixo;
            const id_numero = 'input_numero_' + sufixo;
            const id_complemento = 'input_complemento_' + sufixo;
            const id_bairro = 'input_bairro_' + sufixo;
            const id_cidade = 'input_cidade_' + sufixo;
            const id_estado = 'input_estado_' + sufixo;
            
            // Capturar valores dos campos
            const cepEl = document.getElementById(id_cep);
            const ruaEl = document.getElementById(id_rua);
            const numeroEl = document.getElementById(id_numero);
            const complementoEl = document.getElementById(id_complemento);
            const bairroEl = document.getElementById(id_bairro);
            const cidadeEl = document.getElementById(id_cidade);
            const estadoEl = document.getElementById(id_estado);
            
            const cep = cepEl?.value?.replace(/\D/g, '') || '';
            const rua = ruaEl?.value?.trim() || '';
            const numero = numeroEl?.value?.trim() || '';
            const complemento = complementoEl?.value?.trim() || '';
            const bairro = bairroEl?.value?.trim() || '';
            const cidade = cidadeEl?.value?.trim() || '';
            const estado = estadoEl?.value?.trim().toUpperCase() || '';
            
            // FALLBACK INTELIGENTE FINAL: Se os campos estão vazios, tentar encontrar em outras abas
            if (!cep || !rua || !numero || !bairro || !cidade || !estado) {
                console.log('🔄 [DEBUG] Campos principais vazios, tentando Fallback Inteligente Final...');
                const possiveis = ['mp_cartao', 'mp_pix', 'mp_boleto', 'pagarme_cartao', 'pagarme_pix', 'pagarme_boleto'];
                for (const s of possiveis) {
                    const cep_fallback = document.getElementById('input_cep_' + s)?.value?.replace(/\D/g, '');
                    const rua_fallback = document.getElementById('input_logradouro_' + s)?.value?.trim();
                    const numero_fallback = document.getElementById('input_numero_' + s)?.value?.trim();
                    const bairro_fallback = document.getElementById('input_bairro_' + s)?.value?.trim() || '';
                    const cidade_fallback = document.getElementById('input_cidade_' + s)?.value?.trim() || '';
                    const estado_fallback = document.getElementById('input_estado_' + s)?.value?.trim().toUpperCase() || '';
                    const complemento_fallback = document.getElementById('input_complemento_' + s)?.value?.trim() || '';
                    
                    if (cep_fallback && rua_fallback && numero_fallback && bairro_fallback && cidade_fallback && estado_fallback) {
                        console.log('✅ [DEBUG] Fallback Final encontrou valores completos no sufixo:', s);
                        return {
                            cep: cep_fallback,
                            rua: rua_fallback,
                            numero: numero_fallback,
                            complemento: complemento_fallback,
                            bairro: bairro_fallback,
                            cidade: cidade_fallback,
                            estado: estado_fallback
                        };
                    }
                }
            }
            
            // Validar campos obrigatórios
            if (!cep || !rua || !numero || !bairro || !cidade || !estado) {
                const campos_faltando = [];
                if (!cep) campos_faltando.push('CEP');
                if (!rua) campos_faltando.push('Rua');
                if (!numero) campos_faltando.push('Número');
                if (!bairro) campos_faltando.push('Bairro');
                if (!cidade) campos_faltando.push('Cidade');
                if (!estado) campos_faltando.push('Estado');
                
                throw new Error('Por favor, preencha todos os campos de endereço obrigatórios: ' + campos_faltando.join(', '));
            }
            
            console.log('✅ [DEBUG] Endereço capturado com sucesso! (sufixo:', sufixo + ')');
            
            return {
                cep: cep,
                rua: rua,
                numero: numero,
                complemento: complemento,
                bairro: bairro,
                cidade: cidade,
                estado: estado
            };
        };
        
        console.log('✅ [DEBUG] Função getEnderecoEntrega() DEFINIDA');

        // Função getDadosPagador - Helper
        window.getDadosPagador = function() {
            return {
                email: 'teste@teste.com',
                first_name: 'Teste',
                last_name: 'Usuario',
                full_name: 'Teste Usuario',
                cpf: '12345678909',
                celular: '11987654321'
            };
        };
        
        console.log('✅ [DEBUG] Função getDadosPagador() DEFINIDA');

        // Função getCheckoutData - Helper
        window.getCheckoutData = function() {
            return {
                prodId: document.getElementById('hidden_produto_id')?.value || '1',
                afId: document.getElementById('hidden_afiliado_id')?.value || null
            };
        };
        
        console.log('✅ [DEBUG] Função getCheckoutData() DEFINIDA');

        // Função getFreteCobrado - Helper
        window.getFreteCobrado = function() {
            const tipoProduto = document.getElementById('hidden_tipo_produto')?.value;
            if (tipoProduto !== 'fisico') {
                return 0;
            }
            const freteHidden = document.getElementById('hidden_frete_cobrado');
            return freteHidden ? parseFloat(freteHidden.value || 0) : 0;
        };
        
        console.log('✅ [DEBUG] Função getFreteCobrado() DEFINIDA');
    </script>
    
    <!-- Carregar checkout.js DEPOIS (pode sobrescrever as funções acima se necessário) -->
    <script src="/views/js/checkout.js"></script>
    
    <script>
        // ============================================================
        // CAPTURADOR DE ERROS GLOBAL
        // ============================================================
        
        window.onerror = function(msg, url, lineNo, columnNo, error) {
            const errorBanner = document.getElementById('error-banner');
            const errorMessage = document.getElementById('error-message');
            
            let errorText = `Mensagem: ${msg}<br>`;
            errorText += `Arquivo: ${url}<br>`;
            errorText += `Linha: ${lineNo}`;
            if (columnNo) errorText += `, Coluna: ${columnNo}`;
            if (error && error.stack) {
                errorText += `<br><br>Stack:<br><pre style="font-size: 11px; overflow-x: auto;">${error.stack}</pre>`;
            }
            
            errorMessage.innerHTML = errorText;
            errorBanner.classList.add('show');
            
            // Auto-ocultar após 10 segundos
            setTimeout(() => {
                errorBanner.classList.remove('show');
            }, 10000);
            
            return false; // Não prevenir comportamento padrão
        };
        
        // Capturar erros de Promise não tratadas
        window.addEventListener('unhandledrejection', function(event) {
            const errorBanner = document.getElementById('error-banner');
            const errorMessage = document.getElementById('error-message');
            
            let errorText = `Promise Rejeitada:<br>${event.reason}`;
            if (event.reason && event.reason.stack) {
                errorText += `<br><br>Stack:<br><pre style="font-size: 11px; overflow-x: auto;">${event.reason.stack}</pre>`;
            }
            
            errorMessage.innerHTML = errorText;
            errorBanner.classList.add('show');
            
            setTimeout(() => {
                errorBanner.classList.remove('show');
            }, 10000);
        });
        
        // ============================================================
        // VALIDAÇÃO DE DOM
        // ============================================================
        
        function validarDOM() {
            const idsEsperados = [
                'hidden_tipo_produto',
                'hidden_produto_id',
                'input_cep_mp_cartao',
                'input_logradouro_mp_cartao',
                'input_numero_mp_cartao',
                'input_bairro_mp_cartao',
                'input_cidade_mp_cartao',
                'input_estado_mp_cartao',
                'input_cep_mp_pix',
                'input_logradouro_mp_pix',
                'input_numero_mp_pix',
                'input_bairro_mp_pix',
                'input_cidade_mp_pix',
                'input_estado_mp_pix',
                'input_cep_mp_boleto',
                'input_logradouro_mp_boleto',
                'input_numero_mp_boleto',
                'input_bairro_mp_boleto',
                'input_cidade_mp_boleto',
                'input_estado_mp_boleto'
            ];
            
            const faltando = [];
            const encontrados = [];
            
            idsEsperados.forEach(id => {
                const el = document.getElementById(id);
                if (el) {
                    encontrados.push(id);
                } else {
                    faltando.push(id);
                }
            });
            
            let resultado = '<h3>✅ Validação de DOM</h3>';
            resultado += `<p><strong>Encontrados:</strong> ${encontrados.length}/${idsEsperados.length}</p>`;
            
            if (faltando.length > 0) {
                resultado += '<div style="background: rgba(244, 67, 54, 0.2); padding: 10px; border-radius: 5px; margin: 10px 0;">';
                resultado += '<strong>❌ IDs Faltando:</strong><ul>';
                faltando.forEach(id => {
                    resultado += `<li>${id}</li>`;
                });
                resultado += '</ul></div>';
            } else {
                resultado += '<div style="background: rgba(76, 175, 80, 0.2); padding: 10px; border-radius: 5px; margin: 10px 0;">';
                resultado += '<strong>✅ Todos os IDs esperados foram encontrados!</strong>';
                resultado += '</div>';
            }
            
            alert(resultado.replace(/<[^>]*>/g, ''));
        }
        
        // ============================================================
        // VALIDAÇÃO DE FUNÇÕES JS
        // ============================================================
        
        function validarFuncoesJS() {
            const funcoesCriticas = [
                'detectarSufixoAbaAtiva',
                'getEnderecoEntrega',
                'getDadosPagador',
                'getCheckoutData',
                'getFreteCobrado'
            ];
            
            const faltando = [];
            const encontradas = [];
            
            funcoesCriticas.forEach(fn => {
                if (typeof window[fn] === 'function') {
                    encontradas.push(fn);
                } else {
                    faltando.push(fn);
                }
            });
            
            let resultado = '<h3>⚙️ Validação de Funções JavaScript</h3>';
            resultado += `<p><strong>Encontradas:</strong> ${encontradas.length}/${funcoesCriticas.length}</p>`;
            
            if (faltando.length > 0) {
                resultado += '<div style="background: rgba(244, 67, 54, 0.3); padding: 15px; border-radius: 5px; margin: 10px 0; border: 2px solid #f44336;">';
                resultado += '<strong style="color: #f44336; font-size: 18px;">❌ ERRO CRÍTICO DE LÓGICA JS</strong><br><br>';
                resultado += '<strong>Funções Faltando:</strong><ul>';
                faltando.forEach(fn => {
                    resultado += `<li style="color: #ff6b6b;">${fn}()</li>`;
                });
                resultado += '</ul>';
                resultado += '<p style="margin-top: 10px; color: #ff6b6b;"><strong>⚠️ ATENÇÃO:</strong> Essas funções são essenciais para o funcionamento do checkout!</p>';
                resultado += '</div>';
            } else {
                resultado += '<div style="background: rgba(76, 175, 80, 0.2); padding: 10px; border-radius: 5px; margin: 10px 0;">';
                resultado += '<strong>✅ Todas as funções críticas foram encontradas!</strong>';
                resultado += '</div>';
            }
            
            // Exibir no modal
            document.getElementById('payload-content').innerHTML = resultado;
            document.getElementById('payload-modal').style.display = 'block';
        }
        
        // ============================================================
        // TESTAR CONECTIVIDADE BACKEND
        // ============================================================
        
        async function testarConectividadeBackend() {
            const endpoints = [
                '/backend/process_payment.php',
                '/backend/process_payment_pix.php',
                '/backend/process_payment_boleto_mercadopago.php'
            ];
            
            let resultado = '<h3>🔗 Teste de Conectividade Backend</h3>';
            
            for (const endpoint of endpoints) {
                try {
                    const response = await fetch(endpoint, {
                        method: 'POST',
                        headers: { 'Content-Type': 'application/json' },
                        body: JSON.stringify({ test: true })
                    });
                    
                    const status = response.status;
                    let statusText = '';
                    let statusClass = '';
                    
                    if (status === 400) {
                        statusText = '✅ 400 (Esperado - validação de dados)';
                        statusClass = 'field-ok';
                    } else if (status === 404) {
                        statusText = '❌ 404 (Rota não encontrada)';
                        statusClass = 'field-error';
                    } else if (status === 500) {
                        statusText = '⚠️ 500 (Erro PHP no servidor)';
                        statusClass = 'field-error';
                    } else {
                        statusText = `ℹ️ ${status} (${response.statusText})`;
                        statusClass = 'field-ok';
                    }
                    
                    resultado += `<div class="field-validation ${statusClass}">`;
                    resultado += `<strong>${endpoint}:</strong> ${statusText}`;
                    resultado += `</div>`;
                } catch (error) {
                    resultado += `<div class="field-validation field-error">`;
                    resultado += `<strong>${endpoint}:</strong> ❌ Erro de rede: ${error.message}`;
                    resultado += `</div>`;
                }
            }
            
            document.getElementById('payload-content').innerHTML = resultado;
            document.getElementById('payload-modal').style.display = 'block';
        }
        
        // ============================================================
        // SIMULADOR DE ENVIO (PAYLOAD INSPECTOR)
        // ============================================================
        
        async function simularEnvio(tipo) {
            console.log(`🔍 [DEBUG] Simulando envio: ${tipo}`);
            
            let payload = {};
            let validacoes = [];
            
            try {
                // Tentar obter dados do checkout
                const { prodId, afId } = typeof getCheckoutData === 'function' ? getCheckoutData() : { prodId: null, afId: null };
                const dadosPagador = typeof getDadosPagador === 'function' ? getDadosPagador() : {};
                
                // Montar payload base
                payload = {
                    transaction_amount: 100.00,
                    description: document.getElementById('titulo-produto')?.innerText || 'Produto',
                    product: {
                        id: prodId || document.getElementById('hidden_produto_id')?.value || 1,
                        title: document.getElementById('titulo-produto')?.innerText || '',
                        description: document.getElementById('descricao-produto')?.innerText || '',
                        price: 100.00,
                        link_entregavel: document.getElementById('link-entregavel')?.value || ''
                    },
                    payer: {
                        email: dadosPagador.email || 'teste@teste.com',
                        first_name: dadosPagador.first_name || 'Teste',
                        last_name: dadosPagador.last_name || 'Usuario',
                        full_name: dadosPagador.full_name || 'Teste Usuario',
                        identification: {
                            type: 'CPF',
                            number: dadosPagador.cpf?.replace(/\D/g, '') || '12345678909'
                        },
                        phone: {
                            area_code: dadosPagador.celular?.substring(0, 2) || '11',
                            number: dadosPagador.celular?.substring(2) || '987654321',
                            country_code: '+55'
                        }
                    }
                };
                
                // Capturar endereço
                let enderecoJson = null;
                try {
                    if (typeof getEnderecoEntrega === 'function') {
                        const endereco = getEnderecoEntrega();
                        if (endereco) {
                            enderecoJson = JSON.stringify(endereco);
                            payload.endereco_json = enderecoJson;
                            
                            // Validar campos de endereço
                            const camposEndereco = ['cep', 'rua', 'numero', 'bairro', 'cidade', 'estado'];
                            camposEndereco.forEach(campo => {
                                if (endereco[campo] && endereco[campo].trim() !== '') {
                                    validacoes.push({
                                        campo: campo,
                                        valor: campo === 'cep' ? endereco[campo].substring(0, 5) + '...' : endereco[campo],
                                        status: 'ok'
                                    });
                                } else {
                                    validacoes.push({
                                        campo: campo,
                                        valor: '[Vazio]',
                                        status: 'error'
                                    });
                                }
                            });
                        } else {
                            validacoes.push({
                                campo: 'endereco',
                                valor: 'Não necessário (produto digital)',
                                status: 'ok'
                            });
                        }
                    } else {
                        validacoes.push({
                            campo: 'getEnderecoEntrega',
                            valor: 'Função não encontrada!',
                            status: 'error'
                        });
                    }
                } catch (error) {
                    validacoes.push({
                        campo: 'endereco',
                        valor: `Erro: ${error.message}`,
                        status: 'error'
                    });
                }
                
                // Adicionar campos específicos por tipo
                if (tipo === 'boleto') {
                    const cpfBoleto = document.getElementById('cpf_boleto_mp')?.value?.replace(/\D/g, '') || '';
                    if (cpfBoleto && cpfBoleto.length === 11) {
                        payload.payer.identification.number = cpfBoleto;
                        validacoes.push({
                            campo: 'CPF Boleto',
                            valor: cpfBoleto.substring(0, 3) + '.***.***-**',
                            status: 'ok'
                        });
                    } else {
                        validacoes.push({
                            campo: 'CPF Boleto',
                            valor: '[Vazio ou Inválido]',
                            status: 'error'
                        });
                    }
                }
                
                // Validar CPF
                const cpf = payload.payer.identification.number;
                if (cpf && cpf.length === 11) {
                    validacoes.push({
                        campo: 'CPF',
                        valor: cpf.substring(0, 3) + '.***.***-**',
                        status: 'ok'
                    });
                } else {
                    validacoes.push({
                        campo: 'CPF',
                        valor: '[Vazio ou Inválido]',
                        status: 'error'
                    });
                }
                
                // Validar email
                if (payload.payer.email && payload.payer.email.includes('@')) {
                    validacoes.push({
                        campo: 'Email',
                        valor: payload.payer.email,
                        status: 'ok'
                    });
                } else {
                    validacoes.push({
                        campo: 'Email',
                        valor: '[Vazio ou Inválido]',
                        status: 'error'
                    });
                }
                
            } catch (error) {
                console.error('Erro ao montar payload:', error);
                validacoes.push({
                    campo: 'Erro Geral',
                    valor: error.message,
                    status: 'error'
                });
            }
            
            // Exibir no modal
            let html = '<h3>📋 O QUE SERÁ ENVIADO</h3>';
            html += '<p><strong>Tipo:</strong> ' + tipo.toUpperCase() + '</p>';
            
            html += '<h4 style="margin-top: 20px; color: #00c6ff;">Validação de Campos:</h4>';
            validacoes.forEach(v => {
                const icon = v.status === 'ok' ? '✅' : '❌';
                const classStatus = v.status === 'ok' ? 'field-ok' : 'field-error';
                html += `<div class="field-validation ${classStatus}">${icon} <strong>${v.campo}:</strong> ${v.valor}</div>`;
            });
            
            html += '<h4 style="margin-top: 20px; color: #00c6ff;">Payload Completo (JSON):</h4>';
            html += '<div class="payload-viewer">';
            html += '<pre>' + JSON.stringify(payload, null, 2) + '</pre>';
            html += '</div>';
            
            html += '<div style="margin-top: 20px; padding: 15px; background: rgba(255, 193, 7, 0.2); border-radius: 5px; border: 1px solid rgba(255, 193, 7, 0.4);">';
            html += '<strong>⚠️ MODO DEBUG:</strong> Este é apenas uma simulação. Nenhum pagamento real será processado.';
            html += '</div>';
            
            document.getElementById('payload-content').innerHTML = html;
            document.getElementById('payload-modal').style.display = 'block';
        }
        
        // ============================================================
        // VALIDAÇÃO AUTOMÁTICA AO CARREGAR
        // ============================================================
        
        document.addEventListener('DOMContentLoaded', function() {
            console.log('🔍 [DEBUG] Página carregada, iniciando validações automáticas...');
            
            // Validar funções JS após um pequeno delay (para garantir que checkout.js carregou)
            setTimeout(() => {
                const funcoesCriticas = ['detectarSufixoAbaAtiva', 'getEnderecoEntrega'];
                const faltando = funcoesCriticas.filter(fn => typeof window[fn] !== 'function');
                
                if (faltando.length > 0) {
                    const errorBanner = document.getElementById('error-banner');
                    const errorMessage = document.getElementById('error-message');
                    
                    errorMessage.innerHTML = `
                        <strong>❌ ERRO CRÍTICO DE LÓGICA JS</strong><br>
                        Funções faltando: ${faltando.join(', ')}<br>
                        <small>Verifique se o arquivo checkout.js foi carregado corretamente.</small>
                    `;
                    errorBanner.classList.add('show');
                }
            }, 1000);
        });
        
        // Fechar modal ao clicar fora
        window.onclick = function(event) {
            const modal = document.getElementById('payload-modal');
            if (event.target == modal) {
                modal.style.display = 'none';
            }
        };
    </script>
</body>
</html>

