<?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.");
}

// Função para atualizar a estrutura da tabela se necessário
function atualizarTabelaFluxos($conn) {
    // Verificar se a tabela existe
    $result = $conn->query("SHOW TABLES LIKE 'fluxos_automatizados'");
    if ($result->num_rows == 0) {
        // Criar tabela se não existir
        $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,
            enviar_notificacao_atividades TINYINT(1) DEFAULT 0,
            notificar_destinatarios TEXT DEFAULT NULL,
            notificacao_sistema TINYINT(1) DEFAULT 0,
            notificar_minutos_antes INT DEFAULT 0
        )";
        
        if ($conn->query($sql) === TRUE) {
            error_log("Tabela fluxos_automatizados criada com sucesso");
        } else {
            error_log("Erro ao criar tabela: " . $conn->error);
        }
    } else {
        // Verificar e adicionar colunas ausentes
        $colunas_existentes = [];
        $result_colunas = $conn->query("SHOW COLUMNS FROM fluxos_automatizados");
        while ($row = $result_colunas->fetch_assoc()) {
            $colunas_existentes[] = $row['Field'];
        }
        
        $colunas_necessarias = [
            'enviar_notificacao_atividades' => "ADD COLUMN enviar_notificacao_atividades TINYINT(1) DEFAULT 0 AFTER ultima_execucao",
            'notificar_destinatarios' => "ADD COLUMN notificar_destinatarios TEXT DEFAULT NULL AFTER enviar_notificacao_atividades",
            'notificacao_sistema' => "ADD COLUMN notificacao_sistema TINYINT(1) DEFAULT 0 AFTER notificar_destinatarios",
            'notificar_minutos_antes' => "ADD COLUMN notificar_minutos_antes INT DEFAULT 0 AFTER notificacao_sistema"
        ];
        
        foreach ($colunas_necessarias as $coluna => $sql_alter) {
            if (!in_array($coluna, $colunas_existentes)) {
                $alter_sql = "ALTER TABLE fluxos_automatizados " . $sql_alter;
                if ($conn->query($alter_sql) === TRUE) {
                    error_log("Coluna $coluna adicionada com sucesso");
                } else {
                    error_log("Erro ao adicionar coluna $coluna: " . $conn->error);
                }
            }
        }
    }
}

// Atualizar tabela se necessário
atualizarTabelaFluxos($conn);

// Buscar informações do plano do tenant
$plano_info = null;
$permite_fluxos = false;
$max_fluxos = 0;

$sql_plano = "SELECT p.* FROM tenants t 
              LEFT JOIN planos p ON t.plano_id = p.id 
              WHERE t.id = ?";
if ($stmt = $conn->prepare($sql_plano)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    if ($result->num_rows > 0) {
        $plano_info = $result->fetch_assoc();
        $permite_fluxos = (bool)($plano_info['permite_fluxos'] ?? 0);
        
        // Definir limites baseados no nome do plano
        $nome_plano = $plano_info['nome'] ?? '';
        
        switch($nome_plano) {
            case 'Plano Teste 15 Dias':
                $max_fluxos = 2;
                break;
            case 'Basic':
            case 'Plano Básico':
                $max_fluxos = 4;
                break;
            case 'Pro':
            case 'Plano Pró':
                $max_fluxos = 8;
                break;
            case 'Enterprise':
            case 'Planos Enterprise':
                $max_fluxos = 0;
                break;
            default:
                $max_fluxos = 0;
        }
    }
    $stmt->close();
}

// Verificar limite de fluxos
$total_fluxos = 0;
$sql_count = "SELECT COUNT(*) as total FROM fluxos_automatizados WHERE tenant_id = ?";
if ($stmt = $conn->prepare($sql_count)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    if ($result->num_rows > 0) {
        $row = $result->fetch_assoc();
        $total_fluxos = (int)$row['total'];
    }
    $stmt->close();
}

// 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 informações do usuário logado
$usuario_info = [];
if ($usuario_id) {
    $sql_usuario = "SELECT nome, email, telefone, cargo FROM usuarios WHERE id = ? AND tenant_id = ?";
    if ($stmt = $conn->prepare($sql_usuario)) {
        $stmt->bind_param("ii", $usuario_id, $tenant_id);
        $stmt->execute();
        $result = $stmt->get_result();
        if ($result->num_rows > 0) {
            $usuario_info = $result->fetch_assoc();
        } else {
            $usuario_info = [
                'nome' => $_SESSION['nome_usuario'] ?? 'Nome do Usuário',
                'email' => $_SESSION['email_usuario'] ?? 'email@empresa.com',
                'telefone' => '',
                'cargo' => $_SESSION['cargo_usuario'] ?? 'Diretor de Operações'
            ];
        }
        $stmt->close();
    }
}

// Buscar informações do tenant
$tenant_info = [];
$sql_tenant = "SELECT nome_fantasia, logo_path FROM tenants WHERE id = ?";
if ($stmt = $conn->prepare($sql_tenant)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    if ($result->num_rows > 0) {
        $tenant_info = $result->fetch_assoc();
        
        if (!empty($tenant_info['logo_path'])) {
            $tenant_info['logo_url'] = converterParaUrlAbsoluta($tenant_info['logo_path']);
        }
    }
    $stmt->close();
}

// 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();
}

// Atualizar total_fluxos com base na contagem real
$total_fluxos = count($fluxos_automatizados);

// 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, ef.funil_id 
               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();
}

// Buscar usuários para notificação
$usuarios_notificacao = [];
$sql_usuarios = "SELECT id, nome, email FROM usuarios WHERE tenant_id = ? AND ativo = 'sim' ORDER BY nome";
if ($stmt = $conn->prepare($sql_usuarios)) {
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $result = $stmt->get_result();
    while ($row = $result->fetch_assoc()) {
        $usuarios_notificacao[] = $row;
    }
    $stmt->close();
}

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

// Função para converter caminho relativo em URL absoluta
function converterParaUrlAbsoluta($caminhoRelativo) {
    if (filter_var($caminhoRelativo, FILTER_VALIDATE_URL)) {
        return $caminhoRelativo;
    }
    
    $protocolo = isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? "https" : "http";
    $host = $_SERVER['HTTP_HOST'];
    
    if (strpos($caminhoRelativo, '/') === 0) {
        return $protocolo . "://" . $host . $caminhoRelativo;
    }
    
    $diretorioBase = dirname($_SERVER['PHP_SELF']);
    return $protocolo . "://" . $host . $diretorioBase . '/' . ltrim($caminhoRelativo, '/');
}
?>

<!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;
        }
        
        .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: 20px;
            padding: 60px;
            margin-right: 80px;
            margin-left: 80px;
            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: 80%;
            max-width: 900px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2);
            max-height: 90vh;
            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;
        }
        
        .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;
        }
        
        .condition-group {
            border: 1px solid #dee2e6;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: white;
        }
        
        .action-group {
            border: 1px solid #28a745;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #f8fff9;
        }
        
        .email-action-group {
            border: 1px solid #007bff;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #f0f8ff;
        }
        
        .notification-config-group {
            border: 1px solid #ffc107;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #fffdf5;
        }
        
        .sistema-notification-group {
            border: 1px solid #17a2b8;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #e7f3ff;
        }
        
        .rule-preview {
            background: #e9ecef;
            padding: 15px;
            border-radius: 5px;
            margin-top: 15px;
        }
        
        .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-atividade {
            background-color: #28a745;
            color: white;
        }
        
        .badge-email {
            background-color: #007bff;
            color: white;
        }
        
        .badge-notificacao {
            background-color: #ffc107;
            color: black;
        }
        
        .badge-sino {
            background-color: #17a2b8;
            color: white;
        }
        
        .badge-recuperacao {
            background-color: #9c27b0;
            color: white;
        }
        
        .trigger-section {
            background: #fff3cd;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #ffeaa7;
        }
        
        .scheduling-config {
            background: #e7f3ff;
            padding: 15px;
            border-radius: 5px;
            margin-top: 10px;
            border: 1px solid #b3d9ff;
        }
        
        .preview-section {
            background: #f8f9fa;
            padding: 15px;
            border-radius: 5px;
            margin-top: 20px;
            border: 1px solid #dee2e6;
        }
        
        .email-preview {
            background: white;
            border: 1px solid #ddd;
            border-radius: 5px;
            padding: 15px;
            margin-top: 10px;
        }
        
        .assinatura-preview {
            margin-top: 20px;
            padding-top: 15px;
            border-top: 2px solid #e0e0e0;
            font-family: Arial, sans-serif;
        }
        
        .assinatura-logo-preview {
            max-height: 40px;
            max-width: 150px;
            margin-bottom: 10px;
        }
        
        .plan-limit-message {
            background-color: #fff3cd;
            border: 1px solid #ffeaa7;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 20px;
        }
        
        .plan-limit-message .alert-icon {
            font-size: 24px;
            color: #856404;
            margin-right: 10px;
        }
        
        .btn-disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }
        
        .plan-info {
            background-color: #e7f3ff;
            border: 1px solid #b3d9ff;
            border-radius: 5px;
            padding: 10px 15px;
            margin-bottom: 15px;
        }
        
        .plan-warning {
            background-color: #fff3cd;
            border: 1px solid #ffeaa7;
            border-radius: 5px;
            padding: 10px 15px;
            margin-bottom: 15px;
        }
        
        .plan-danger {
            background-color: #f8d7da;
            border: 1px solid #f5c6cb;
            border-radius: 5px;
            padding: 10px 15px;
            margin-bottom: 15px;
        }
        
        .limit-reached {
            border: 2px solid #dc3545;
            background-color: #f8d7da;
        }
        
        .notification-recipients {
            max-height: 200px;
            overflow-y: auto;
            border: 1px solid #dee2e6;
            border-radius: 5px;
            padding: 10px;
            background: white;
        }
        
        .notification-recipient-item {
            padding: 8px 12px;
            border-bottom: 1px solid #f0f0f0;
        }
        
        .notification-recipient-item:last-child {
            border-bottom: none;
        }
        
        .notification-recipient-item .form-check {
            margin-left: 0;
            padding-left: 0;
        }
        
        .notification-recipient-item .form-check-input {
            margin-left: 0;
            margin-right: 10px;
            margin-top: 0.25em;
        }
        
        .notification-recipient-item .form-check-label {
            display: flex;
            align-items: center;
        }
        
        .notification-config-section {
            background: #fffdf5;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #ffeaa7;
        }
        
        .sistema-notification-section {
            background: #e7f3ff;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #b3d9ff;
        }
        
        .notification-time-options {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 10px;
        }
        
        .notification-time-option {
            flex: 1;
            min-width: 120px;
        }
        
        .sino-icon {
            color: #17a2b8;
            font-size: 1.2em;
        }
        
        .recuperacao-section {
            background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #ce93d8;
        }
        
        .recuperacao-action-group {
            border: 2px solid #9c27b0;
            border-radius: 5px;
            padding: 15px;
            margin-bottom: 15px;
            background: #f3e5f5;
        }
        
        .btn-outline-purple {
            color: #9c27b0;
            border-color: #9c27b0;
        }
        
        .btn-outline-purple:hover {
            color: #fff;
            background-color: #9c27b0;
            border-color: #9c27b0;
        }
        
        .multi-select-container {
            max-height: 200px;
            overflow-y: auto;
            border: 1px solid #ced4da;
            border-radius: 5px;
            padding: 10px;
            background: white;
        }
        
        .multi-select-item {
            padding: 8px 12px;
            border-bottom: 1px solid #f0f0f0;
        }
        
        .multi-select-item:last-child {
            border-bottom: none;
        }
        
        .condition-header, .action-header, .email-action-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
        }
        
        .motivos-checkbox-container {
            padding-left: 20px;
            margin-bottom: 10px;
        }
        
        .motivos-checkbox-container .form-check {
            margin-bottom: 8px;
            padding-left: 0;
        }
        
        .motivos-checkbox-container .form-check-input {
            margin-left: 0;
            margin-right: 10px;
        }
        
        .motivo-config-item {
            padding: 10px;
            border-bottom: 1px solid #eee;
            margin-bottom: 5px;
        }
        
        .motivo-config-item:last-child {
            border-bottom: none;
        }
        
        .motivo-config-item .row {
            align-items: center;
        }
        
        .motivo-config-item .form-check {
            margin-bottom: 0;
        }
        
        .motivo-config-item input[type="number"] {
            width: 100%;
            padding: 5px;
        }
        
        .motivo-config-item select {
            width: 100%;
            padding: 5px;
        }
    </style>
</head>
<body>

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

    <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; ?>

            <?php if (!$permite_fluxos): ?>
                <div class="plan-limit-message">
                    <div class="d-flex align-items-center">
                        <i class="fas fa-exclamation-triangle alert-icon"></i>
                        <div>
                            <h5 class="mb-1">Funcionalidade não disponível</h5>
                            <p class="mb-0">
                                Os fluxos automatizados não estão disponíveis no seu plano atual 
                                "<?php echo htmlspecialchars($plano_info['nome'] ?? 'Plano Básico'); ?>". 
                                Para acessar esta funcionalidade, faça um upgrade do seu plano.
                            </p>
                        </div>
                    </div>
                </div>
            <?php endif; ?>

            <div class="card <?php echo ($max_fluxos > 0 && $total_fluxos >= $max_fluxos) ? 'limit-reached' : ''; ?>">
                <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>
                    <?php if ($permite_fluxos && ($max_fluxos === 0 || $total_fluxos < $max_fluxos)): ?>
                        <button type="button" class="btn btn-primary" onclick="abrirModalNovoFluxo()">
                            <i class="fas fa-plus"></i> Novo Fluxo
                        </button>
                    <?php else: ?>
                        <button type="button" class="btn btn-primary btn-disabled" disabled onclick="showPlanLimitAlert()">
                            <i class="fas fa-plus"></i> Novo Fluxo
                        </button>
                    <?php endif; ?>
                </div>
                <div class="card-body">
                    <?php if ($plano_info): ?>
                        <div class="<?php echo ($max_fluxos > 0 && $total_fluxos >= $max_fluxos) ? 'plan-danger' : 'plan-info'; ?>">
                            <div class="d-flex align-items-center">
                                <i class="fas fa-info-circle me-2"></i>
                                <div>
                                    <strong>Plano atual:</strong> <?php echo htmlspecialchars($plano_info['nome']); ?> |
                                    <strong>Fluxos criados:</strong> <?php echo $total_fluxos; ?> 
                                    <?php if ($max_fluxos > 0): ?>
                                        de <?php echo $max_fluxos; ?> permitidos
                                        <?php if ($total_fluxos >= $max_fluxos): ?>
                                            <span class="badge bg-danger ms-2">LIMITE ATINGIDO</span>
                                        <?php endif; ?>
                                    <?php else: ?>
                                        (ilimitados)
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                    <?php endif; ?>
                    
                    <?php if (empty($fluxos_automatizados)): ?>
                        <div class="empty-state">
                            <i class="fas fa-project-diagram"></i>
                            <h5>Nenhum fluxo automatizado criado</h5>
                            <p>
                                <?php if ($permite_fluxos): ?>
                                    Clique em "Novo Fluxo" para criar seu primeiro fluxo automatizado.
                                <?php else: ?>
                                    Os fluxos automatizados não estão disponíveis no seu plano atual.
                                <?php endif; ?>
                            </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>Ações</th>
                                        <th>Notificações</th>
                                        <th>Sino</th>
                                        <th>Status</th>
                                        <th>Última Execução</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, $funis);
                                                            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) {
                                                        if ($tipo === 'Atividade') {
                                                            $badge_class = 'badge-atividade';
                                                        } elseif ($tipo === 'E-mail') {
                                                            $badge_class = 'badge-email';
                                                        } elseif ($tipo === 'Recuperação') {
                                                            $badge_class = 'badge-recuperacao';
                                                        } else {
                                                            $badge_class = 'badge-secondary';
                                                        }
                                                        return '<span class="badge ' . $badge_class . '">' . $tipo . '</span>';
                                                    }, $tipos_acoes));
                                                ?>
                                            </td>
                                            <td>
                                                <?php if (isset($fluxo['enviar_notificacao_atividades']) && $fluxo['enviar_notificacao_atividades']): ?>
                                                    <span class="badge badge-notificacao" title="Notificar quando criar atividades">
                                                        <i class="fas fa-envelope"></i> E-mail
                                                    </span>
                                                <?php else: ?>
                                                    <span class="badge bg-secondary">Desativado</span>
                                                <?php endif; ?>
                                            </td>
                                            <td>
                                                <?php if (isset($fluxo['notificacao_sistema']) && $fluxo['notificacao_sistema']): ?>
                                                    <span class="badge badge-sino" title="Notificação no sistema">
                                                        <i class="fas fa-bell sino-icon"></i> 
                                                        <?php 
                                                            $minutos = $fluxo['notificar_minutos_antes'] ?? 0;
                                                            if ($minutos == 0) {
                                                                echo 'Na hora';
                                                            } elseif ($minutos == 5) {
                                                                echo '5 min antes';
                                                            } elseif ($minutos == 15) {
                                                                echo '15 min antes';
                                                            } elseif ($minutos == 30) {
                                                                echo '30 min antes';
                                                            } elseif ($minutos == 60) {
                                                                echo '1 hora antes';
                                                            } elseif ($minutos == 1440) {
                                                                echo '1 dia antes';
                                                            } else {
                                                                echo $minutos . ' min antes';
                                                            }
                                                        ?>
                                                    </span>
                                                <?php else: ?>
                                                    <span class="badge bg-secondary">Desativado</span>
                                                <?php endif; ?>
                                            </td>
                                            <td>
                                                <span class="badge <?php echo $fluxo['ativo'] ? 'bg-success' : 'bg-secondary'; ?>">
                                                    <?php echo $fluxo['ativo'] ? 'Ativo' : 'Inativo'; ?>
                                                </span>
                                            </td>
                                            <td>
                                                <?php echo $fluxo['ultima_execucao'] ? date('d/m/Y H:i', strtotime($fluxo['ultima_execucao'])) : 'Nunca'; ?>
                                            </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-info" onclick="executarFluxo(<?php echo $fluxo['id']; ?>)">
                                                    <i class="fas fa-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="">
                <input type="hidden" id="isEdicao" name="is_edicao" value="0">
                
                <input type="hidden" name="usuario_info_json" value="<?php echo htmlspecialchars(json_encode($usuario_info)); ?>">
                <input type="hidden" name="tenant_info_json" value="<?php echo htmlspecialchars(json_encode($tenant_info)); ?>">
                
                <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">
                    </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>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="recuperacao-tab" data-bs-toggle="tab" data-bs-target="#recuperacao" type="button" role="tab">Recuperação</button>
                        </li>
                    </ul>
                    
                    <div class="tab-content" id="acoesTabContent">
                        <div class="tab-pane fade show active" id="atividades" role="tabpanel">
                            <div id="acoesAtividadesContainer">
                            </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">
                            </div>
                            <button type="button" class="btn btn-outline-info btn-sm" onclick="adicionarAcaoEmail()">
                                <i class="fas fa-plus"></i> Adicionar E-mail
                            </button>
                            
                            <div class="preview-section mt-4">
                                <h6><i class="fas fa-eye"></i> Prévia da Assinatura do E-mail</h6>
                                <div class="email-preview">
                                    <div id="assinaturaPreview">
                                        <p class="text-muted">A assinatura aparecerá aqui conforme as informações do usuário e empresa.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="recuperacao" role="tabpanel">
                            <div class="recuperacao-section">
                                <h5><i class="fas fa-user-check"></i> Recuperar Cliente Perdido</h5>
                                <p class="text-muted">Recupere automaticamente clientes que foram marcados como perdidos após períodos específicos configurados para cada motivo.</p>
                                
                                <div id="acoesRecuperacaoContainer">
                                </div>
                                <button type="button" class="btn btn-outline-purple btn-sm" onclick="adicionarAcaoRecuperacao()">
                                    <i class="fas fa-plus"></i> Adicionar Recuperação
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="sistema-notification-section">
                    <h5><i class="fas fa-bell sino-icon"></i> Notificação no Sistema (Sino)</h5>
                    <p class="text-muted">Configure notificações no sistema quando este fluxo criar atividades.</p>
                    
                    <div class="sistema-notification-group">
                        <div class="mb-3 form-check">
                            <input type="checkbox" class="form-check-input" id="notificacaoSistema" name="notificacao_sistema" value="1">
                            <label class="form-check-label" for="notificacaoSistema">
                                <strong>Notificar no sistema quando criar atividades</strong>
                            </label>
                            <small class="form-text text-muted d-block">
                                Mostra uma notificação no sino do sistema quando este fluxo criar uma nova atividade.
                            </small>
                        </div>
                        
                        <div id="configSistemaContainer" style="display: none; margin-top: 15px;">
                            <div class="mb-3">
                                <label class="form-label">Notificar com quanta antecedência?</label>
                                <div class="notification-time-options">
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificarNaHora" value="0">
                                        <label class="form-check-label" for="notificarNaHora">
                                            Na hora
                                        </label>
                                    </div>
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificar5Min" value="5" checked>
                                        <label class="form-check-label" for="notificar5Min">
                                            5 minutos antes
                                        </label>
                                    </div>
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificar15Min" value="15">
                                        <label class="form-check-label" for="notificar15Min">
                                            15 minutos antes
                                        </label>
                                    </div>
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificar30Min" value="30">
                                        <label class="form-check-label" for="notificar30Min">
                                            30 minutos antes
                                        </label>
                                    </div>
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificar1Hora" value="60">
                                        <label class="form-check-label" for="notificar1Hora">
                                            1 hora antes
                                        </label>
                                    </div>
                                    <div class="form-check notification-time-option">
                                        <input class="form-check-input" type="radio" name="notificar_minutos_antes" id="notificar1Dia" value="1440">
                                        <label class="form-check-label" for="notificar1Dia">
                                            1 dia antes
                                        </label>
                                    </div>
                                </div>
                                <small class="form-text text-muted">
                                    A notificação aparecerá no sino do sistema com a antecedência selecionada.
                                </small>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="notification-config-section">
                    <h5><i class="fas fa-envelope"></i> Notificação por E-mail</h5>
                    <p class="text-muted">Configure notificações por e-mail quando este fluxo criar atividades.</p>
                    
                    <div class="notification-config-group">
                        <div class="mb-3 form-check">
                            <input type="checkbox" class="form-check-input" id="enviarNotificacaoAtividades" name="enviar_notificacao_atividades" value="1">
                            <label class="form-check-label" for="enviarNotificacaoAtividades">
                                <strong>Enviar notificação por e-mail quando criar atividades</strong>
                            </label>
                            <small class="form-text text-muted d-block">
                                Envia um e-mail para os destinatários configurados abaixo quando este fluxo criar uma nova atividade.
                            </small>
                        </div>
                        
                        <div id="configNotificacaoContainer" style="display: none; margin-top: 15px;">
                            <div class="mb-3">
                                <label class="form-label">Destinatários da Notificação*</label>
                                <div class="notification-recipients">
                                    <?php foreach ($usuarios_notificacao as $usuario): ?>
                                        <div class="notification-recipient-item form-check">
                                            <input class="form-check-input" type="checkbox" 
                                                   name="notificar_destinatarios[]" 
                                                   value="<?php echo $usuario['email']; ?>"
                                                   id="dest_<?php echo $usuario['id']; ?>"
                                                   data-nome="<?php echo htmlspecialchars($usuario['nome']); ?>">
                                            <label class="form-check-label" for="dest_<?php echo $usuario['id']; ?>">
                                                <?php echo htmlspecialchars($usuario['nome']); ?> 
                                                <small class="text-muted">(<?php echo htmlspecialchars($usuario['email']); ?>)</small>
                                            </label>
                                        </div>
                                    <?php endforeach; ?>
                                </div>
                                <small class="form-text text-muted">
                                    Selecione os usuários que receberão notificações por e-mail quando este fluxo criar atividades.
                                </small>
                            </div>
                            
                            <div class="mb-3">
                                <label class="form-label">Assunto Padrão do E-mail</label>
                                <input type="text" class="form-control" name="assunto_notificacao" 
                                       value="Nova atividade criada por fluxo automatizado" 
                                       placeholder="Assunto do e-mail de notificação">
                            </div>
                            
                            <div class="mb-3">
                                <label class="form-label">Mensagem Adicional (opcional)</label>
                                <textarea class="form-control" name="mensagem_adicional_notificacao" rows="3" 
                                          placeholder="Mensagem adicional que será incluída no e-mail de notificação..."></textarea>
                            </div>
                        </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" id="btnSalvarFluxo" 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>
                            <option value="cliente_perdido">Cliente marcado como perdido</option>
                        </select>
                    </div>
                    <div class="col-md-6 mb-3 campos-condicionais">
                    </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>
        `;

        // Template de ação - Recuperar Cliente Perdido (VERSÃO CORRIGIDA COM CAMPOS DE TEMPO)
        const acaoRecuperacaoTemplate = `
            <div class="recuperacao-action-group">
                <div class="action-header">
                    <h6 class="mb-0">Recuperar Cliente Perdido</h6>
                    <button type="button" class="btn btn-sm btn-outline-danger" onclick="removerAcao(this, 'recuperacao')">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                <div class="row">
                    <div class="col-md-12 mb-3">
                        <label class="form-label">Configurar períodos de recuperação por motivo*</label>
                        <div class="multi-select-container" id="motivosConfigContainer">
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][desistencia][ativo]" 
                                                   value="1" id="motivo_desistencia">
                                            <label class="form-check-label" for="motivo_desistencia">
                                                <strong>Desistência</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][desistencia][tempo]" 
                                               min="1" value="1" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][desistencia][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][sem_interesse][ativo]" 
                                                   value="1" id="motivo_sem_interesse">
                                            <label class="form-check-label" for="motivo_sem_interesse">
                                                <strong>Sem interesse</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][sem_interesse][tempo]" 
                                               min="1" value="3" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][sem_interesse][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][preco_elevado][ativo]" 
                                                   value="1" id="motivo_preco_elevado">
                                            <label class="form-check-label" for="motivo_preco_elevado">
                                                <strong>Preço elevado</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][preco_elevado][tempo]" 
                                               min="1" value="7" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][preco_elevado][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][concorrencia][ativo]" 
                                                   value="1" id="motivo_concorrencia">
                                            <label class="form-check-label" for="motivo_concorrencia">
                                                <strong>Concorrência</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][concorrencia][tempo]" 
                                               min="1" value="5" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][concorrencia][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][nao_atende][ativo]" 
                                                   value="1" id="motivo_nao_atende">
                                            <label class="form-check-label" for="motivo_nao_atende">
                                                <strong>Não atende</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][nao_atende][tempo]" 
                                               min="1" value="2" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][nao_atende][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][mudou_ideia][ativo]" 
                                                   value="1" id="motivo_mudou_ideia" checked>
                                            <label class="form-check-label" for="motivo_mudou_ideia">
                                                <strong>Mudou de ideia</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][mudou_ideia][tempo]" 
                                               min="1" value="1" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][mudou_ideia][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][problemas_financeiros][ativo]" 
                                                   value="1" id="motivo_problemas_financeiros">
                                            <label class="form-check-label" for="motivo_problemas_financeiros">
                                                <strong>Problemas financeiros</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][problemas_financeiros][tempo]" 
                                               min="1" value="14" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][problemas_financeiros][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][outro][ativo]" 
                                                   value="1" id="motivo_outro">
                                            <label class="form-check-label" for="motivo_outro">
                                                <strong>Outro</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][outro][tempo]" 
                                               min="1" value="7" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][outro][unidade]">
                                            <option value="dias" selected>Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="motivo-config-item">
                                <div class="row align-items-center mb-2">
                                    <div class="col-md-5">
                                        <div class="form-check">
                                            <input class="form-check-input motivo-checkbox" type="checkbox" 
                                                   name="acoes[recuperacao][motivos_config][qualquer][ativo]" 
                                                   value="1" id="motivo_qualquer">
                                            <label class="form-check-label" for="motivo_qualquer">
                                                <strong><i class="fas fa-asterisk"></i> Qualquer motivo</strong>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <input type="number" class="form-control form-control-sm" 
                                               name="acoes[recuperacao][motivos_config][qualquer][tempo]" 
                                               min="1" value="30" placeholder="Dias">
                                    </div>
                                    <div class="col-md-4">
                                        <select class="form-control form-control-sm" 
                                                name="acoes[recuperacao][motivos_config][qualquer][unidade]">
                                            <option value="dias">Dias</option>
                                            <option value="horas">Horas</option>
                                            <option value="semanas">Semanas</option>
                                            <option value="meses">Meses</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <small class="form-text text-muted">
                            Configure períodos específicos para cada motivo. Se "Qualquer motivo" estiver ativo, será aplicado a todos os clientes perdidos.
                        </small>
                    </div>
                    
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Funil de destino*</label>
                        <select class="form-control" name="acoes[recuperacao][funil_destino_id][]" required onchange="carregarEtapasParaRecuperacao(this)">
                            <option value="">Selecione...</option>
                            <?php foreach ($funis as $funil): ?>
                                <option value="<?php echo $funil['id']; ?>"><?php echo htmlspecialchars($funil['nome']); ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Etapa de destino*</label>
                        <select class="form-control" name="acoes[recuperacao][etapa_destino_id][]" required>
                            <option value="">Selecione um funil primeiro</option>
                        </select>
                    </div>
                    
                    <div class="col-md-12 mb-3">
                        <label class="form-label">Motivo da recuperação (opcional)</label>
                        <input type="text" class="form-control" name="acoes[recuperacao][motivo_recuperacao][]" 
                               placeholder="Ex: Tentativa de reengajamento" value="Recuperação automática">
                    </div>
                </div>
            </div>
        `;

        // Dados do usuário e tenant para a assinatura
        const usuarioInfo = <?php echo json_encode($usuario_info); ?>;
        const tenantInfo = <?php echo json_encode($tenant_info); ?>;
        const etapasFunil = <?php echo json_encode($etapas_funil); ?>;
        const funis = <?php echo json_encode($funis); ?>;

        // Variáveis do plano para validação
        const permiteFluxos = <?php echo $permite_fluxos ? 'true' : 'false'; ?>;
        const maxFluxos = <?php echo $max_fluxos; ?>;
        const totalFluxosAtuais = <?php echo $total_fluxos; ?>;

        // Inicializar o controle de notificações
        document.addEventListener('DOMContentLoaded', function() {
            const notificacaoCheckbox = document.getElementById('enviarNotificacaoAtividades');
            const configContainer = document.getElementById('configNotificacaoContainer');
            const notificacaoSistemaCheckbox = document.getElementById('notificacaoSistema');
            const configSistemaContainer = document.getElementById('configSistemaContainer');
            
            if (notificacaoCheckbox) {
                notificacaoCheckbox.addEventListener('change', function() {
                    configContainer.style.display = this.checked ? 'block' : 'none';
                    atualizarPreview();
                });
            }
            
            if (notificacaoSistemaCheckbox) {
                notificacaoSistemaCheckbox.addEventListener('change', function() {
                    configSistemaContainer.style.display = this.checked ? 'block' : 'none';
                    atualizarPreview();
                });
            }
            
            atualizarAssinaturaPreview();
        });

        function showPlanLimitAlert() {
            if (!permiteFluxos) {
                alert('Os fluxos automatizados não estão disponíveis no seu plano atual. Faça um upgrade para acessar esta funcionalidade.');
            } else if (maxFluxos > 0 && totalFluxosAtuais >= maxFluxos) {
                alert('Você atingiu o limite de ' + maxFluxos + ' fluxos do seu plano. Faça um upgrade para criar mais fluxos automatizados.');
            }
        }

        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();
            atualizarAssinaturaPreview();
        }

        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']); ?>
                                    </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;
                    
                case 'cliente_perdido':
                    html = `
                        <div class="alert alert-info">
                            <i class="fas fa-info-circle"></i>
                            <strong>Condição:</strong> Cliente marcado como perdido
                            <br>
                            <small>Os períodos para recuperação serão configurados na aba "Recuperação"</small>
                        </div>
                    `;
                    break;
                    
                default:
                    html = '<p class="text-muted">Nenhum campo adicional necessário para esta condição.</p>';
            }
            
            conditionalContainer.innerHTML = html;
            atualizarPreview();
        }

        function atualizarAssinaturaPreview() {
            const preview = document.getElementById('assinaturaPreview');
            
            if (usuarioInfo && tenantInfo) {
                let assinaturaHTML = '<div class="assinatura-preview">';
                
                if (tenantInfo.logo_url) {
                    assinaturaHTML += `<div class="logo-container">
                        <img src="${tenantInfo.logo_url}" alt="${tenantInfo.nome_fantasia || 'Empresa'}" class="assinatura-logo-preview">
                    </div>`;
                }
                
                assinaturaHTML += `<div style="font-weight: bold; color: #333; margin-bottom: 5px; font-size: 14px;">${usuarioInfo.nome || 'Nome do Usuário'}</div>`;
                assinaturaHTML += `<div style="color: #666; margin-bottom: 5px; font-size: 13px;">${usuarioInfo.cargo || 'Diretor de Operações'}</div>`;
                assinaturaHTML += `<div style="color: #666; margin-bottom: 5px; font-size: 13px;">${tenantInfo.nome_fantasia || 'SON'}</div>`;
                
                assinaturaHTML += `<div style="color: #666; font-size: 12px;">`;
                assinaturaHTML += `E-mail: ${usuarioInfo.email || 'email@empresa.com'}`;
                
                if (usuarioInfo.telefone) {
                    assinaturaHTML += `<br>Telefone: ${formatarTelefone(usuarioInfo.telefone)}`;
                }
                
                assinaturaHTML += `</div>`;
                assinaturaHTML += `</div>`;
                
                preview.innerHTML = assinaturaHTML;
            } else {
                preview.innerHTML = '<p class="text-muted">Carregando informações da assinatura...</p>';
            }
        }

        function formatarTelefone(telefone) {
            const numeros = telefone.replace(/\D/g, '');
            
            if (numeros.length === 11) {
                return '+55 (' + numeros.substring(0, 2) + ') ' + numeros.substring(2, 7) + '-' + numeros.substring(7);
            } else if (numeros.length === 10) {
                return '+55 (' + numeros.substring(0, 2) + ') ' + numeros.substring(2, 6) + '-' + numeros.substring(6);
            } else {
                return telefone;
            }
        }

        function atualizarPreview() {
            const preview = document.getElementById('rulePreview');
            const form = document.getElementById('formFluxo');
            const formData = new FormData(form);
            
            let previewHTML = '';
            
            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>`;
            }
            
            if (tipoTrigger === 'evento') {
                const tiposCondicoes = formData.getAll('condicoes[tipo][]');
                const etapasFunilIds = formData.getAll('condicoes[etapa_funil_id][]');
                const etapasAgendamentoIds = formData.getAll('condicoes[etapa_agendamento_id][]');
                const questionariosIds = 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 = etapasFunilIds[index];
                                const etapa = etapasFunil.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 = etapasAgendamentoIds[index];
                                const etapaAgendamento = etapasFunil.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 = questionariosIds[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;
                            case 'cliente_perdido':
                                condicaoTexto = 'Cliente marcado como perdido';
                                break;
                            default:
                                condicaoTexto = 'Condição não configurada';
                        }
                        
                        previewHTML += `<li>${condicaoTexto}</li>`;
                    });
                    
                    previewHTML += '</ul></div>';
                }
            }
            
            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>';
            }
            
            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>';
            }
            
            const notificacaoSistema = document.getElementById('notificacaoSistema').checked;
            if (notificacaoSistema) {
                const minutosAntes = document.querySelector('input[name="notificar_minutos_antes"]:checked');
                let tempoAntecedencia = 'na hora';
                
                if (minutosAntes) {
                    const minutos = parseInt(minutosAntes.value);
                    if (minutos === 0) {
                        tempoAntecedencia = 'na hora';
                    } else if (minutos === 5) {
                        tempoAntecedencia = '5 minutos antes';
                    } else if (minutos === 15) {
                        tempoAntecedencia = '15 minutos antes';
                    } else if (minutos === 30) {
                        tempoAntecedencia = '30 minutos antes';
                    } else if (minutos === 60) {
                        tempoAntecedencia = '1 hora antes';
                    } else if (minutos === 1440) {
                        tempoAntecedencia = '1 dia antes';
                    } else {
                        tempoAntecedencia = minutos + ' minutos antes';
                    }
                }
                
                previewHTML += `<div class="rule-item"><strong>🔔 NOTIFICAÇÃO NO SISTEMA:</strong> Mostrar notificação no sino ${tempoAntecedencia}</div>`;
            }
            
            const enviarNotificacao = document.getElementById('enviarNotificacaoAtividades').checked;
            if (enviarNotificacao) {
                previewHTML += '<div class="rule-item"><strong>📧 NOTIFICAÇÃO POR E-MAIL:</strong> Enviar e-mail quando criar atividades</div>';
                
                const destinatariosSelecionados = form.querySelectorAll('input[name="notificar_destinatarios[]"]:checked');
                if (destinatariosSelecionados.length > 0) {
                    previewHTML += '<div class="rule-item"><strong>Destinatários:</strong><ul>';
                    destinatariosSelecionados.forEach(dest => {
                        const nome = dest.getAttribute('data-nome');
                        previewHTML += `<li>${nome}</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);
            
            const ultimoEmailGroup = container.querySelector('.email-action-group:last-child');
            const selectDestinatario = ultimoEmailGroup.querySelector('select[name="acoes[email][destinatario][]"]');
            const campoEmailEspecifico = ultimoEmailGroup.querySelector('.email-especifico');
            
            selectDestinatario.onchange = function() {
                campoEmailEspecifico.style.display = this.value === 'especifico' ? 'block' : 'none';
            };
            
            const selectTemplate = ultimoEmailGroup.querySelector('select[name="acoes[email][template_id][]"]');
            selectTemplate.onchange = function() {
                atualizarAssuntoEmail(this);
            };
            
            atualizarPreview();
            atualizarAssinaturaPreview();
        }

        function adicionarAcaoRecuperacao() {
            const container = document.getElementById('acoesRecuperacaoContainer');
            container.insertAdjacentHTML('beforeend', acaoRecuperacaoTemplate);
            
            const ultimaRecuperacaoGroup = container.querySelector('.recuperacao-action-group:last-child');
            const selectFunil = ultimaRecuperacaoGroup.querySelector('select[name="acoes[recuperacao][funil_destino_id][]"]');
            const selectEtapa = ultimaRecuperacaoGroup.querySelector('select[name="acoes[recuperacao][etapa_destino_id][]"]');
            
            selectFunil.onchange = function() {
                carregarEtapasParaRecuperacao(this);
            };
            
            const qualquerCheckbox = ultimaRecuperacaoGroup.querySelector('#motivo_qualquer');
            const outrosCheckboxes = ultimaRecuperacaoGroup.querySelectorAll('.motivo-checkbox:not(#motivo_qualquer)');
            
            if (qualquerCheckbox) {
                qualquerCheckbox.onchange = function() {
                    if (this.checked) {
                        outrosCheckboxes.forEach(cb => {
                            cb.checked = false;
                            cb.disabled = true;
                            const row = cb.closest('.motivo-config-item');
                            const tempoInput = row.querySelector('input[type="number"]');
                            const unidadeSelect = row.querySelector('select');
                            if (tempoInput) tempoInput.disabled = true;
                            if (unidadeSelect) unidadeSelect.disabled = true;
                        });
                    } else {
                        outrosCheckboxes.forEach(cb => {
                            cb.disabled = false;
                            const row = cb.closest('.motivo-config-item');
                            const tempoInput = row.querySelector('input[type="number"]');
                            const unidadeSelect = row.querySelector('select');
                            if (tempoInput) tempoInput.disabled = !cb.checked;
                            if (unidadeSelect) unidadeSelect.disabled = !cb.checked;
                        });
                    }
                    atualizarPreview();
                };
                
                qualquerCheckbox.dispatchEvent(new Event('change'));
            }
            
            outrosCheckboxes.forEach(cb => {
                cb.onchange = function() {
                    if (this.checked && qualquerCheckbox && qualquerCheckbox.checked) {
                        qualquerCheckbox.checked = false;
                        qualquerCheckbox.dispatchEvent(new Event('change'));
                    }
                    
                    const row = this.closest('.motivo-config-item');
                    const tempoInput = row.querySelector('input[type="number"]');
                    const unidadeSelect = row.querySelector('select');
                    
                    if (tempoInput) tempoInput.disabled = !this.checked;
                    if (unidadeSelect) unidadeSelect.disabled = !this.checked;
                    
                    atualizarPreview();
                };
                
                const row = cb.closest('.motivo-config-item');
                const tempoInput = row.querySelector('input[type="number"]');
                const unidadeSelect = row.querySelector('select');
                
                if (tempoInput) tempoInput.disabled = !cb.checked;
                if (unidadeSelect) unidadeSelect.disabled = !cb.checked;
            });
            
            atualizarPreview();
        }

        async function carregarEtapasParaRecuperacao(selectFunil) {
            if (!selectFunil) return;
            
            const funilId = selectFunil.value;
            const recuperacaoGroup = selectFunil.closest('.recuperacao-action-group');
            const selectEtapa = recuperacaoGroup.querySelector('select[name="acoes[recuperacao][etapa_destino_id][]"]');
            
            if (!funilId || !selectEtapa) {
                selectEtapa.innerHTML = '<option value="">Selecione um funil primeiro</option>';
                selectEtapa.disabled = true;
                return;
            }
            
            selectEtapa.innerHTML = '<option value="">Carregando etapas...</option>';
            selectEtapa.disabled = true;
            
            try {
                const etapasDoFunil = etapasFunil.filter(etapa => etapa.funil_id == funilId);
                
                selectEtapa.innerHTML = '<option value="">Selecione uma etapa...</option>';
                
                if (etapasDoFunil.length > 0) {
                    etapasDoFunil.forEach(etapa => {
                        const option = document.createElement('option');
                        option.value = etapa.id;
                        option.textContent = etapa.nome;
                        selectEtapa.appendChild(option);
                    });
                    selectEtapa.disabled = false;
                } else {
                    selectEtapa.innerHTML = '<option value="">Nenhuma etapa encontrada</option>';
                }
            } catch (error) {
                console.error('Erro ao carregar etapas:', error);
                selectEtapa.innerHTML = '<option value="">Erro ao carregar etapas</option>';
            }
        }

        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) {
            let container;
            let seletor;
            
            switch(tipo) {
                case 'email':
                    container = document.getElementById('acoesEmailsContainer');
                    seletor = '.email-action-group';
                    break;
                case 'recuperacao':
                    container = document.getElementById('acoesRecuperacaoContainer');
                    seletor = '.recuperacao-action-group';
                    break;
                default:
                    container = document.getElementById('acoesAtividadesContainer');
                    seletor = '.action-group';
            }
                
            const elementos = container.querySelectorAll(seletor);
            
            if (elementos.length > 1) {
                button.closest(seletor).remove();
                atualizarPreview();
            } else {
                alert(`É necessário ter pelo menos uma ação de ${tipo === 'email' ? 'e-mail' : tipo === 'recuperacao' ? 'recuperação' : 'atividade'}.`);
            }
        }

        function abrirModalNovoFluxo() {
            if (!permiteFluxos) {
                alert('Os fluxos automatizados não estão disponíveis no seu plano atual. Faça um upgrade para acessar esta funcionalidade.');
                return;
            }
            
            if (maxFluxos > 0 && totalFluxosAtuais >= maxFluxos) {
                alert('Você atingiu o limite de ' + maxFluxos + ' fluxos do seu plano. Faça um upgrade para criar mais fluxos automatizados.');
                return;
            }
            
            document.getElementById('modalFluxoTitulo').textContent = 'Novo Fluxo Automatizado';
            document.getElementById('fluxoId').value = '';
            document.getElementById('isEdicao').value = '0';
            document.getElementById('formFluxo').reset();
            
            document.getElementById('condicoesContainer').innerHTML = '';
            document.getElementById('acoesAtividadesContainer').innerHTML = '';
            document.getElementById('acoesEmailsContainer').innerHTML = '';
            document.getElementById('acoesRecuperacaoContainer').innerHTML = '';
            
            document.getElementById('triggerEvento').checked = true;
            toggleConfigAgendamento();
            
            document.getElementById('enviarNotificacaoAtividades').checked = false;
            document.getElementById('configNotificacaoContainer').style.display = 'none';
            document.getElementById('notificacaoSistema').checked = false;
            document.getElementById('configSistemaContainer').style.display = 'none';
            
            document.getElementById('notificar5Min').checked = true;
            
            document.querySelectorAll('input[name="notificar_destinatarios[]"]').forEach(cb => {
                cb.checked = false;
            });
            
            adicionarCondicao();
            adicionarAcaoAtividade();
            
            atualizarAssinaturaPreview();
            
            document.getElementById('novoFluxoModal').style.display = 'block';
        }

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

        function editarFluxo(fluxoId) {
            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('isEdicao').value = '1';
                    document.getElementById('nomeFluxo').value = fluxo.nome;
                    document.getElementById('descricaoFluxo').value = fluxo.descricao || '';
                    document.getElementById('ativoFluxo').checked = fluxo.ativo == 1;
                    
                    const enviarNotificacao = fluxo.enviar_notificacao_atividades == 1;
                    document.getElementById('enviarNotificacaoAtividades').checked = enviarNotificacao;
                    document.getElementById('configNotificacaoContainer').style.display = enviarNotificacao ? 'block' : 'none';
                    
                    const notificacaoSistema = fluxo.notificacao_sistema == 1;
                    document.getElementById('notificacaoSistema').checked = notificacaoSistema;
                    document.getElementById('configSistemaContainer').style.display = notificacaoSistema ? 'block' : 'none';
                    
                    const minutosAntes = fluxo.notificar_minutos_antes || 5;
                    const radioId = 'notificar' + (minutosAntes === 0 ? 'NaHora' : 
                                                minutosAntes === 5 ? '5Min' :
                                                minutosAntes === 15 ? '15Min' :
                                                minutosAntes === 30 ? '30Min' :
                                                minutosAntes === 60 ? '1Hora' :
                                                minutosAntes === 1440 ? '1Dia' : '5Min');
                    const radioElement = document.getElementById(radioId);
                    if (radioElement) {
                        radioElement.checked = true;
                    }
                    
                    if (fluxo.notificar_destinatarios) {
                        const destinatarios = fluxo.notificar_destinatarios.split(',');
                        document.querySelectorAll('input[name="notificar_destinatarios[]"]').forEach(cb => {
                            cb.checked = destinatarios.includes(cb.value);
                        });
                    }
                    
                    const tipoTrigger = fluxo.tipo_trigger || 'evento';
                    document.getElementById(tipoTrigger === 'agendamento' ? 'triggerAgendamento' : 'triggerEvento').checked = true;
                    toggleConfigAgendamento();
                    
                    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();
                    }
                    
                    document.getElementById('condicoesContainer').innerHTML = '';
                    document.getElementById('acoesAtividadesContainer').innerHTML = '';
                    document.getElementById('acoesEmailsContainer').innerHTML = '';
                    document.getElementById('acoesRecuperacaoContainer').innerHTML = '';
                    
                    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;
                        
                        const event = new Event('change');
                        selectTipo.dispatchEvent(event);
                        
                        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);
                    });
                    
                    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 || '';
                            
                            const campoEmailEspecifico = ultimaAcao.querySelector('.email-especifico');
                            campoEmailEspecifico.style.display = (acao.destinatario === 'especifico') ? 'block' : 'none';
                            
                            if (selectTemplate) {
                                const event = new Event('change');
                                selectTemplate.dispatchEvent(event);
                            }
                        } else if (acao.tipo === 'recuperacao') {
                            adicionarAcaoRecuperacao();
                            const ultimaAcao = document.querySelector('#acoesRecuperacaoContainer .recuperacao-action-group:last-child');
                            
                            const inputMotivo = ultimaAcao.querySelector('input[name="acoes[recuperacao][motivo_recuperacao][]"]');
                            const selectFunil = ultimaAcao.querySelector('select[name="acoes[recuperacao][funil_destino_id][]"]');
                            const selectEtapa = ultimaAcao.querySelector('select[name="acoes[recuperacao][etapa_destino_id][]"]');
                            
                            if (inputMotivo) inputMotivo.value = acao.motivo_recuperacao || 'Recuperação automática';
                            if (selectFunil) selectFunil.value = acao.funil_destino_id || '';
                            
                            if (acao.motivos_config) {
                                Object.keys(acao.motivos_config).forEach(chave => {
                                    const config = acao.motivos_config[chave];
                                    if (config.ativo) {
                                        const checkbox = ultimaAcao.querySelector(`#motivo_${chave}`);
                                        const tempoInput = ultimaAcao.querySelector(`input[name="acoes[recuperacao][motivos_config][${chave}][tempo]"]`);
                                        const unidadeSelect = ultimaAcao.querySelector(`select[name="acoes[recuperacao][motivos_config][${chave}][unidade]"]`);
                                        
                                        if (checkbox) checkbox.checked = true;
                                        if (tempoInput) tempoInput.value = config.tempo || 1;
                                        if (unidadeSelect) unidadeSelect.value = config.unidade || 'dias';
                                    }
                                });
                                
                                const qualquerCheckbox = ultimaAcao.querySelector('#motivo_qualquer');
                                if (qualquerCheckbox) {
                                    qualquerCheckbox.dispatchEvent(new Event('change'));
                                }
                            }
                            
                            if (selectFunil && selectFunil.value) {
                                setTimeout(() => {
                                    carregarEtapasParaRecuperacao(selectFunil);
                                    if (acao.etapa_destino_id) {
                                        setTimeout(() => {
                                            if (selectEtapa) selectEtapa.value = acao.etapa_destino_id;
                                        }, 300);
                                    }
                                }, 100);
                            }
                        }
                    });
                    
                    atualizarAssinaturaPreview();
                    
                    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 executarFluxo(fluxoId) {
            if (!confirm('Deseja executar este fluxo manualmente agora?')) {
                return;
            }
            
            fetch('executar_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 executado com sucesso!');
                    location.reload();
                } else {
                    alert('Erro ao executar fluxo: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Erro:', error);
                alert('Erro ao executar 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.');
            });
        }

        function validarESalvarFluxo() {
            console.log("=== INICIANDO VALIDAÇÃO ===");
            
            try {
                const fluxoId = document.getElementById('fluxoId').value;
                const isEdicao = document.getElementById('isEdicao').value === '1';
                
                if (!isEdicao && maxFluxos > 0 && totalFluxosAtuais >= maxFluxos) {
                    alert('Limite de fluxos atingido! Você já criou ' + totalFluxosAtuais + ' fluxos do limite de ' + maxFluxos + ' do seu plano.');
                    return;
                }

                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;
                
                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;
                    }

                    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;
                    }
                }

                const acoesAtividade = document.querySelectorAll('#acoesAtividadesContainer .action-group');
                const acoesEmail = document.querySelectorAll('#acoesEmailsContainer .email-action-group');
                const acoesRecuperacao = document.querySelectorAll('#acoesRecuperacaoContainer .recuperacao-action-group');
                
                let temAcaoValida = false;
                let mensagemErroAcao = '';

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

                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.`;
                        }
                    }
                });

                acoesRecuperacao.forEach((recuperacao, index) => {
                    const motivosAtivos = recuperacao.querySelectorAll('.motivo-checkbox:checked');
                    const funilSelect = recuperacao.querySelector('select[name="acoes[recuperacao][funil_destino_id][]"]');
                    const etapaSelect = recuperacao.querySelector('select[name="acoes[recuperacao][etapa_destino_id][]"]');
                    
                    if (motivosAtivos.length === 0) {
                        mensagemErroAcao = `A recuperação ${index + 1} não tem nenhum motivo configurado.`;
                        return;
                    }
                    
                    if (!funilSelect || !funilSelect.value) {
                        mensagemErroAcao = `A recuperação ${index + 1} não tem funil de destino selecionado.`;
                        return;
                    }
                    
                    if (!etapaSelect || !etapaSelect.value) {
                        mensagemErroAcao = `A recuperação ${index + 1} não tem etapa de destino selecionada.`;
                        return;
                    }
                    
                    let temTempoConfigurado = false;
                    motivosAtivos.forEach(checkbox => {
                        const row = checkbox.closest('.motivo-config-item');
                        const tempoInput = row.querySelector('input[type="number"]');
                        if (tempoInput && tempoInput.value && tempoInput.value > 0) {
                            temTempoConfigurado = true;
                        }
                    });
                    
                    if (!temTempoConfigurado) {
                        mensagemErroAcao = `A recuperação ${index + 1} tem motivos selecionados mas sem tempo configurado.`;
                        return;
                    }
                    
                    temAcaoValida = true;
                });

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

                const enviarNotificacao = document.getElementById('enviarNotificacaoAtividades').checked;
                if (enviarNotificacao) {
                    const destinatariosSelecionados = document.querySelectorAll('input[name="notificar_destinatarios[]"]:checked');
                    if (destinatariosSelecionados.length === 0) {
                        alert('Erro: Quando ativar notificações por e-mail, é necessário selecionar pelo menos um destinatário.');
                        return;
                    }
                }

                const notificacaoSistema = document.getElementById('notificacaoSistema').checked;
                if (notificacaoSistema) {
                    const minutosAntesSelecionados = document.querySelectorAll('input[name="notificar_minutos_antes"]:checked');
                    if (minutosAntesSelecionados.length === 0) {
                        alert('Erro: Quando ativar notificações no sistema, é necessário selecionar a antecedência.');
                        return;
                    }
                }

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

                prepararDadosFormulario();

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

                document.getElementById('formFluxo').submit();

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

        function prepararDadosFormulario() {
            console.log("Preparando dados do formulário...");
            
            const form = document.getElementById('formFluxo');
            
            const camposAntigos = form.querySelectorAll('input[name="condicoes_json"], input[name="acoes_json"], input[name="config_agendamento_json"], input[name="notificar_destinatarios_json"], input[name="notificar_minutos_antes_json"]');
            camposAntigos.forEach(campo => campo.remove());
            
            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 };
                    
                    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);
                }
            });
            
            if (condicoes.length > 0) {
                const condicoesInput = document.createElement('input');
                condicoesInput.type = 'hidden';
                condicoesInput.name = 'condicoes_json';
                condicoesInput.value = JSON.stringify(condicoes);
                form.appendChild(condicoesInput);
            }
            
            const acoes = [];
            
            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: 'atividade',
                        tipo_atividade_id: parseInt(tipoAtividadeSelect.value)
                    };
                    
                    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);
                }
            });
            
            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: 'email',
                        template_id: parseInt(templateSelect.value),
                        assunto: assuntoInput.value.trim()
                    };
                    
                    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_personalizada = mensagemTextarea.value;
                    }
                    
                    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);
                }
            });
            
            // ===== SEÇÃO CORRIGIDA: AÇÕES DE RECUPERAÇÃO =====
            const recuperacaoGroups = document.querySelectorAll('#acoesRecuperacaoContainer .recuperacao-action-group');
            
            recuperacaoGroups.forEach((group, groupIndex) => {
                const funilSelect = group.querySelector('select[name="acoes[recuperacao][funil_destino_id][]"]');
                const etapaSelect = group.querySelector('select[name="acoes[recuperacao][etapa_destino_id][]"]');
                const motivoRecuperacaoInput = group.querySelector('input[name="acoes[recuperacao][motivo_recuperacao][]"]');
                
                const funilId = funilSelect ? funilSelect.value : null;
                const etapaId = etapaSelect ? etapaSelect.value : null;
                const motivoRecuperacao = motivoRecuperacaoInput ? motivoRecuperacaoInput.value : 'Recuperação automática';
                
                if (funilId && etapaId) {
                    const motivosSelecionados = [];
                    const motivosConfig = {};
                    
                    const motivoNomes = {
                        'desistencia': 'Desistência',
                        'sem_interesse': 'Sem interesse',
                        'preco_elevado': 'Preço elevado',
                        'concorrencia': 'Concorrência',
                        'nao_atende': 'Não atende',
                        'mudou_ideia': 'Mudou de ideia',
                        'problemas_financeiros': 'Problemas financeiros',
                        'outro': 'Outro',
                        'qualquer': 'qualquer'
                    };
                    
                    const motivosChaves = [
                        'desistencia', 'sem_interesse', 'preco_elevado', 'concorrencia',
                        'nao_atende', 'mudou_ideia', 'problemas_financeiros', 'outro', 'qualquer'
                    ];
                    
                    let tempoPadrao = 7;
                    let unidadePadrao = 'dias';
                    let motivoEncontrado = false;
                    
                    motivosChaves.forEach(motivoKey => {
                        const checkbox = group.querySelector(`input[name="acoes[recuperacao][motivos_config][${motivoKey}][ativo]"]`);
                        const tempoInput = group.querySelector(`input[name="acoes[recuperacao][motivos_config][${motivoKey}][tempo]"]`);
                        const unidadeSelect = group.querySelector(`select[name="acoes[recuperacao][motivos_config][${motivoKey}][unidade]"]`);
                        
                        if (checkbox && checkbox.checked) {
                            motivosSelecionados.push(motivoKey);
                            
                            if (tempoInput && tempoInput.value && tempoInput.value > 0) {
                                tempoPadrao = parseInt(tempoInput.value);
                                motivoEncontrado = true;
                            }
                            
                            if (unidadeSelect && unidadeSelect.value) {
                                unidadePadrao = unidadeSelect.value;
                            }
                            
                            if (tempoInput && unidadeSelect) {
                                motivosConfig[motivoKey] = {
                                    motivo: motivoNomes[motivoKey] || motivoKey,
                                    ativo: true,
                                    tempo: parseInt(tempoInput.value) || 1,
                                    unidade: unidadeSelect.value || 'dias'
                                };
                            }
                        }
                    });
                    
                    if (motivosSelecionados.length > 0) {
                        const acao = {
                            tipo: 'recuperacao',
                            funil_destino_id: parseInt(funilId),
                            etapa_destino_id: parseInt(etapaId),
                            motivo_recuperacao: motivoRecuperacao,
                            tempo_apos_perda: tempoPadrao,
                            unidade_tempo: unidadePadrao,
                            motivos_perda: motivosSelecionados,
                            motivos_config: motivosConfig,
                            enviar_email_recuperacao: false,
                            template_recuperacao_id: null
                        };
                        
                        console.log(`Ação de recuperação ${groupIndex + 1} criada:`, acao);
                        acoes.push(acao);
                    } else {
                        console.warn(`Nenhum motivo selecionado para recuperação ${groupIndex + 1}`);
                    }
                } else {
                    console.warn(`Funil ou etapa não selecionados para recuperação ${groupIndex + 1}`);
                }
            });
            // ===== FIM DA SEÇÃO CORRIGIDA =====
            
            if (acoes.length > 0) {
                const acoesInput = document.createElement('input');
                acoesInput.type = 'hidden';
                acoesInput.name = 'acoes_json';
                acoesInput.value = JSON.stringify(acoes);
                form.appendChild(acoesInput);
                console.log("Ações JSON:", JSON.stringify(acoes, null, 2));
            }
            
            const tipoTrigger = document.querySelector('input[name="tipo_trigger"]:checked').value;
            
            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;
                }
                
                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);
            }
            
            const notificacaoSistema = document.getElementById('notificacaoSistema').checked;
            if (notificacaoSistema) {
                const minutosAntesRadio = document.querySelector('input[name="notificar_minutos_antes"]:checked');
                if (minutosAntesRadio) {
                    const notificacaoInput = document.createElement('input');
                    notificacaoInput.type = 'hidden';
                    notificacaoInput.name = 'notificar_minutos_antes_json';
                    notificacaoInput.value = JSON.stringify(parseInt(minutosAntesRadio.value));
                    form.appendChild(notificacaoInput);
                }
            }
            
            const enviarNotificacao = document.getElementById('enviarNotificacaoAtividades').checked;
            if (enviarNotificacao) {
                const destinatariosSelecionados = [];
                document.querySelectorAll('input[name="notificar_destinatarios[]"]:checked').forEach(cb => {
                    destinatariosSelecionados.push(cb.value);
                });
                
                if (destinatariosSelecionados.length > 0) {
                    const notificacaoInput = document.createElement('input');
                    notificacaoInput.type = 'hidden';
                    notificacaoInput.name = 'notificar_destinatarios_json';
                    notificacaoInput.value = JSON.stringify(destinatariosSelecionados);
                    form.appendChild(notificacaoInput);
                }
            }
            
            console.log("Condições:", condicoes);
            console.log("Ações finais:", acoes);
            console.log("Dados preparados com sucesso!");
        }

        document.getElementById('formFluxo').addEventListener('change', atualizarPreview);
        document.getElementById('formFluxo').addEventListener('input', atualizarPreview);

        window.onclick = function(event) {
            const modal = document.getElementById('novoFluxoModal');
            if (event.target === modal) {
                modal.style.display = 'none';
            }
        }
    </script>
    <?php include 'sino_notificacoes.php'; ?>
</body>
</html>

<?php
function getTextoCondicao($condicao, $etapas_funil, $questionarios, $funis) {
    $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";
            
        case 'cliente_perdido':
            return "Cliente marcado como perdido";
            
        default:
            return "Condição desconhecida";
    }
}

function getTipoAcao($acao) {
    if (isset($acao['tipo'])) {
        switch ($acao['tipo']) {
            case 'email':
                return 'E-mail';
            case 'recuperacao':
                return 'Recuperação';
            case 'atividade':
                return 'Atividade';
            default:
                return 'Atividade';
        }
    }
    if (isset($acao['template_id'])) {
        return 'E-mail';
    } elseif (isset($acao['funil_destino_id'])) {
        return 'Recuperação';
    } else {
        return 'Atividade';
    }
}
?>