<?php
require_once 'conexao.php';
session_start();

// Verifica se o usuário está logado
if (!isset($_SESSION['logado'])) {
    header('Location: login.php');
    exit;
}

// Verifica o tenant_id
$tenant_id = $_SESSION['tenant_id'] ?? null;
if (!$tenant_id || !is_numeric($tenant_id)) {
    die("Erro: tenant_id inválido.");
}

// Verificar e criar tabela se não existir
function verificarTabelaFluxos($conn) {
    $result = $conn->query("SHOW TABLES LIKE 'fluxos_automatizados'");
    if ($result->num_rows == 0) {
        $sql = "CREATE TABLE fluxos_automatizados (
            id INT PRIMARY KEY AUTO_INCREMENT,
            nome VARCHAR(255) NOT NULL,
            descricao TEXT,
            condicoes JSON NOT NULL,
            acoes JSON NOT NULL,
            ativo TINYINT(1) DEFAULT 1,
            tenant_id INT NOT NULL,
            criado_por INT,
            criado_em DATETIME DEFAULT CURRENT_TIMESTAMP,
            atualizado_em DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
            tipo_trigger ENUM('evento', 'agendamento') DEFAULT 'evento',
            config_agendamento JSON DEFAULT NULL,
            ultima_execucao DATETIME DEFAULT NULL
        )";
        
        if ($conn->query($sql) === TRUE) {
            error_log("Tabela fluxos_automatizados criada com sucesso");
        } else {
            error_log("Erro ao criar tabela: " . $conn->error);
        }
    }
}

verificarTabelaFluxos($conn);

// Informações da sessão
$usuario_id = $_SESSION['usuario_id'] ?? null;
$permissao = $_SESSION['permissao'] ?? 'usuario';
$is_admin = ($permissao === 'admin');
$is_super_admin = ($permissao === 'super_admin');

// Buscar fluxos automatizados existentes
$fluxos_automatizados = [];
$sql_fluxos = "SELECT * FROM fluxos_automatizados WHERE tenant_id = ? ORDER BY nome";
if ($stmt = $conn->prepare($sql_fluxos)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $fluxos_automatizados[] = $row;
    }
    $stmt->close();
}

// Buscar tipos de atividades
$tipos_atividades = [];
$sql_tipos = "SELECT id, nome FROM lista_atividades WHERE tenant_id = ? AND ativo = 1 ORDER BY nome";
if ($stmt = $conn->prepare($sql_tipos)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $tipos_atividades[] = $row;
    }
    $stmt->close();
}

// Buscar templates de e-mail
$templates_email = [];
$sql_templates = "SELECT id, nome, assunto FROM templates_email WHERE tenant_id = ? AND ativo = 1 ORDER BY nome";
if ($stmt = $conn->prepare($sql_templates)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $templates_email[] = $row;
    }
    $stmt->close();
}

// Buscar questionários
$questionarios = [];
$sql_questionarios = "SELECT id, nome FROM formularios WHERE tenant_id = ? ORDER BY nome";
if ($stmt = $conn->prepare($sql_questionarios)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $questionarios[] = $row;
    }
    $stmt->close();
}

// Buscar etapas do funil
$etapas_funil = [];
$sql_etapas = "SELECT ef.id, ef.nome, ef.tipo_entrada, f.nome as funil_nome 
               FROM etapas_funis ef 
               JOIN funis f ON ef.funil_id = f.id 
               WHERE f.tenant_id = ? 
               ORDER BY f.nome, ef.ordem";
if ($stmt = $conn->prepare($sql_etapas)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $etapas_funil[] = $row;
    }
    $stmt->close();
}

$conn->close();
?>

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon_io/favicon-16x16.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon_io/favicon-32x32.png">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SON - Fluxos Automatizados</title>
    <meta name="csrf-token" content="<?php echo $_SESSION['csrf_token']; ?>">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f5f5f5;
            overflow-x: hidden;
        }
        
        .header-fixed {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            background-color: #f5f5f5;
            padding: 15px 20px;
            z-index: 1000;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .header-fixed img {
            height: 50px;
            margin-right: 15px;
        }
        
        .header-fixed h2 {
            margin: 0;
            flex-grow: 1;
            text-align: center;
        }
        
        /* Menu Lateral Recolhível */
        .sidebar {
            position: fixed;
            left: 0;
            top: 80px;
            height: calc(100vh - 80px);
            width: 60px;
            background: white;
            box-shadow: 2px 0 5px rgba(0,0,0,0.1);
            z-index: 999;
            transition: width 0.3s ease;
            overflow-x: hidden;
        }
        
        .sidebar-menu {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        
        .sidebar-menu li {
            border-bottom: 1px solid #eee;
        }
        
        .sidebar-menu a {
            display: flex;
            align-items: center;
            padding: 15px 20px;
            text-decoration: none;
            color: #333;
            white-space: nowrap;
            transition: background-color 0.3s;
        }
        
        .sidebar-menu i {
            width: 24px;
            height: 24px;
            margin-right: 15px;
            text-align: center;
            flex-shrink: 0;
        }
        
        .sidebar-menu .menu-text {
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .content-wrapper {
            margin-top: 80px;
            padding: 20px;
            margin-left: 60px;
            transition: margin-left 0.3s ease;
        }
        
        .container {
            max-width: 1400px;
            margin: 0 auto;
        }
        
        .card {
            background: white;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
            margin-bottom: 20px;
        }
        
        .card-header {
            background-color: #f8f9fa;
            padding: 15px 20px;
            border-bottom: 1px solid #dee2e6;
            border-radius: 8px 8px 0 0;
        }
        
        .card-body {
            padding: 20px;
        }
        
        .modal-activity {
            display: none;
            position: fixed;
            z-index: 2000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgba(0,0,0,0.5);
            backdrop-filter: blur(5px);
        }
        
        .modal-activity-content {
            background-color: #fefefe;
            margin: 5% auto;
            padding: 20px;
            border-radius: 8px;
            width: 70%;
            max-width: 800px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2);
            max-height: 80vh;
            overflow-y: auto;
            position: relative;
        }
        
        .close-modal {
            position: absolute;
            right: 20px;
            top: 10px;
            color: #aaa;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
            z-index: 1;
        }
        
        .close-modal:hover {
            color: #333;
        }
        
        .user-info {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .user-photo {
            width: 40px;
            height: 40px;
            border-radius: 50%;
        }
        
        .user-initial {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: #ccc;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            font-size: 1.2em;
        }
        
        .table-actions {
            display: flex;
            gap: 5px;
        }
        
        .btn-sm {
            padding: 0.25rem 0.5rem;
            font-size: 0.875rem;
        }
        
        .form-section {
            background: #f8f9fa;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
        }
        
        .form-section h5 {
            margin-bottom: 15px;
            color: #495057;
        }
        
        .condition-group {
            border: 1px solid #dee2e6;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: white;
        }
        
        .condition-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
        }
        
        .action-group {
            border: 1px solid #28a745;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #f8fff9;
        }
        
        .action-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            color: #28a745;
        }
        
        .email-action-group {
            border: 1px solid #007bff;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #f0f8ff;
        }
        
        .email-action-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            color: #007bff;
        }
        
        .rule-preview {
            background: #e9ecef;
            padding: 15px;
            border-radius: 5px;
            margin-top: 15px;
        }
        
        .rule-preview h6 {
            margin-bottom: 10px;
        }
        
        .rule-item {
            padding: 5px 0;
            border-bottom: 1px solid #dee2e6;
        }
        
        .rule-item:last-child {
            border-bottom: none;
        }
        
        .empty-state {
            text-align: center;
            padding: 40px 20px;
            color: #6c757d;
        }
        
        .empty-state i {
            font-size: 48px;
            margin-bottom: 15px;
            opacity: 0.5;
        }
        
        .badge-agendamento {
            background-color: #17a2b8;
            color: white;
        }
        
        .badge-manual {
            background-color: #6c757d;
            color: white;
        }
        
        .badge-atividade {
            background-color: #28a745;
            color: white;
        }
        
        .badge-email {
            background-color: #007bff;
            color: white;
        }
        
        .nav-tabs .nav-link.active {
            font-weight: bold;
        }
        
        .trigger-section {
            background: #fff3cd;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #ffeaa7;
        }
    </style>
</head>
<body>

    <?php include 'menu_lateral.php'; ?>

    <!-- Conteúdo Principal -->
    <div class="content-wrapper">
        <div class="container">
            <?php if (isset($_SESSION['erro'])): ?>
                <div class="alert alert-danger">
                    <?= htmlspecialchars($_SESSION['erro']) ?>
                </div>
                <?php unset($_SESSION['erro']); ?>
            <?php endif; ?>
            
            <?php if (isset($_SESSION['sucesso'])): ?>
                <div class="alert alert-success">
                    <?= htmlspecialchars($_SESSION['sucesso']) ?>
                </div>
                <?php unset($_SESSION['sucesso']); ?>
            <?php endif; ?>

            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="mb-0"><i class="fas fa-project-diagram"></i> Fluxos Automatizados</h3>
                    <button type="button" class="btn btn-primary" onclick="abrirModalNovoFluxo()">
                        <i class="fas fa-plus"></i> Novo Fluxo
                    </button>
                </div>
                <div class="card-body">
                    <?php if (empty($fluxos_automatizados)): ?>
                        <div class="empty-state">
                            <i class="fas fa-project-diagram"></i>
                            <h5>Nenhum fluxo automatizado criado</h5>
                            <p>Clique em "Novo Fluxo" para criar seu primeiro fluxo automatizado.</p>
                        </div>
                    <?php else: ?>
                        <div class="table-responsive">
                            <table class="table table-striped">
                                <thead>
                                    <tr>
                                        <th>Nome</th>
                                        <th>Descrição</th>
                                        <th>Tipo</th>
                                        <th>Condições</th>
                                        <th>Tipo Ação</th>
                                        <th>Status</th>
                                        <th>Ações</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <?php foreach ($fluxos_automatizados as $fluxo): ?>
                                        <tr>
                                            <td><?php echo htmlspecialchars($fluxo['nome']); ?></td>
                                            <td><?php echo htmlspecialchars($fluxo['descricao'] ?? ''); ?></td>
                                            <td>
                                                <span class="badge <?php echo $fluxo['tipo_trigger'] === 'agendamento' ? 'bg-warning' : 'bg-info'; ?>">
                                                    <?php echo $fluxo['tipo_trigger'] === 'agendamento' ? 'Agendado' : 'Por Evento'; ?>
                                                </span>
                                            </td>
                                            <td>
                                                <?php 
                                                    $condicoes = json_decode($fluxo['condicoes'], true);
                                                    $condicoes_texto = [];
                                                    if (is_array($condicoes)) {
                                                        foreach ($condicoes as $condicao) {
                                                            $texto = getTextoCondicao($condicao, $etapas_funil, $questionarios);
                                                            if ($texto) {
                                                                $condicoes_texto[] = $texto;
                                                            }
                                                        }
                                                    }
                                                    echo implode('<br>', $condicoes_texto);
                                                ?>
                                            </td>
                                            <td>
                                                <?php 
                                                    $acoes = json_decode($fluxo['acoes'], true);
                                                    $tipos_acoes = [];
                                                    if (is_array($acoes)) {
                                                        foreach ($acoes as $acao) {
                                                            $tipo_acao = getTipoAcao($acao);
                                                            if ($tipo_acao && !in_array($tipo_acao, $tipos_acoes)) {
                                                                $tipos_acoes[] = $tipo_acao;
                                                            }
                                                        }
                                                    }
                                                    echo implode('<br>', array_map(function($tipo) {
                                                        $badge_class = $tipo === 'Atividade' ? 'badge-atividade' : 'badge-email';
                                                        return '<span class="badge ' . $badge_class . '">' . $tipo . '</span>';
                                                    }, $tipos_acoes));
                                                ?>
                                            </td>
                                            <td>
                                                <span class="badge <?php echo $fluxo['ativo'] ? 'bg-success' : 'bg-secondary'; ?>">
                                                    <?php echo $fluxo['ativo'] ? 'Ativo' : 'Inativo'; ?>
                                                </span>
                                            </td>
                                            <td class="table-actions">
                                                <button class="btn btn-sm btn-outline-primary" onclick="editarFluxo(<?php echo $fluxo['id']; ?>)">
                                                    <i class="fas fa-edit"></i>
                                                </button>
                                                <button class="btn btn-sm btn-outline-<?php echo $fluxo['ativo'] ? 'warning' : 'success'; ?>" 
                                                        onclick="toggleFluxo(<?php echo $fluxo['id']; ?>, <?php echo $fluxo['ativo'] ? 0 : 1; ?>)">
                                                    <i class="fas fa-<?php echo $fluxo['ativo'] ? 'pause' : 'play'; ?>"></i>
                                                </button>
                                                <button class="btn btn-sm btn-outline-danger" 
                                                        onclick="excluirFluxo(<?php echo $fluxo['id']; ?>)">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    <?php endforeach; ?>
                                </tbody>
                            </table>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal Novo Fluxo -->
    <div id="novoFluxoModal" class="modal-activity">
        <div class="modal-activity-content">
            <span class="close-modal" onclick="fecharModalNovoFluxo()">&times;</span>
            <h2 id="modalFluxoTitulo">Novo Fluxo Automatizado</h2>
            <form id="formFluxo" method="POST" action="salvar_fluxo_automatizado.php">
                <input type="hidden" name="csrf_token" value="<?php echo $_SESSION['csrf_token']; ?>" />
                <input type="hidden" name="tenant_id" value="<?php echo $tenant_id; ?>" />
                <input type="hidden" id="fluxoId" name="id" value="">
                
                <div class="mb-3">
                    <label for="nomeFluxo" class="form-label">Nome do Fluxo*</label>
                    <input type="text" class="form-control" id="nomeFluxo" name="nome" required>
                </div>
                
                <div class="mb-3">
                    <label for="descricaoFluxo" class="form-label">Descrição</label>
                    <textarea class="form-control" id="descricaoFluxo" name="descricao" rows="2"></textarea>
                </div>
                
                <div class="trigger-section">
                    <h5><i class="fas fa-clock"></i> Tipo de Ativação</h5>
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="tipo_trigger" id="triggerEvento" value="evento" checked onchange="toggleConfigAgendamento()">
                        <label class="form-check-label" for="triggerEvento">
                            Por Evento (executa quando um evento específico ocorrer)
                        </label>
                    </div>
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="tipo_trigger" id="triggerAgendamento" value="agendamento" onchange="toggleConfigAgendamento()">
                        <label class="form-check-label" for="triggerAgendamento">
                            Agendado (executa periodicamente)
                        </label>
                    </div>
                    
                    <div id="configAgendamento" style="display: none; margin-top: 15px; padding: 15px; background: #f8f9fa; border-radius: 5px;">
                        <div class="row">
                            <div class="col-md-4 mb-3">
                                <label class="form-label">Frequência</label>
                                <select class="form-control" name="config_agendamento[frequencia]" id="frequenciaAgendamento" onchange="atualizarCamposAgendamento()">
                                    <option value="diario">Diário</option>
                                    <option value="semanal">Semanal</option>
                                    <option value="mensal">Mensal</option>
                                </select>
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="form-label">Horário</label>
                                <input type="time" class="form-control" name="config_agendamento[horario]" value="09:00">
                            </div>
                            <div class="col-md-4 mb-3" id="campoDiaSemana" style="display: none;">
                                <label class="form-label">Dia da Semana</label>
                                <select class="form-control" name="config_agendamento[dia_semana]">
                                    <option value="0">Domingo</option>
                                    <option value="1">Segunda</option>
                                    <option value="2">Terça</option>
                                    <option value="3">Quarta</option>
                                    <option value="4">Quinta</option>
                                    <option value="5">Sexta</option>
                                    <option value="6">Sábado</option>
                                </select>
                            </div>
                            <div class="col-md-4 mb-3" id="campoDiaMes" style="display: none;">
                                <label class="form-label">Dia do Mês</label>
                                <input type="number" class="form-control" name="config_agendamento[dia_mes]" min="1" max="31" value="1">
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="form-section" id="secaoCondicoes">
                    <h5><i class="fas fa-filter"></i> Condições de Ativação</h5>
                    <p class="text-muted">Defina quando este fluxo será acionado automaticamente.</p>
                    
                    <div id="condicoesContainer">
                        <!-- Condições serão adicionadas aqui via JavaScript -->
                    </div>
                    
                    <button type="button" class="btn btn-outline-primary btn-sm" onclick="adicionarCondicao()">
                        <i class="fas fa-plus"></i> Adicionar Condição
                    </button>
                </div>
                
                <div class="form-section">
                    <h5><i class="fas fa-tasks"></i> Ações Automatizadas</h5>
                    <p class="text-muted">Defina quais ações serão executadas quando as condições forem atendidas.</p>
                    
                    <ul class="nav nav-tabs mb-3" id="acoesTabs" role="tablist">
                        <li class="nav-item" role="presentation">
                            <button class="nav-link active" id="atividades-tab" data-bs-toggle="tab" data-bs-target="#atividades" type="button" role="tab">Atividades</button>
                        </li>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="emails-tab" data-bs-toggle="tab" data-bs-target="#emails" type="button" role="tab">E-mails</button>
                        </li>
                    </ul>
                    
                    <div class="tab-content" id="acoesTabContent">
                        <div class="tab-pane fade show active" id="atividades" role="tabpanel">
                            <div id="acoesAtividadesContainer">
                                <!-- Ações de atividades serão adicionadas aqui -->
                            </div>
                            <button type="button" class="btn btn-outline-success btn-sm" onclick="adicionarAcaoAtividade()">
                                <i class="fas fa-plus"></i> Adicionar Atividade
                            </button>
                        </div>
                        <div class="tab-pane fade" id="emails" role="tabpanel">
                            <div id="acoesEmailsContainer">
                                <!-- Ações de e-mail serão adicionadas aqui -->
                            </div>
                            <button type="button" class="btn btn-outline-info btn-sm" onclick="adicionarAcaoEmail()">
                                <i class="fas fa-plus"></i> Adicionar E-mail
                            </button>
                        </div>
                    </div>
                </div>
                
                <div class="mb-3 form-check">
                    <input type="checkbox" class="form-check-input" id="ativoFluxo" name="ativo" value="1" checked>
                    <label class="form-check-label" for="ativoFluxo">Fluxo ativo</label>
                </div>
                
                <div class="rule-preview">
                    <h6><i class="fas fa-eye"></i> Prévia da Regra</h6>
                    <div id="rulePreview">
                        <p class="text-muted">As condições e ações aparecerão aqui conforme você as configurar.</p>
                    </div>
                </div>
                
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" onclick="fecharModalNovoFluxo()">Cancelar</button>
                    <button type="button" class="btn btn-primary" onclick="validarESalvarFluxo()">Salvar Fluxo</button>
                </div>
            </form>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

    <script>
        // Template de condição
        const condicaoTemplate = `
            <div class="condition-group">
                <div class="condition-header">
                    <h6 class="mb-0">Condição</h6>
                    <button type="button" class="btn btn-sm btn-outline-danger" onclick="removerCondicao(this)">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                <div class="row">
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Tipo de Condição</label>
                        <select class="form-control condicao-tipo" name="condicoes[tipo][]" onchange="atualizarCamposCondicao(this)" required>
                            <option value="">Selecione...</option>
                            <option value="etapa_funil">Cliente em etapa do funil</option>
                            <option value="agendamento">Cliente movido para agendamento</option>
                            <option value="cadastro_manual">Cadastro manual</option>
                            <option value="cadastro_importacao">Cadastro via importação</option>
                            <option value="qualificado_qualquer">Cliente qualificado em qualquer questionário</option>
                            <option value="qualificado_especifico">Cliente qualificado em questionário específico</option>
                            <option value="envio_formulario">Envio de formulário por e-mail</option>
                        </select>
                    </div>
                    <div class="col-md-6 mb-3 campos-condicionais">
                        <!-- Campos adicionais aparecerão aqui -->
                    </div>
                </div>
            </div>
        `;

        // Template de ação - Atividade
        const acaoAtividadeTemplate = `
            <div class="action-group">
                <div class="action-header">
                    <h6 class="mb-0">Criar Atividade</h6>
                    <button type="button" class="btn btn-sm btn-outline-danger" onclick="removerAcao(this, 'atividade')">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                <div class="row">
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Tipo de Atividade*</label>
                        <select class="form-control" name="acoes[atividade][tipo_atividade_id][]" required>
                            <option value="">Selecione...</option>
                            <?php foreach ($tipos_atividades as $tipo): ?>
                                <option value="<?php echo $tipo['id']; ?>"><?php echo htmlspecialchars($tipo['nome']); ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    <div class="col-md-3 mb-3">
                        <label class="form-label">Tempo para execução</label>
                        <input type="number" class="form-control" name="acoes[atividade][tempo_execucao][]" min="0" value="0">
                    </div>
                    <div class="col-md-3 mb-3">
                        <label class="form-label">Unidade de tempo</label>
                        <select class="form-control" name="acoes[atividade][unidade_tempo][]">
                            <option value="minutos">Minutos</option>
                            <option value="horas">Horas</option>
                            <option value="dias" selected>Dias</option>
                            <option value="semanas">Semanas</option>
                        </select>
                    </div>
                    <div class="col-md-12 mb-3">
                        <label class="form-label">Descrição/Observações</label>
                        <textarea class="form-control" name="acoes[atividade][descricao][]" rows="2" placeholder="Descrição opcional da atividade..."></textarea>
                    </div>
                </div>
            </div>
        `;

        // Template de ação - E-mail
        const acaoEmailTemplate = `
            <div class="email-action-group">
                <div class="email-action-header">
                    <h6 class="mb-0">Enviar E-mail</h6>
                    <button type="button" class="btn btn-sm btn-outline-danger" onclick="removerAcao(this, 'email')">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                <div class="row">
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Template de E-mail*</label>
                        <select class="form-control" name="acoes[email][template_id][]" required onchange="atualizarAssuntoEmail(this)">
                            <option value="">Selecione...</option>
                            <?php foreach ($templates_email as $template): ?>
                                <option value="<?php echo $template['id']; ?>" data-assunto="<?php echo htmlspecialchars($template['assunto']); ?>">
                                    <?php echo htmlspecialchars($template['nome']); ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Assunto*</label>
                        <input type="text" class="form-control" name="acoes[email][assunto][]" required placeholder="Assunto do e-mail">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Tempo para envio</label>
                        <input type="number" class="form-control" name="acoes[email][tempo_envio][]" min="0" value="0">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Unidade de tempo</label>
                        <select class="form-control" name="acoes[email][unidade_tempo][]">
                            <option value="minutos">Minutos</option>
                            <option value="horas">Horas</option>
                            <option value="dias" selected>Dias</option>
                            <option value="semanas">Semanas</option>
                        </select>
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Enviar para</label>
                        <select class="form-control" name="acoes[email][destinatario][]">
                            <option value="cliente">E-mail do Cliente</option>
                            <option value="responsavel">Responsável pelo Cliente</option>
                            <option value="especifico">E-mail Específico</option>
                        </select>
                    </div>
                    <div class="col-md-12 mb-3 email-especifico" style="display: none;">
                        <label class="form-label">E-mail Específico</label>
                        <input type="email" class="form-control" name="acoes[email][email_especifico][]" placeholder="Digite o e-mail">
                    </div>
                    <div class="col-md-12 mb-3">
                        <label class="form-label">Mensagem Personalizada (opcional)</label>
                        <textarea class="form-control" name="acoes[email][mensagem_personalizada][]" rows="3" placeholder="Mensagem adicional que será incluída no e-mail..."></textarea>
                    </div>
                </div>
            </div>
        `;

        function toggleConfigAgendamento() {
            const isAgendamento = document.getElementById('triggerAgendamento').checked;
            document.getElementById('configAgendamento').style.display = isAgendamento ? 'block' : 'none';
            document.getElementById('secaoCondicoes').style.display = isAgendamento ? 'none' : 'block';
            atualizarPreview();
        }

        function atualizarCamposAgendamento() {
            const frequencia = document.getElementById('frequenciaAgendamento').value;
            document.getElementById('campoDiaSemana').style.display = frequencia === 'semanal' ? 'block' : 'none';
            document.getElementById('campoDiaMes').style.display = frequencia === 'mensal' ? 'block' : 'none';
        }

        function atualizarAssuntoEmail(selectElement) {
            const selectedOption = selectElement.options[selectElement.selectedIndex];
            if (selectedOption && selectedOption.value) {
                const assunto = selectedOption.getAttribute('data-assunto');
                const assuntoInput = selectElement.closest('.email-action-group').querySelector('input[name="acoes[email][assunto][]"]');
                
                if (assunto && assuntoInput) {
                    assuntoInput.value = assunto;
                }
            }
            atualizarPreview();
        }

        function atualizarCamposCondicao(selectElement) {
            const tipo = selectElement.value;
            const conditionalContainer = selectElement.closest('.condition-group').querySelector('.campos-condicionais');
            
            let html = '';
            
            switch(tipo) {
                case 'etapa_funil':
                    html = `
                        <label class="form-label">Etapa do Funil</label>
                        <select class="form-control" name="condicoes[etapa_funil_id][]" required>
                            <option value="">Selecione a etapa...</option>
                            <?php foreach ($etapas_funil as $etapa): ?>
                                <option value="<?php echo $etapa['id']; ?>">
                                    <?php echo htmlspecialchars($etapa['funil_nome'] . ' - ' . $etapa['nome']); ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    `;
                    break;
                    
                case 'agendamento':
                    html = `
                        <label class="form-label">Etapa de Agendamento</label>
                        <select class="form-control" name="condicoes[etapa_agendamento_id][]" required>
                            <option value="">Selecione a etapa...</option>
                            <?php foreach ($etapas_funil as $etapa): ?>
                                <?php if ($etapa['tipo_entrada'] === 'agendamento'): ?>
                                    <option value="<?php echo $etapa['id']; ?>">
                                        <?php echo htmlspecialchars($etapa['funil_nome'] . ' - ' . $etapa['nome']); ?>
                                        <small class="text-muted">(Agendamento)</small>
                                    </option>
                                <?php endif; ?>
                            <?php endforeach; ?>
                        </select>
                    `;
                    break;
                    
                case 'qualificado_especifico':
                    html = `
                        <label class="form-label">Questionário</label>
                        <select class="form-control" name="condicoes[questionario_id][]" required>
                            <option value="">Selecione o questionário...</option>
                            <?php foreach ($questionarios as $questionario): ?>
                                <option value="<?php echo $questionario['id']; ?>">
                                    <?php echo htmlspecialchars($questionario['nome']); ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    `;
                    break;
                    
                default:
                    html = '<p class="text-muted">Nenhum campo adicional necessário para esta condição.</p>';
            }
            
            conditionalContainer.innerHTML = html;
            atualizarPreview();
        }

        function atualizarPreview() {
            const preview = document.getElementById('rulePreview');
            const form = document.getElementById('formFluxo');
            const formData = new FormData(form);
            
            let previewHTML = '';
            
            // Tipo de trigger
            const tipoTrigger = formData.get('tipo_trigger') || 'evento';
            previewHTML += `<div class="rule-item"><strong>TIPO:</strong> ${tipoTrigger === 'agendamento' ? 'Fluxo Agendado' : 'Por Evento'}</div>`;
            
            if (tipoTrigger === 'agendamento') {
                const frequencia = formData.get('config_agendamento[frequencia]') || 'diario';
                const horario = formData.get('config_agendamento[horario]') || '09:00';
                let agendamentoTexto = `Executar ${frequencia === 'diario' ? 'diariamente' : frequencia === 'semanal' ? 'semanalmente' : 'mensalmente'} às ${horario}`;
                
                if (frequencia === 'semanal') {
                    const diaSemana = formData.get('config_agendamento[dia_semana]') || '1';
                    const dias = ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'];
                    agendamentoTexto += ` às ${dias[diaSemana]}s`;
                } else if (frequencia === 'mensal') {
                    const diaMes = formData.get('config_agendamento[dia_mes]') || '1';
                    agendamentoTexto += ` no dia ${diaMes} de cada mês`;
                }
                
                previewHTML += `<div class="rule-item"><strong>AGENDAMENTO:</strong> ${agendamentoTexto}</div>`;
            }
            
            // Condições (apenas para trigger por evento)
            if (tipoTrigger === 'evento') {
                const tiposCondicoes = formData.getAll('condicoes[tipo][]');
                const etapasFunil = formData.getAll('condicoes[etapa_funil_id][]');
                const etapasAgendamento = formData.getAll('condicoes[etapa_agendamento_id][]');
                const questionarios = formData.getAll('condicoes[questionario_id][]');
                
                if (tiposCondicoes.length > 0 && tiposCondicoes[0] !== '') {
                    previewHTML += '<div class="rule-item"><strong>QUANDO:</strong><ul>';
                    
                    tiposCondicoes.forEach((tipo, index) => {
                        let condicaoTexto = '';
                        
                        switch(tipo) {
                            case 'etapa_funil':
                                const etapaId = etapasFunil[index];
                                const etapa = <?php echo json_encode($etapas_funil); ?>.find(e => e.id == etapaId);
                                condicaoTexto = etapa ? `Cliente chegar na etapa "${etapa.nome}" do funil "${etapa.funil_nome}"` : 'Etapa do funil selecionada';
                                break;
                            case 'agendamento':
                                const etapaAgendamentoId = etapasAgendamento[index];
                                const etapaAgendamento = <?php echo json_encode($etapas_funil); ?>.find(e => e.id == etapaAgendamentoId);
                                condicaoTexto = etapaAgendamento ? `Cliente movido para "${etapaAgendamento.nome}" via agendamento` : 'Cliente movido para qualquer etapa de agendamento';
                                break;
                            case 'cadastro_manual':
                                condicaoTexto = 'Cliente for cadastrado manualmente';
                                break;
                            case 'cadastro_importacao':
                                condicaoTexto = 'Cliente for cadastrado via importação';
                                break;
                            case 'qualificado_qualquer':
                                condicaoTexto = 'Cliente for qualificado em qualquer questionário';
                                break;
                            case 'qualificado_especifico':
                                const questionarioId = questionarios[index];
                                const questionario = <?php echo json_encode($questionarios); ?>.find(q => q.id == questionarioId);
                                condicaoTexto = questionario ? `Cliente for qualificado no questionário "${questionario.nome}"` : 'Questionário selecionado';
                                break;
                            case 'envio_formulario':
                                condicaoTexto = 'Cliente enviar formulário por e-mail';
                                break;
                            default:
                                condicaoTexto = 'Condição não configurada';
                        }
                        
                        previewHTML += `<li>${condicaoTexto}</li>`;
                    });
                    
                    previewHTML += '</ul></div>';
                }
            }
            
            // Ações - Atividades
            const tiposAtividades = formData.getAll('acoes[atividade][tipo_atividade_id][]');
            const temposExecucao = formData.getAll('acoes[atividade][tempo_execucao][]');
            const unidadesTempo = formData.getAll('acoes[atividade][unidade_tempo][]');
            const descricoes = formData.getAll('acoes[atividade][descricao][]');
            
            if (tiposAtividades.length > 0 && tiposAtividades[0] !== '') {
                previewHTML += '<div class="rule-item"><strong>ENTÃO CRIAR ATIVIDADE:</strong><ul>';
                
                tiposAtividades.forEach((tipoId, index) => {
                    const tipoAtividade = <?php echo json_encode($tipos_atividades); ?>.find(t => t.id == tipoId);
                    const tempo = temposExecucao[index] || 0;
                    const unidade = unidadesTempo[index] || 'dias';
                    const descricao = descricoes[index] || '';
                    
                    let acaoTexto = tipoAtividade ? tipoAtividade.nome : 'Tipo de atividade selecionado';
                    
                    if (tempo > 0) {
                        acaoTexto += ` (após ${tempo} ${unidade})`;
                    }
                    
                    if (descricao) {
                        acaoTexto += ` - ${descricao}`;
                    }
                    
                    previewHTML += `<li>${acaoTexto}</li>`;
                });
                
                previewHTML += '</ul></div>';
            }
            
            // Ações - E-mails
            const templatesIds = formData.getAll('acoes[email][template_id][]');
            const assuntos = formData.getAll('acoes[email][assunto][]');
            const temposEnvio = formData.getAll('acoes[email][tempo_envio][]');
            const unidadesTempoEmail = formData.getAll('acoes[email][unidade_tempo][]');
            const destinatarios = formData.getAll('acoes[email][destinatario][]');
            
            if (templatesIds.length > 0 && templatesIds[0] !== '') {
                previewHTML += '<div class="rule-item"><strong>ENTÃO ENVIAR E-MAIL:</strong><ul>';
                
                templatesIds.forEach((templateId, index) => {
                    const template = <?php echo json_encode($templates_email); ?>.find(t => t.id == templateId);
                    const assunto = assuntos[index] || '';
                    const tempo = temposEnvio[index] || 0;
                    const unidade = unidadesTempoEmail[index] || 'dias';
                    const destinatario = destinatarios[index] || 'cliente';
                    
                    let acaoTexto = template ? template.nome : 'Template selecionado';
                    acaoTexto += ` - "${assunto}"`;
                    
                    if (tempo > 0) {
                        acaoTexto += ` (após ${tempo} ${unidade})`;
                    }
                    
                    acaoTexto += ` - Para: ${destinatario === 'cliente' ? 'E-mail do Cliente' : destinatario === 'responsavel' ? 'Responsável' : 'E-mail Específico'}`;
                    
                    previewHTML += `<li>${acaoTexto}</li>`;
                });
                
                previewHTML += '</ul></div>';
            }
            
            if (!previewHTML) {
                previewHTML = '<p class="text-muted">As condições e ações aparecerão aqui conforme você as configurar.</p>';
            }
            
            preview.innerHTML = previewHTML;
        }

        function adicionarCondicao() {
            const container = document.getElementById('condicoesContainer');
            container.insertAdjacentHTML('beforeend', condicaoTemplate);
            atualizarPreview();
        }

        function adicionarAcaoAtividade() {
            const container = document.getElementById('acoesAtividadesContainer');
            container.insertAdjacentHTML('beforeend', acaoAtividadeTemplate);
            atualizarPreview();
        }

        function adicionarAcaoEmail() {
            const container = document.getElementById('acoesEmailsContainer');
            container.insertAdjacentHTML('beforeend', acaoEmailTemplate);
            
            // Adicionar evento para mostrar/ocultar campo de e-mail específico
            const ultimoEmailGroup = container.querySelector('.email-action-group:last-child');
            const selectDestinatario = ultimoEmailGroup.querySelector('select[name="acoes[email][destinatario][]"]');
            const campoEmailEspecifico = ultimoEmailGroup.querySelector('.email-especifico');
            
            // Configurar evento change
            selectDestinatario.onchange = function() {
                campoEmailEspecifico.style.display = this.value === 'especifico' ? 'block' : 'none';
            };
            
            // Configurar evento change no template também
            const selectTemplate = ultimoEmailGroup.querySelector('select[name="acoes[email][template_id][]"]');
            selectTemplate.onchange = function() {
                atualizarAssuntoEmail(this);
            };
            
            atualizarPreview();
        }

        function removerCondicao(button) {
            if (document.querySelectorAll('.condition-group').length > 1) {
                button.closest('.condition-group').remove();
                atualizarPreview();
            } else {
                alert('É necessário ter pelo menos uma condição.');
            }
        }

        function removerAcao(button, tipo) {
            const container = tipo === 'email' ? 
                document.getElementById('acoesEmailsContainer') : 
                document.getElementById('acoesAtividadesContainer');
                
            const elementos = container.querySelectorAll('.action-group, .email-action-group');
            
            if (elementos.length > 1) {
                button.closest('.action-group, .email-action-group').remove();
                atualizarPreview();
            } else {
                alert(`É necessário ter pelo menos uma ação de ${tipo === 'email' ? 'e-mail' : 'atividade'}.`);
            }
        }

        function abrirModalNovoFluxo() {
            document.getElementById('modalFluxoTitulo').textContent = 'Novo Fluxo Automatizado';
            document.getElementById('fluxoId').value = '';
            document.getElementById('formFluxo').reset();
            
            // Limpar containers
            document.getElementById('condicoesContainer').innerHTML = '';
            document.getElementById('acoesAtividadesContainer').innerHTML = '';
            document.getElementById('acoesEmailsContainer').innerHTML = '';
            
            // Resetar tipo de trigger
            document.getElementById('triggerEvento').checked = true;
            toggleConfigAgendamento();
            
            // Adicionar uma condição e uma ação por padrão
            adicionarCondicao();
            adicionarAcaoAtividade();
            
            document.getElementById('novoFluxoModal').style.display = 'block';
        }

        function fecharModalNovoFluxo() {
            document.getElementById('novoFluxoModal').style.display = 'none';
        }

        function editarFluxo(fluxoId) {
            // Buscar dados do fluxo via AJAX
            fetch('buscar_fluxo.php', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: `id=${fluxoId}&csrf_token=<?php echo $_SESSION['csrf_token']; ?>`
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    const fluxo = data.fluxo;
                    
                    document.getElementById('modalFluxoTitulo').textContent = 'Editar Fluxo Automatizado';
                    document.getElementById('fluxoId').value = fluxo.id;
                    document.getElementById('nomeFluxo').value = fluxo.nome;
                    document.getElementById('descricaoFluxo').value = fluxo.descricao || '';
                    document.getElementById('ativoFluxo').checked = fluxo.ativo == 1;
                    
                    // Configurar tipo de trigger
                    const tipoTrigger = fluxo.tipo_trigger || 'evento';
                    document.getElementById(tipoTrigger === 'agendamento' ? 'triggerAgendamento' : 'triggerEvento').checked = true;
                    toggleConfigAgendamento();
                    
                    // Preencher configuração de agendamento se existir
                    if (fluxo.config_agendamento) {
                        const config = JSON.parse(fluxo.config_agendamento);
                        document.querySelector('select[name="config_agendamento[frequencia]"]').value = config.frequencia || 'diario';
                        document.querySelector('input[name="config_agendamento[horario]"]').value = config.horario || '09:00';
                        document.querySelector('select[name="config_agendamento[dia_semana]"]').value = config.dia_semana || '1';
                        document.querySelector('input[name="config_agendamento[dia_mes]"]').value = config.dia_mes || '1';
                        atualizarCamposAgendamento();
                    }
                    
                    // Limpar containers
                    document.getElementById('condicoesContainer').innerHTML = '';
                    document.getElementById('acoesAtividadesContainer').innerHTML = '';
                    document.getElementById('acoesEmailsContainer').innerHTML = '';
                    
                    // Preencher condições
                    const condicoes = JSON.parse(fluxo.condicoes || '[]');
                    condicoes.forEach(condicao => {
                        adicionarCondicao();
                        const ultimaCondicao = document.querySelector('#condicoesContainer .condition-group:last-child');
                        const selectTipo = ultimaCondicao.querySelector('.condicao-tipo');
                        selectTipo.value = condicao.tipo;
                        
                        // Disparar evento para carregar campos condicionais
                        const event = new Event('change');
                        selectTipo.dispatchEvent(event);
                        
                        // Preencher campos condicionais se existirem
                        setTimeout(() => {
                            if (condicao.tipo === 'etapa_funil' && condicao.etapa_funil_id) {
                                const selectEtapa = ultimaCondicao.querySelector('select[name="condicoes[etapa_funil_id][]"]');
                                if (selectEtapa) selectEtapa.value = condicao.etapa_funil_id;
                            } else if (condicao.tipo === 'agendamento' && condicao.etapa_agendamento_id) {
                                const selectEtapa = ultimaCondicao.querySelector('select[name="condicoes[etapa_agendamento_id][]"]');
                                if (selectEtapa) selectEtapa.value = condicao.etapa_agendamento_id;
                            } else if (condicao.tipo === 'qualificado_especifico' && condicao.questionario_id) {
                                const selectQuestionario = ultimaCondicao.querySelector('select[name="condicoes[questionario_id][]"]');
                                if (selectQuestionario) selectQuestionario.value = condicao.questionario_id;
                            }
                            atualizarPreview();
                        }, 100);
                    });
                    
                    // Preencher ações
                    const acoes = JSON.parse(fluxo.acoes || '[]');
                    acoes.forEach(acao => {
                        if (acao.tipo === 'atividade') {
                            adicionarAcaoAtividade();
                            const ultimaAcao = document.querySelector('#acoesAtividadesContainer .action-group:last-child');
                            
                            const selectTipo = ultimaAcao.querySelector('select[name="acoes[atividade][tipo_atividade_id][]"]');
                            const inputTempo = ultimaAcao.querySelector('input[name="acoes[atividade][tempo_execucao][]"]');
                            const selectUnidade = ultimaAcao.querySelector('select[name="acoes[atividade][unidade_tempo][]"]');
                            const textareaDescricao = ultimaAcao.querySelector('textarea[name="acoes[atividade][descricao][]"]');
                            
                            if (selectTipo) selectTipo.value = acao.tipo_atividade_id;
                            if (inputTempo) inputTempo.value = acao.tempo_execucao || 0;
                            if (selectUnidade) selectUnidade.value = acao.unidade_tempo || 'dias';
                            if (textareaDescricao) textareaDescricao.value = acao.descricao || '';
                        } else if (acao.tipo === 'email') {
                            adicionarAcaoEmail();
                            const ultimaAcao = document.querySelector('#acoesEmailsContainer .email-action-group:last-child');
                            
                            const selectTemplate = ultimaAcao.querySelector('select[name="acoes[email][template_id][]"]');
                            const inputAssunto = ultimaAcao.querySelector('input[name="acoes[email][assunto][]"]');
                            const inputTempo = ultimaAcao.querySelector('input[name="acoes[email][tempo_envio][]"]');
                            const selectUnidade = ultimaAcao.querySelector('select[name="acoes[email][unidade_tempo][]"]');
                            const selectDestinatario = ultimaAcao.querySelector('select[name="acoes[email][destinatario][]"]');
                            const inputEmailEspecifico = ultimaAcao.querySelector('input[name="acoes[email][email_especifico][]"]');
                            const textareaMensagem = ultimaAcao.querySelector('textarea[name="acoes[email][mensagem_personalizada][]"]');
                            
                            if (selectTemplate) selectTemplate.value = acao.template_id;
                            if (inputAssunto) inputAssunto.value = acao.assunto || '';
                            if (inputTempo) inputTempo.value = acao.tempo_envio || 0;
                            if (selectUnidade) selectUnidade.value = acao.unidade_tempo || 'dias';
                            if (selectDestinatario) selectDestinatario.value = acao.destinatario || 'cliente';
                            if (inputEmailEspecifico) inputEmailEspecifico.value = acao.email_especifico || '';
                            if (textareaMensagem) textareaMensagem.value = acao.mensagem_personalizada || '';
                            
                            // Mostrar/ocultar campo de e-mail específico
                            const campoEmailEspecifico = ultimaAcao.querySelector('.email-especifico');
                            campoEmailEspecifico.style.display = (acao.destinatario === 'especifico') ? 'block' : 'none';
                            
                            // Atualizar assunto se necessário
                            if (selectTemplate) {
                                const event = new Event('change');
                                selectTemplate.dispatchEvent(event);
                            }
                        }
                    });
                    
                    document.getElementById('novoFluxoModal').style.display = 'block';
                } else {
                    alert('Erro ao carregar fluxo: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Erro:', error);
                alert('Erro ao carregar dados do fluxo.');
            });
        }

        function toggleFluxo(fluxoId, novoStatus) {
            if (!confirm(`Tem certeza que deseja ${novoStatus ? 'ativar' : 'desativar'} este fluxo?`)) {
                return;
            }
            
            fetch('toggle_fluxo.php', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: `id=${fluxoId}&ativo=${novoStatus}&csrf_token=<?php echo $_SESSION['csrf_token']; ?>`
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert(`Fluxo ${novoStatus ? 'ativado' : 'desativado'} com sucesso!`);
                    location.reload();
                } else {
                    alert('Erro ao alterar status: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Erro:', error);
                alert('Erro ao alterar status do fluxo.');
            });
        }

        function excluirFluxo(fluxoId) {
            if (!confirm('Tem certeza que deseja excluir este fluxo? Esta ação não pode ser desfeita.')) {
                return;
            }
            
            fetch('excluir_fluxo.php', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: `id=${fluxoId}&csrf_token=<?php echo $_SESSION['csrf_token']; ?>`
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('Fluxo excluído com sucesso!');
                    location.reload();
                } else {
                    alert('Erro ao excluir fluxo: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Erro:', error);
                alert('Erro ao excluir fluxo.');
            });
        }

        // Atualizar preview quando o formulário mudar
        document.getElementById('formFluxo').addEventListener('change', atualizarPreview);
        document.getElementById('formFluxo').addEventListener('input', atualizarPreview);

        // Fechar modal ao clicar fora
        window.onclick = function(event) {
            const modal = document.getElementById('novoFluxoModal');
            if (event.target === modal) {
                modal.style.display = 'none';
            }
        }

        // Função de validação CORRIGIDA
        function validarESalvarFluxo() {
            console.log("=== INICIANDO VALIDAÇÃO ===");
            
            try {
                // 1. Validações básicas
                const nomeFluxo = document.getElementById('nomeFluxo');
                if (!nomeFluxo || !nomeFluxo.value.trim()) {
                    alert('Erro: O nome do fluxo é obrigatório.');
                    return;
                }

                const tipoTriggerRadio = document.querySelector('input[name="tipo_trigger"]:checked');
                if (!tipoTriggerRadio) {
                    alert('Erro: Selecione um tipo de ativação.');
                    return;
                }
                const tipoTrigger = tipoTriggerRadio.value;
                console.log("Tipo de trigger:", tipoTrigger);
                
                // 2. Validar condições apenas para trigger por evento
                if (tipoTrigger === 'evento') {
                    const condicoes = document.querySelectorAll('#condicoesContainer .condition-group');
                    if (condicoes.length === 0) {
                        alert('Erro: Para fluxos por evento, é necessário ter pelo menos uma condição.');
                        return;
                    }

                    // Verificar se todas as condições têm tipo selecionado
                    let condicoesValidas = true;
                    let condicaoInvalidaIndex = -1;
                    
                    condicoes.forEach((condicao, index) => {
                        const selectTipo = condicao.querySelector('.condicao-tipo');
                        if (!selectTipo || !selectTipo.value) {
                            condicoesValidas = false;
                            condicaoInvalidaIndex = index + 1;
                        }
                    });

                    if (!condicoesValidas) {
                        alert(`Erro: A condição ${condicaoInvalidaIndex} não tem um tipo selecionado.`);
                        return;
                    }
                }

                // 3. Validar ações
                const acoesAtividade = document.querySelectorAll('#acoesAtividadesContainer .action-group');
                const acoesEmail = document.querySelectorAll('#acoesEmailsContainer .email-action-group');
                
                let temAcaoValida = false;
                let mensagemErroAcao = '';

                // Verificar ações de atividade
                acoesAtividade.forEach((atividade, index) => {
                    const selectTipo = atividade.querySelector('select[name="acoes[atividade][tipo_atividade_id][]"]');
                    if (selectTipo && selectTipo.value) {
                        temAcaoValida = true;
                    } else {
                        mensagemErroAcao = `A atividade ${index + 1} não tem tipo selecionado.`;
                    }
                });

                // Verificar ações de email
                acoesEmail.forEach((email, index) => {
                    const selectTemplate = email.querySelector('select[name="acoes[email][template_id][]"]');
                    const inputAssunto = email.querySelector('input[name="acoes[email][assunto][]"]');
                    
                    if (selectTemplate && selectTemplate.value && inputAssunto && inputAssunto.value.trim()) {
                        temAcaoValida = true;
                    } else {
                        if (!selectTemplate || !selectTemplate.value) {
                            mensagemErroAcao = `O e-mail ${index + 1} não tem template selecionado.`;
                        } else if (!inputAssunto || !inputAssunto.value.trim()) {
                            mensagemErroAcao = `O e-mail ${index + 1} não tem assunto preenchido.`;
                        }
                    }
                });

                if (!temAcaoValida) {
                    alert('Erro: É necessário ter pelo menos uma ação (atividade ou e-mail) completamente configurada. ' + mensagemErroAcao);
                    return;
                }

                console.log("✅ Validação passou - Preparando dados...");

                // 4. Preparar dados
                prepararDadosFormulario();

                console.log("✅ Dados preparados - Enviando formulário...");

                // 5. Enviar formulário
                document.getElementById('formFluxo').submit();

            } catch (error) {
                console.error('❌ Erro na validação:', error);
                alert('Erro ao salvar fluxo: ' + error.message);
            }
        }

        // Função corrigida para preparar dados
        function prepararDadosFormulario() {
            console.log("Preparando dados do formulário...");
            
            const form = document.getElementById('formFluxo');
            
            // Remover campos hidden anteriores se existirem
            const camposAntigos = form.querySelectorAll('input[name="condicoes_json"], input[name="acoes_json"], input[name="config_agendamento_json"]');
            camposAntigos.forEach(campo => campo.remove());
            
            // 1. Preparar condições
            const condicoes = [];
            const conditionGroups = document.querySelectorAll('#condicoesContainer .condition-group');
            
            conditionGroups.forEach((group) => {
                const tipo = group.querySelector('.condicao-tipo').value;
                if (tipo) {
                    const condicao = { tipo: tipo };
                    
                    // Adicionar campos específicos
                    if (tipo === 'etapa_funil') {
                        const etapaSelect = group.querySelector('select[name="condicoes[etapa_funil_id][]"]');
                        if (etapaSelect && etapaSelect.value) {
                            condicao.etapa_funil_id = parseInt(etapaSelect.value);
                        }
                    } else if (tipo === 'agendamento') {
                        const etapaSelect = group.querySelector('select[name="condicoes[etapa_agendamento_id][]"]');
                        if (etapaSelect && etapaSelect.value) {
                            condicao.etapa_agendamento_id = parseInt(etapaSelect.value);
                        }
                    } else if (tipo === 'qualificado_especifico') {
                        const questionarioSelect = group.querySelector('select[name="condicoes[questionario_id][]"]');
                        if (questionarioSelect && questionarioSelect.value) {
                            condicao.questionario_id = parseInt(questionarioSelect.value);
                        }
                    }
                    
                    condicoes.push(condicao);
                }
            });
            
            // Adicionar campo hidden para condições
            if (condicoes.length > 0) {
                const condicoesInput = document.createElement('input');
                condicoesInput.type = 'hidden';
                condicoesInput.name = 'condicoes_json';
                condicoesInput.value = JSON.stringify(condicoes);
                form.appendChild(condicoesInput);
            }
            
            // 2. Preparar ações
            const acoes = [];
            
            // Ações de atividade
            const atividadeGroups = document.querySelectorAll('#acoesAtividadesContainer .action-group');
            atividadeGroups.forEach((group) => {
                const tipoAtividadeSelect = group.querySelector('select[name="acoes[atividade][tipo_atividade_id][]"]');
                if (tipoAtividadeSelect && tipoAtividadeSelect.value) {
                    const acao = {
                        tipo: 'criar_atividade',
                        tipo_atividade_id: parseInt(tipoAtividadeSelect.value)
                    };
                    
                    // Campos opcionais
                    const tempoInput = group.querySelector('input[name="acoes[atividade][tempo_execucao][]"]');
                    const unidadeSelect = group.querySelector('select[name="acoes[atividade][unidade_tempo][]"]');
                    const descricaoTextarea = group.querySelector('textarea[name="acoes[atividade][descricao][]"]');
                    
                    if (tempoInput && tempoInput.value) {
                        acao.tempo_execucao = parseInt(tempoInput.value);
                    }
                    if (unidadeSelect && unidadeSelect.value) {
                        acao.unidade_tempo = unidadeSelect.value;
                    }
                    if (descricaoTextarea && descricaoTextarea.value) {
                        acao.descricao = descricaoTextarea.value;
                    }
                    
                    acoes.push(acao);
                }
            });
            
            // Ações de email
            const emailGroups = document.querySelectorAll('#acoesEmailsContainer .email-action-group');
            emailGroups.forEach((group) => {
                const templateSelect = group.querySelector('select[name="acoes[email][template_id][]"]');
                const assuntoInput = group.querySelector('input[name="acoes[email][assunto][]"]');
                
                if (templateSelect && templateSelect.value && assuntoInput && assuntoInput.value.trim()) {
                    const acao = {
                        tipo: 'enviar_email',
                        template_id: parseInt(templateSelect.value),
                        assunto: assuntoInput.value.trim()
                    };
                    
                    // Campos opcionais
                    const tempoInput = group.querySelector('input[name="acoes[email][tempo_envio][]"]');
                    const unidadeSelect = group.querySelector('select[name="acoes[email][unidade_tempo][]"]');
                    const destinatarioSelect = group.querySelector('select[name="acoes[email][destinatario][]"]');
                    const mensagemTextarea = group.querySelector('textarea[name="acoes[email][mensagem_personalizada][]"]');
                    
                    if (tempoInput && tempoInput.value) {
                        acao.tempo_envio = parseInt(tempoInput.value);
                    }
                    if (unidadeSelect && unidadeSelect.value) {
                        acao.unidade_tempo = unidadeSelect.value;
                    }
                    if (destinatarioSelect && destinatarioSelect.value) {
                        acao.destinatario = destinatarioSelect.value;
                    }
                    if (mensagemTextarea && mensagemTextarea.value) {
                        acao.mensagem = mensagemTextarea.value;
                    }
                    
                    // Email específico
                    if (destinatarioSelect && destinatarioSelect.value === 'especifico') {
                        const emailEspecificoInput = group.querySelector('input[name="acoes[email][email_especifico][]"]');
                        if (emailEspecificoInput && emailEspecificoInput.value) {
                            acao.email_especifico = emailEspecificoInput.value;
                        }
                    }
                    
                    acoes.push(acao);
                }
            });
            
            // Adicionar campo hidden para ações
            if (acoes.length > 0) {
                const acoesInput = document.createElement('input');
                acoesInput.type = 'hidden';
                acoesInput.name = 'acoes_json';
                acoesInput.value = JSON.stringify(acoes);
                form.appendChild(acoesInput);
            }
            
            // 3. Configuração de agendamento - CORREÇÃO: Obter tipoTrigger dentro da função
            const tipoTrigger = document.querySelector('input[name="tipo_trigger"]:checked').value;
            console.log("Tipo trigger:", tipoTrigger);
            
            if (tipoTrigger === 'agendamento') {
                const configAgendamento = {};
                
                const frequenciaSelect = document.querySelector('select[name="config_agendamento[frequencia]"]');
                const horarioInput = document.querySelector('input[name="config_agendamento[horario]"]');
                
                if (frequenciaSelect && frequenciaSelect.value) {
                    configAgendamento.frequencia = frequenciaSelect.value;
                }
                if (horarioInput && horarioInput.value) {
                    configAgendamento.horario = horarioInput.value;
                }
                
                // Campos condicionais
                if (frequenciaSelect && frequenciaSelect.value === 'semanal') {
                    const diaSemanaSelect = document.querySelector('select[name="config_agendamento[dia_semana]"]');
                    if (diaSemanaSelect && diaSemanaSelect.value) {
                        configAgendamento.dia_semana = parseInt(diaSemanaSelect.value);
                    }
                } else if (frequenciaSelect && frequenciaSelect.value === 'mensal') {
                    const diaMesInput = document.querySelector('input[name="config_agendamento[dia_mes]"]');
                    if (diaMesInput && diaMesInput.value) {
                        configAgendamento.dia_mes = parseInt(diaMesInput.value);
                    }
                }
                
                const configInput = document.createElement('input');
                configInput.type = 'hidden';
                configInput.name = 'config_agendamento_json';
                configInput.value = JSON.stringify(configAgendamento);
                form.appendChild(configInput);
            }
            
            console.log("Condições:", condicoes);
            console.log("Ações:", acoes);
            console.log("Dados preparados com sucesso!");
        }
    </script>
</body>
</html>

<?php
// Funções auxiliares para exibir textos das condições e ações
function getTextoCondicao($condicao, $etapas_funil, $questionarios) {
    $tipo = $condicao['tipo'] ?? '';
    
    switch ($tipo) {
        case 'etapa_funil':
            $etapa_id = $condicao['etapa_funil_id'] ?? '';
            foreach ($etapas_funil as $etapa) {
                if ($etapa['id'] == $etapa_id) {
                    return "Etapa: {$etapa['funil_nome']} - {$etapa['nome']}";
                }
            }
            return "Etapa do funil";
            
        case 'agendamento':
            $etapa_id = $condicao['etapa_agendamento_id'] ?? '';
            if ($etapa_id) {
                foreach ($etapas_funil as $etapa) {
                    if ($etapa['id'] == $etapa_id) {
                        return "Agendamento: {$etapa['funil_nome']} - {$etapa['nome']}";
                    }
                }
            }
            return "Qualquer agendamento";
            
        case 'cadastro_manual':
            return "Cadastro manual";
            
        case 'cadastro_importacao':
            return "Cadastro via importação";
            
        case 'qualificado_qualquer':
            return "Qualificado em qualquer questionário";
            
        case 'qualificado_especifico':
            $questionario_id = $condicao['questionario_id'] ?? '';
            foreach ($questionarios as $questionario) {
                if ($questionario['id'] == $questionario_id) {
                    return "Qualificado em: {$questionario['nome']}";
                }
            }
            return "Qualificado em questionário";
            
        case 'envio_formulario':
            return "Envio de formulário";
            
        default:
            return "Condição desconhecida";
    }
}

// Nova função para identificar o tipo de ação
function getTipoAcao($acao) {
    if (isset($acao['tipo'])) {
        return $acao['tipo'] === 'email' ? 'E-mail' : 'Atividade';
    }
    // Para compatibilidade com versões antigas
    return isset($acao['template_id']) ? 'E-mail' : 'Atividade';
}