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

date_default_timezone_set('America/Sao_Paulo');

if (!isset($_SESSION['csrf_token'])) {
    $_SESSION['csrf_token'] = bin2hex(random_bytes(32));
}

if (!isset($_SESSION['logado']) || $_SESSION['logado'] !== true) {
    header('Location: login.php');
    exit;
}

$tenant_id = $_SESSION['tenant_id'] ?? null;
if (!$tenant_id) {
    die("Tenant não identificado.");
}

if (!isset($conn) || $conn->connect_errno) {
    die("Erro: Conexão com banco de dados não estabelecida corretamente.");
}

// ----------------------------
// FUNÇÕES
// ----------------------------

function carregarClientes($conn, $tenant_id) {
    $sql = "SELECT id, Nome_Cliente FROM clientes WHERE deletado_em IS NULL AND tenant_id = ? ORDER BY Nome_Cliente";
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $res = $stmt->get_result();
    $clientes = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    return $clientes ?: [];
}

function carregarProdutos($conn, $tenant_id) {
    $sql = "SELECT DISTINCT nome_produto FROM cliente_produtos WHERE tenant_id = ? AND nome_produto IS NOT NULL ORDER BY nome_produto";
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $res = $stmt->get_result();
    $produtos = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    return $produtos ?: [];
}

function carregarStatusClientes() {
    return [
        0 => 'Inativo',
        1 => 'Contactar',
        2 => 'Contactados',
        3 => 'Negociação',
        4 => 'Agenda ERC',
        5 => 'Visitado',
        6 => 'Vendido'
    ];
}

function carregarMetasProdutos($conn, $tenant_id) {
    $sql = "SELECT produto, meta_valor, meta_quantidade FROM metas_produtos WHERE tenant_id = ?";
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    $stmt->bind_param("i", $tenant_id);
    $stmt->execute();
    $res = $stmt->get_result();
    $metas = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    
    $resultado = [];
    foreach ($metas as $meta) {
        $resultado[$meta['produto']] = [
            'valor' => (float)$meta['meta_valor'],
            'quantidade' => (int)$meta['meta_quantidade']
        ];
    }
    return $resultado;
}

function carregarDadosVendasStatus($conn, $tenant_id, $data_inicio = null, $data_fim = null) {
    $sql = "SELECT 
                c.status, 
                COUNT(DISTINCT cp.cliente_id) as total_clientes, 
                SUM(cp.valor * cp.quantidade) as valor_total
            FROM cliente_produtos cp
            JOIN clientes c ON cp.cliente_id = c.id
            WHERE cp.tenant_id = ?";
    
    $params = [$tenant_id];
    $tipos = "i";
    
    if ($data_inicio) {
        $sql .= " AND cp.data_cadastro >= ?";
        $params[] = $data_inicio;
        $tipos .= "s";
    }
    
    if ($data_fim) {
        $sql .= " AND cp.data_cadastro <= ?";
        $params[] = $data_fim;
        $tipos .= "s";
    }
    
    $sql .= " GROUP BY c.status";
    
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    
    $bindParams = [];
    $bindParams[] = &$tipos;
    foreach ($params as &$param) $bindParams[] = &$param;
    call_user_func_array([$stmt, 'bind_param'], $bindParams);
    
    $stmt->execute();
    $res = $stmt->get_result();
    $dados = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    
    $status_opcoes = carregarStatusClientes();
    $labels = [];
    $clientes = [];
    $valores = [];
    
    foreach ($dados as $item) {
        $status = isset($status_opcoes[$item['status']]) ? $status_opcoes[$item['status']] : 'Desconhecido';
        $labels[] = $status;
        $clientes[] = (int)$item['total_clientes'];
        $valores[] = (float)$item['valor_total'];
    }
    
    return [
        'labels' => $labels,
        'clientes' => $clientes,
        'valores' => $valores,
        'dados_completos' => $dados
    ];
}

function carregarDadosProdutosVendidos($conn, $tenant_id, $data_inicio = null, $data_fim = null) {
    $sql = "SELECT 
                nome_produto,
                SUM(quantidade) as total_quantidade,
                SUM(valor * quantidade) as valor_total
            FROM cliente_produtos
            WHERE tenant_id = ?
              AND nome_produto IS NOT NULL
              AND nome_produto != ''";
    
    $params = [$tenant_id];
    $tipos = "i";
    
    if ($data_inicio) {
        $sql .= " AND data_cadastro >= ?";
        $params[] = $data_inicio;
        $tipos .= "s";
    }
    
    if ($data_fim) {
        $sql .= " AND data_cadastro <= ?";
        $params[] = $data_fim;
        $tipos .= "s";
    }
    
    $sql .= " GROUP BY nome_produto ORDER BY valor_total DESC";
    
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    
    $bindParams = [];
    $bindParams[] = &$tipos;
    foreach ($params as &$param) $bindParams[] = &$param;
    call_user_func_array([$stmt, 'bind_param'], $bindParams);
    
    $stmt->execute();
    $res = $stmt->get_result();
    $dados = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    
    $metas = carregarMetasProdutos($conn, $tenant_id);
    
    $labels = [];
    $quantidades = [];
    $valores = [];
    $metas_quantidade = [];
    $metas_valor = [];
    
    foreach ($dados as $produto) {
        $labels[] = $produto['nome_produto'];
        $quantidades[] = (int)$produto['total_quantidade'];
        $valores[] = (float)$produto['valor_total'];
        
        if (isset($metas[$produto['nome_produto']])) {
            $metas_quantidade[] = $metas[$produto['nome_produto']]['quantidade'];
            $metas_valor[] = $metas[$produto['nome_produto']]['valor'];
        } else {
            $metas_quantidade[] = null;
            $metas_valor[] = null;
        }
    }
    
    return [
        'labels' => $labels,
        'quantidades' => $quantidades,
        'valores' => $valores,
        'metas_quantidade' => $metas_quantidade,
        'metas_valor' => $metas_valor,
        'total_quantidade' => array_sum($quantidades),
        'total_valor' => array_sum($valores),
        'dados_completos' => $dados
    ];
}

function carregarDadosAtividades($conn, $tenant_id, $data_inicio = null, $data_fim = null) {
    $sql = "SELECT 
                u.id AS usuario_id, 
                u.nome AS usuario_nome,
                SUM(CASE WHEN a.concluida = 'sim' THEN 1 ELSE 0 END) AS concluidas,
                SUM(CASE WHEN a.concluida = 'nao' AND a.data_agendada < CURDATE() THEN 1 ELSE 0 END) AS atrasadas,
                SUM(CASE WHEN a.concluida = 'nao' AND a.data_agendada >= CURDATE() THEN 1 ELSE 0 END) AS futuras,
                COUNT(*) AS total
            FROM atividades a
            JOIN usuarios u ON a.usuario_id = u.id
            WHERE u.ativo = 'sim'
              AND u.tenant_id = ?";
    
    $params = [$tenant_id];
    $tipos = "i";
    
    if ($data_inicio) {
        $sql .= " AND a.data_agendada >= ?";
        $params[] = $data_inicio;
        $tipos .= "s";
    }
    
    if ($data_fim) {
        $sql .= " AND a.data_agendada <= ?";
        $params[] = $data_fim;
        $tipos .= "s";
    }
    
    $sql .= " GROUP BY u.id, u.nome ORDER BY u.nome";
    
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    
    $bindParams = [];
    $bindParams[] = &$tipos;
    foreach ($params as &$param) $bindParams[] = &$param;
    call_user_func_array([$stmt, 'bind_param'], $bindParams);
    
    $stmt->execute();
    $res = $stmt->get_result();
    $dados = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    
    $labels = [];
    $concluidas = [];
    $atrasadas = [];
    $futuras = [];
    $totais = [];
    
    foreach ($dados as $linha) {
        $labels[] = $linha['usuario_nome'];
        $concluidas[] = (int)$linha['concluidas'];
        $atrasadas[] = (int)$linha['atrasadas'];
        $futuras[] = (int)$linha['futuras'];
        $totais[] = (int)$linha['total'];
    }
    
    return [
        'labels' => $labels,
        'concluidas' => $concluidas,
        'atrasadas' => $atrasadas,
        'futuras' => $futuras,
        'totais' => $totais,
        'total_geral' => array_sum($totais),
        'dados_completos' => $dados
    ];
}

function carregarDadosEvolucaoVendas($conn, $tenant_id, $data_inicio = null, $data_fim = null) {
    $sql = "SELECT 
                DATE(cp.data_cadastro) as data, 
                SUM(cp.valor * cp.quantidade) as valor_total,
                COUNT(DISTINCT cp.cliente_id) as clientes_unicos
            FROM cliente_produtos cp
            WHERE cp.tenant_id = ?";
    
    $params = [$tenant_id];
    $tipos = "i";
    
    if ($data_inicio) {
        $sql .= " AND cp.data_cadastro >= ?";
        $params[] = $data_inicio;
        $tipos .= "s";
    }
    
    if ($data_fim) {
        $sql .= " AND cp.data_cadastro <= ?";
        $params[] = $data_fim;
        $tipos .= "s";
    }
    
    $sql .= " GROUP BY DATE(cp.data_cadastro) ORDER BY DATE(cp.data_cadastro)";
    
    $stmt = $conn->prepare($sql);
    if (!$stmt) die("Erro: " . $conn->error);
    
    $bindParams = [];
    $bindParams[] = &$tipos;
    foreach ($params as &$param) $bindParams[] = &$param;
    call_user_func_array([$stmt, 'bind_param'], $bindParams);
    
    $stmt->execute();
    $res = $stmt->get_result();
    $dados = $res->fetch_all(MYSQLI_ASSOC);
    $stmt->close();
    
    $labels = [];
    $valores = [];
    $clientes = [];
    
    foreach ($dados as $item) {
        $labels[] = $item['data'];
        $valores[] = (float)$item['valor_total'];
        $clientes[] = (int)$item['clientes_unicos'];
    }
    
    return [
        'labels' => $labels,
        'valores' => $valores,
        'clientes' => $clientes,
        'total_valor' => array_sum($valores),
        'total_clientes' => array_sum($clientes),
        'dados_completos' => $dados
    ];
}

// ----------------------------
// PROCESSAMENTO DOS FILTROS
// ----------------------------

$filtros = [
    'data_inicio' => $_GET['data_inicio'] ?? '',
    'data_fim' => $_GET['data_fim'] ?? '',
    'cliente_id' => $_GET['cliente_id'] ?? 0,
    'produto' => $_GET['produto'] ?? '',
    'status' => $_GET['status'] ?? -1,
    'tipo_grafico' => $_GET['tipo_grafico'] ?? 'vendas_status',
    'tipo_visualizacao' => $_GET['tipo_visualizacao'] ?? 'bar',
    'mostrar_metas' => isset($_GET['mostrar_metas']) ? true : false
];

// Carregar dados para filtros
$clientes = carregarClientes($conn, $tenant_id);
$produtos = carregarProdutos($conn, $tenant_id);
$status_opcoes = carregarStatusClientes();

// Carregar dados para os gráficos
$dados_vendas_status = carregarDadosVendasStatus($conn, $tenant_id, $filtros['data_inicio'], $filtros['data_fim']);
$dados_produtos_vendidos = carregarDadosProdutosVendidos($conn, $tenant_id, $filtros['data_inicio'], $filtros['data_fim']);
$dados_atividades = carregarDadosAtividades($conn, $tenant_id, $filtros['data_inicio'], $filtros['data_fim']);
$dados_evolucao_vendas = carregarDadosEvolucaoVendas($conn, $tenant_id, $filtros['data_inicio'], $filtros['data_fim']);

// Determinar qual gráfico mostrar
$dados_grafico = [];
$titulo_grafico = 'Análise de Dados';
$chart_type = $filtros['tipo_visualizacao'];

switch ($filtros['tipo_grafico']) {
    case 'vendas_status':
        $titulo_grafico = 'Vendas por Status do Cliente';
        $dados_grafico = $dados_vendas_status['dados_completos'];
        $chart_labels = $dados_vendas_status['labels'];
        $chart_datasets = [
            'Clientes' => $dados_vendas_status['clientes'],
            'Valor Total' => $dados_vendas_status['valores']
        ];
        break;
        
    case 'produtos_vendidos':
        $titulo_grafico = 'Produtos Mais Vendidos';
        $dados_grafico = $dados_produtos_vendidos['dados_completos'];
        $chart_labels = $dados_produtos_vendidos['labels'];
        $chart_datasets = [
            'Quantidade' => $dados_produtos_vendidos['quantidades'],
            'Valor Total' => $dados_produtos_vendidos['valores']
        ];
        
        if ($filtros['mostrar_metas']) {
            $chart_datasets['Meta Quantidade'] = $dados_produtos_vendidos['metas_quantidade'];
            $chart_datasets['Meta Valor'] = $dados_produtos_vendidos['metas_valor'];
        }
        break;
        
    case 'atividades_conclusao':
        $titulo_grafico = 'Atividades por Taxa de Conclusão';
        $dados_grafico = $dados_atividades['dados_completos'];
        $chart_labels = $dados_atividades['labels'];
        $chart_datasets = [
            'Total' => $dados_atividades['totais'],
            'Concluídas' => $dados_atividades['concluidas'],
            'Atrasadas' => $dados_atividades['atrasadas'],
            'Futuras' => $dados_atividades['futuras']
        ];
        break;
        
    case 'evolucao_vendas':
        $titulo_grafico = 'Evolução de Vendas ao Longo do Tempo';
        $dados_grafico = $dados_evolucao_vendas['dados_completos'];
        $chart_labels = $dados_evolucao_vendas['labels'];
        $chart_datasets = [
            'Valor Total' => $dados_evolucao_vendas['valores'],
            'Clientes Únicos' => $dados_evolucao_vendas['clientes']
        ];
        break;
}

// Processar requisições AJAX
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
    $response = ['success' => false];
    
    if (isset($_POST['chart_type'])) {
        switch ($_POST['chart_type']) {
            case 'vendas_status':
                $dados = carregarDadosVendasStatus($conn, $tenant_id, $_POST['data_inicio'], $_POST['data_fim']);
                $response = [
                    'success' => true,
                    'labels' => $dados['labels'],
                    'data' => $dados['clientes'],
                    'valores' => $dados['valores'],
                    'total' => array_sum($dados['clientes'])
                ];
                break;
                
            case 'produtos_vendidos':
                $dados = carregarDadosProdutosVendidos($conn, $tenant_id, $_POST['data_inicio'], $_POST['data_fim']);
                $response = [
                    'success' => true,
                    'labels' => $dados['labels'],
                    'quantidades' => $dados['quantidades'],
                    'valores' => $dados['valores'],
                    'metas_quantidade' => $dados['metas_quantidade'],
                    'metas_valor' => $dados['metas_valor'],
                    'total_quantidade' => $dados['total_quantidade'],
                    'total_valor' => $dados['total_valor']
                ];
                break;
                
            case 'atividades_conclusao':
                $dados = carregarDadosAtividades($conn, $tenant_id, $_POST['data_inicio'], $_POST['data_fim']);
                $response = [
                    'success' => true,
                    'labels' => $dados['labels'],
                    'concluidas' => $dados['concluidas'],
                    'atrasadas' => $dados['atrasadas'],
                    'futuras' => $dados['futuras'],
                    'totais' => $dados['totais'],
                    'total' => $dados['total_geral']
                ];
                break;
                
            case 'evolucao_vendas':
                $dados = carregarDadosEvolucaoVendas($conn, $tenant_id, $_POST['data_inicio'], $_POST['data_fim']);
                $response = [
                    'success' => true,
                    'labels' => $dados['labels'],
                    'valores' => $dados['valores'],
                    'clientes' => $dados['clientes'],
                    'total_valor' => $dados['total_valor'],
                    'total_clientes' => $dados['total_clientes']
                ];
                break;
        }
    }
    
    header('Content-Type: application/json');
    echo json_encode($response);
    exit;
}

?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Análise de Dados - SON</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-annotation@2.0.1"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-gradient-colors@1.0.0"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }
        
        body {
            background-color: #f5f5f5;
            margin: 0;
            padding: 0;
        }
        
        .header-fixed {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            background-color: #f5f5f5;
            padding: 15px 20px;
            z-index: 1000;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .header-fixed img {
            height: 50px;
            margin-right: 15px;
        }
        
        .header-fixed h2 {
            margin: 0;
            flex-grow: 1;
            text-align: center;
        }
        
        /* Menu Hamburger */
        .menu-container {
            position: relative;
            display: inline-block;
        }
        
        .hamburger-btn {
            background: none;
            border: none;
            font-size: 24px;
            cursor: pointer;
            padding: 10px;
            color: #333;
        }
        
        .dropdown-menu {
            display: none;
            position: absolute;
            right: 0;
            background-color: white;
            min-width: 200px;
            box-shadow: 0 8px 16px rgba(0,0,0,0.2);
            z-index: 1;
            border-radius: 4px;
            overflow: hidden;
        }
        
        .dropdown-menu a {
            color: #333;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
            text-align: left;
            transition: background-color 0.3s;
        }
        
        .dropdown-menu a:hover {
            background-color: #f1f1f1;
        }
        
        .dropdown-menu.show {
            display: block;
        }
        
        /* Submenus */
        .submenu {
            display: none;
            padding-left: 20px;
            margin-top: 10px;
            background-color: #f9f9f9;
        }
        
        .submenu a {
            display: block;
            padding: 8px 16px;
            text-decoration: none;
            color: #333;
            font-size: 0.9em;
        }
        
        .submenu a:hover {
            background-color: #f1f1f1;
        }
        
        .menu-item {
            position: relative;
        }
        
        .menu-item > a {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .menu-item > a:after {
            content: "▶";
            font-size: 0.8em;
            transition: transform 0.3s;
        }
        
        .menu-item.open > a:after {
            transform: rotate(90deg);
        }
        
        /* Botões do menu */
        .menu-btn-primary {
            color: #333;
            background: none;
            text-align: left;
            width: 100%;
            border: none;
            cursor: pointer;
        }
        
        .menu-btn-success {
            color: #2ecc71;
            background: none;
            text-align: left;
            width: 100%;
            border: none;
            cursor: pointer;
        }
        
        .menu-btn-danger {
            color: #e74c3c;
            background: none;
            text-align: left;
            width: 100%;
            border: none;
            cursor: pointer;
        }
        
        .sidebar {
            position: fixed;
            top: 70px;
            left: 0;
            bottom: 0;
            width: 250px;
            background-color: #fff;
            box-shadow: 2px 0 5px rgba(0,0,0,0.1);
            padding: 20px;
            overflow-y: auto;
        }
        
        .sidebar h2 {
            font-size: 18px;
            margin-bottom: 20px;
            color: #333;
            border-bottom: 1px solid #eee;
            padding-bottom: 10px;
        }
        
        .sidebar label {
            display: block;
            margin-bottom: 15px;
            font-size: 14px;
            color: #555;
        }
        
        .sidebar select, 
        .sidebar input[type="date"],
        .sidebar input[type="checkbox"] {
            width: 100%;
            padding: 8px;
            margin-top: 5px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 14px;
        }
        
        .sidebar button {
            width: 100%;
            padding: 10px;
            margin-top: 10px;
            background-color: #3498db;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
        }
        
        .sidebar button:hover {
            background-color: #2980b9;
        }
        
        .main-content {
            margin-left: 250px;
            margin-top: 70px;
            padding: 20px;
            position: relative;
            min-height: calc(100vh - 70px);
        }
        
        .chart-container {
            background: #fff;
            box-shadow: 0 0 5px rgba(0,0,0,0.1);
            border: 1px solid #ccc;
            margin-bottom: 20px;
            padding: 15px;
            border-radius: 5px;
        }
        
        .chart-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
            padding-bottom: 10px;
            border-bottom: 1px solid #eee;
        }
        
        .chart-title {
            font-size: 18px;
            font-weight: bold;
        }
        
        .chart-actions {
            display: flex;
            gap: 10px;
        }
        
        .chart-actions button {
            padding: 5px 10px;
            font-size: 12px;
            border-radius: 3px;
            border: none;
            cursor: pointer;
        }
        
        .chart-actions .export-btn {
            background: #27ae60;
            color: white;
        }
        
        .chart-actions .export-btn:hover {
            background: #219955;
        }
        
        .chart-actions .toggle-btn {
            background: #3498db;
            color: white;
        }
        
        .chart-actions .toggle-btn:hover {
            background: #2980b9;
        }
        
        .chart-wrapper {
            position: relative;
            height: 500px;
            width: 100%;
        }
        
        .data-table {
            width: 100%;
            margin-top: 20px;
            border-collapse: collapse;
        }
        
        .data-table th, .data-table td {
            padding: 8px 12px;
            border: 1px solid #ddd;
            text-align: left;
        }
        
        .data-table th {
            background-color: #f2f2f2;
        }
        
        .data-table tr:nth-child(even) {
            background-color: #f9f9f9;
        }
        
        .data-table tr:hover {
            background-color: #f1f1f1;
        }
        
        .valor-total {
            font-weight: bold;
            color: #27ae60;
        }
        
        .status-concluida { color: #2ecc71; }
        .status-atrasada { color: #e74c3c; }
        .status-futura { color: #3498db; }
        
        .alert {
            padding: 10px;
            margin-bottom: 15px;
            border-radius: 4px;
        }
        
        .alert-success {
            background-color: #d4edda;
            color: #155724;
            border: 1px solid #c3e6cb;
        }
        
        .alert-danger {
            background-color: #f8d7da;
            color: #721c24;
            border: 1px solid #f5c6cb;
        }
        
        .meta-line {
            border-color: #e74c3c;
            border-width: 2px;
            border-dash: [5, 5];
        }
        
        .chart-filters {
            background-color: #f8f9fa;
            padding: 15px;
            margin-bottom: 15px;
            border-radius: 5px;
        }
    </style>
</head>
<body>
<div class="header-fixed" style="display:flex; align-items:center; padding:10px; background:#fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1);">
    <img src="tvitec.png" alt="Logo TVITEC" style="height:40px;">

    <div style="flex-grow: 1; text-align: center;">
        <h2 style="margin: 0;">Análise de Dados - SON</h2>
    </div>
    <button onclick="openWhatsappModal()" style="margin-left: 15px; background: #25D366; color: white; border: none; padding: 6px 12px; border-radius: 4px; cursor: pointer; display: flex; align-items: center; gap: 5px;">
        <img src="https://upload.wikimedia.org/wikipedia/commons/6/6b/WhatsApp.svg" alt="WhatsApp" style="height: 20px;">
        WhatsApp
    </button>
    <div class="user-info" style="display:flex; align-items:center; gap:10px;">
        <?php if (!empty($_SESSION['foto_perfil'])): ?>
            <img src="<?php echo htmlspecialchars($_SESSION['foto_perfil']); ?>" class="user-photo" alt="Foto do usuário" style="width:40px; height:40px; border-radius:50%;">
        <?php else: ?>
            <div class="user-initial" style="width:40px; height:40px; border-radius:50%; background:#ccc; display:flex; align-items:center; justify-content:center; font-weight:bold; font-size:1.2em;">
                <?php echo strtoupper(substr($_SESSION['nome_usuario'] ?? 'U', 0, 1)); ?>
            </div>
        <?php endif; ?>
        <div style="text-align:left;">
            <div style="font-weight: bold; color: #333; font-size: 1.1em;">
                <?php echo htmlspecialchars($_SESSION['nome_usuario'] ?? 'Usuário'); ?>
            </div>
            <div style="font-size: 0.9em; color: #555;">
                <?php echo htmlspecialchars($_SESSION['email_usuario'] ?? ''); ?>
            </div>
        </div>
    </div>
    <!-- Menu Hamburger -->
    <div class="menu-container">
        <button class="hamburger-btn" onclick="toggleMenu()">☰</button>
        <div class="dropdown-menu" id="dropdownMenu">
            <a href="index.php" class="menu-btn-primary">← Início</a>
            <?php if ($_SESSION['permissao'] === 'usuario' || $_SESSION['permissao'] === 'vendedor' || $_SESSION['permissao'] === 'admin'): ?>
                <div class="menu-item">
                    <a href="javascript:void(0);" class="menu-btn-primary" onclick="toggleSubmenu('clientesSubmenu')">👥 Clientes</a>
                    <div id="clientesSubmenu" class="submenu">
                        <a href="cadastrar_cliente.php" class="menu-btn-success">➕ Novo Cliente</a>
                        <a href="lista_clientes.php" class="menu-btn-primary">📋 Listar Clientes</a>
                    </div>
                </div>
            <?php endif; ?>
            <div class="menu-item">
                <a href="javascript:void(0);" class="menu-btn-primary" onclick="toggleSubmenu('produtosSubmenu')">📦 Produtos</a>
                <div id="produtosSubmenu" class="submenu">
                    <a href="lista_produtos.php" class="menu-btn-primary">📋 Lista de Produtos</a>
                    <a href="cadastrar_produto.php" class="menu-btn-primary">➕ Novo Produto</a>
                </div>
            </div>
            <div class="menu-item">
                <a href="javascript:void(0);" class="menu-btn-primary" onclick="toggleSubmenu('atividadesSubmenu')">📝 Atividades</a>
                <div id="atividadesSubmenu" class="submenu">
                    <a href="lista_atividades.php" class="menu-btn-primary">📋 Listar Atividades</a>
                    <a href="cadastrar_atividade.php" class="menu-btn-primary">✍️ Cadastrar Tipo de Atividade</a>
                    <a href="consulta_atividades.php" class="menu-btn-primary">🔍 Consulta atividades</a>
                </div>
            </div>
            <div class="menu-item">
                <a href="javascript:void(0);" class="menu-btn-primary" onclick="toggleSubmenu('emailSubmenu')">📧 E-mail & Configurações</a>
                <div id="emailSubmenu" class="submenu">
                    <a href="email_app.php" class="menu-btn-primary">⚙️ Configurar E-mail</a>
                    <a href="email.php" class="menu-btn-primary">📨 Enviar E-mail</a>
                </div>
            </div>
            <?php if ($_SESSION['permissao'] === 'admin'): ?>
                <div class="menu-item">
                    <a href="javascript:void(0);" class="menu-btn-primary" onclick="toggleSubmenu('adminSubmenu')">👤 Administração</a>
                    <div id="adminSubmenu" class="submenu">
                        <a href="cadastrar_usuario.php" class="menu-btn-primary">➕ Cadastrar Usuário</a>
                        <a href="gerenciar_usuarios.php" class="menu-btn-primary">👥 Gerenciar Usuários</a>
                    </div>
                </div>
            <?php endif; ?>
            <a href="calendario.php" class="menu-btn-primary">📅 Calendário</a>
            <a href="dashboard_clientes.php" class="menu-btn-primary">📊 Dashboard</a>
            <a href="funis.php" class="menu-btn-primary">🔽 Gerenciar Funis</a>
            <a href="chat.php" class="menu-btn-success">💬 Chat</a>
            <a href="#" onclick="abrirModalAlterarSenha()" class="menu-btn-primary">🔒 Alterar Senha</a>
            <!-- Botão Alterar Foto dentro do menu -->
            <form method="POST" enctype="multipart/form-data" style="margin: 10px 0; padding: 0 10px;">
                <label for="fotoPerfilInput" style="cursor: pointer; color: #007bff; font-size: 1em; user-select:none; display: inline-flex; align-items: center; gap: 5px;">
                    <i class="fas fa-camera" aria-hidden="true"></i> 📷  Alterar Foto
                </label>
                <input type="file" id="fotoPerfilInput" name="foto_perfil" accept="image/*" style="display: none;" onchange="this.form.submit()">
            </form>
            <a href="logout.php" class="menu-btn-danger">🚪 Sair</a>
            <h6 class="version-info">Tvitecnologia SON v1.0</h6>
        </div>
    </div>
</div>

    <!-- Sidebar com filtros -->
    <div class="sidebar">
        <h2>Filtros</h2>
        <form method="GET" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>">
            <label>Tipo de Gráfico:
                <select name="tipo_grafico" class="form-select">
                    <option value="vendas_status" <?= $filtros['tipo_grafico'] == 'vendas_status' ? 'selected' : '' ?>>Vendas por Status</option>
                    <option value="produtos_vendidos" <?= $filtros['tipo_grafico'] == 'produtos_vendidos' ? 'selected' : '' ?>>Produtos Mais Vendidos</option>
                    <option value="atividades_conclusao" <?= $filtros['tipo_grafico'] == 'atividades_conclusao' ? 'selected' : '' ?>>Atividades por Conclusão</option>
                    <option value="evolucao_vendas" <?= $filtros['tipo_grafico'] == 'evolucao_vendas' ? 'selected' : '' ?>>Evolução de Vendas</option>
                </select>
            </label>
            
            <label>Tipo de Visualização:
                <select name="tipo_visualizacao" class="form-select">
                    <option value="bar" <?= $filtros['tipo_visualizacao'] == 'bar' ? 'selected' : '' ?>>Barras</option>
                    <option value="line" <?= $filtros['tipo_visualizacao'] == 'line' ? 'selected' : '' ?>>Linhas</option>
                    <option value="pie" <?= $filtros['tipo_visualizacao'] == 'pie' ? 'selected' : '' ?>>Pizza</option>
                    <option value="doughnut" <?= $filtros['tipo_visualizacao'] == 'doughnut' ? 'selected' : '' ?>>Rosquinha</option>
                    <option value="radar" <?= $filtros['tipo_visualizacao'] == 'radar' ? 'selected' : '' ?>>Radar</option>
                    <option value="polarArea" <?= $filtros['tipo_visualizacao'] == 'polarArea' ? 'selected' : '' ?>>Área Polar</option>
                </select>
            </label>
            
            <label>Data Início:
                <input type="date" name="data_inicio" class="form-control" value="<?= htmlspecialchars($filtros['data_inicio']) ?>">
            </label>
            
            <label>Data Fim:
                <input type="date" name="data_fim" class="form-control" value="<?= htmlspecialchars($filtros['data_fim']) ?>">
            </label>
            
            <label>Cliente:
                <select name="cliente_id" class="form-select">
                    <option value="0">Todos</option>
                    <?php foreach ($clientes as $cliente): ?>
                        <option value="<?= $cliente['id'] ?>" <?= $filtros['cliente_id'] == $cliente['id'] ? 'selected' : '' ?>>
                            <?= htmlspecialchars($cliente['Nome_Cliente']) ?>
                        </option>
                    <?php endforeach; ?>
                </select>
            </label>
            
            <label>Produto:
                <select name="produto" class="form-select">
                    <option value="">Todos</option>
                    <?php foreach ($produtos as $produto): ?>
                        <option value="<?= $produto['nome_produto'] ?>" <?= $filtros['produto'] == $produto['nome_produto'] ? 'selected' : '' ?>>
                            <?= htmlspecialchars($produto['nome_produto']) ?>
                        </option>
                    <?php endforeach; ?>
                </select>
            </label>
            
            <label>Status do Cliente:
                <select name="status" class="form-select">
                    <option value="-1">Todos</option>
                    <?php foreach ($status_opcoes as $value => $label): ?>
                        <option value="<?= $value ?>" <?= $filtros['status'] == $value ? 'selected' : '' ?>>
                            <?= htmlspecialchars($label) ?>
                        </option>
                    <?php endforeach; ?>
                </select>
            </label>
            
            <?php if ($filtros['tipo_grafico'] == 'produtos_vendidos'): ?>
            <label>
                <input type="checkbox" name="mostrar_metas" <?= $filtros['mostrar_metas'] ? 'checked' : '' ?>> Mostrar Metas
            </label>
            <?php endif; ?>
            
            <button type="submit" class="btn btn-primary">Aplicar Filtros</button>
            <button type="reset" class="btn btn-secondary">Limpar Filtros</button>
        </form>
    </div>

    <!-- Conteúdo Principal -->
    <div class="main-content">
        <div class="chart-container">
            <div class="chart-header">
                <div class="chart-title"><?= $titulo_grafico ?></div>
                <div class="chart-actions">
                    <button class="export-btn" onclick="exportarCSV()">
                        <i class="fas fa-file-excel"></i> CSV
                    </button>
                    <button class="export-btn" onclick="imprimirGrafico()">
                        <i class="fas fa-print"></i> Imprimir
                    </button>
                    <button class="toggle-btn" onclick="toggleTabela()">
                        <i class="fas fa-table"></i> Tabela
                    </button>
                    <button class="toggle-btn" onclick="toggleFiltros()">
                        <i class="fas fa-filter"></i> Filtros
                    </button>
                </div>
            </div>
            
            <div class="chart-filters" id="chartFilters" style="display: none;">
                <div class="row">
                    <div class="col-md-6">
                        <label>Tipo de Visualização:
                            <select id="tipoVisualizacao" class="form-select">
                                <option value="bar" <?= $filtros['tipo_visualizacao'] == 'bar' ? 'selected' : '' ?>>Barras</option>
                                <option value="line" <?= $filtros['tipo_visualizacao'] == 'line' ? 'selected' : '' ?>>Linhas</option>
                                <option value="pie" <?= $filtros['tipo_visualizacao'] == 'pie' ? 'selected' : '' ?>>Pizza</option>
                                <option value="doughnut" <?= $filtros['tipo_visualizacao'] == 'doughnut' ? 'selected' : '' ?>>Rosquinha</option>
                                <option value="radar" <?= $filtros['tipo_visualizacao'] == 'radar' ? 'selected' : '' ?>>Radar</option>
                                <option value="polarArea" <?= $filtros['tipo_visualizacao'] == 'polarArea' ? 'selected' : '' ?>>Área Polar</option>
                            </select>
                        </label>
                    </div>
                    <div class="col-md-6">
                        <?php if ($filtros['tipo_grafico'] == 'produtos_vendidos'): ?>
                        <label>
                            <input type="checkbox" id="mostrarMetas" <?= $filtros['mostrar_metas'] ? 'checked' : '' ?>> Mostrar Metas
                        </label>
                        <?php endif; ?>
                    </div>
                </div>
                <button class="btn btn-sm btn-primary" onclick="aplicarFiltrosGrafico()">Aplicar</button>
            </div>
            
            <div class="chart-wrapper">
                <canvas id="graficoPrincipal"></canvas>
            </div>
            
            <div id="tabelaDados" style="display: none;">
                <table class="data-table">
                    <thead>
                        <tr>
                            <?php if (!empty($dados_grafico)): ?>
                                <?php foreach (array_keys($dados_grafico[0]) as $coluna): ?>
                                    <th><?= ucfirst(str_replace('_', ' ', $coluna)) ?></th>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($dados_grafico as $linha): ?>
                            <tr>
                                <?php foreach ($linha as $valor): ?>
                                    <td><?= is_numeric($valor) ? number_format($valor, 2, ',', '.') : htmlspecialchars($valor) ?></td>
                                <?php endforeach; ?>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    <script>
        // Dados para o gráfico
        const chartLabels = <?= json_encode($chart_labels) ?>;
        const chartDatasets = <?= json_encode($chart_datasets) ?>;
        const chartType = '<?= $chart_type ?>';
        const mostrarMetas = <?= $filtros['mostrar_metas'] ? 'true' : 'false' ?>;
        
        // Cores para os datasets
        const backgroundColors = [
            'rgba(54, 162, 235, 0.7)',
            'rgba(255, 99, 132, 0.7)',
            'rgba(75, 192, 192, 0.7)',
            'rgba(255, 159, 64, 0.7)',
            'rgba(153, 102, 255, 0.7)',
            'rgba(255, 205, 86, 0.7)'
        ];
        
        const borderColors = [
            'rgba(54, 162, 235, 1)',
            'rgba(255, 99, 132, 1)',
            'rgba(75, 192, 192, 1)',
            'rgba(255, 159, 64, 1)',
            'rgba(153, 102, 255, 1)',
            'rgba(255, 205, 86, 1)'
        ];
        
        // Preparar datasets para o Chart.js
        function prepararDatasets(datasets, tipoGrafico, mostrarMetas = false) {
            const result = [];
            let i = 0;
            
            for (const [label, data] of Object.entries(datasets)) {
                // Pular metas se não estiverem habilitadas
                if (label.includes('Meta') && !mostrarMetas) continue;
                
                const isMeta = label.includes('Meta');
                
                result.push({
                    label: label,
                    data: data,
                    backgroundColor: isMeta ? 'transparent' : 
                        tipoGrafico === 'pie' || tipoGrafico === 'doughnut' || tipoGrafico === 'polarArea' ? 
                        backgroundColors.slice(0, data.length) : 
                        backgroundColors[i % backgroundColors.length],
                    borderColor: isMeta ? '#e74c3c' : borderColors[i % borderColors.length],
                    borderWidth: isMeta ? 2 : 1,
                    borderDash: isMeta ? [5, 5] : [],
                    type: isMeta ? 'line' : tipoGrafico,
                    fill: false,
                    pointBackgroundColor: isMeta ? '#e74c3c' : borderColors[i % borderColors.length],
                    pointRadius: isMeta ? 3 : 0,
                    pointHoverRadius: isMeta ? 5 : 0
                });
                
                if (!isMeta) i++;
            }
            
            return result;
        }
        
        // Criar gráfico
        let myChart;
        const ctx = document.getElementById('graficoPrincipal').getContext('2d');
        
        function criarGrafico(tipo, datasets, mostrarMetas = false) {
            if (myChart) {
                myChart.destroy();
            }
            
            const options = {
                responsive: true,
                maintainAspectRatio: false,
                plugins: {
                    legend: {
                        position: 'top',
                    },
                    title: {
                        display: true,
                        text: '<?= $titulo_grafico ?>'
                    },
                    tooltip: {
                        callbacks: {
                            label: function(context) {
                                let label = context.dataset.label || '';
                                if (label) {
                                    label += ': ';
                                }
                                if (context.dataset.label.includes('Valor') || context.dataset.label.includes('valor')) {
                                    label += new Intl.NumberFormat('pt-BR', {style: 'currency', currency: 'BRL'}).format(context.raw);
                                } else if (context.dataset.label.includes('Taxa')) {
                                    label += context.raw.toFixed(2) + '%';
                                } else {
                                    label += context.raw;
                                }
                                return label;
                            }
                        }
                    },
                    annotation: {
                        annotations: {}
                    },
                    datalabels: {
                        display: tipo === 'pie' || tipo === 'doughnut' || tipo === 'polarArea',
                        formatter: (value, ctx) => {
                            let sum = 0;
                            const dataArr = ctx.chart.data.datasets[0].data;
                            dataArr.map(data => {
                                sum += data;
                            });
                            const percentage = (value * 100 / sum).toFixed(2) + "%";
                            return percentage;
                        },
                        color: '#fff',
                    }
                },
                scales: {
                    y: {
                        beginAtZero: true,
                        ticks: {
                            callback: function(value) {
                                if (value >= 1000) {
                                    return 'R$ ' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
                                }
                                return value;
                            }
                        }
                    },
                    x: {
                        ticks: {
                            autoSkip: false,
                            maxRotation: 45,
                            minRotation: 45
                        }
                    }
                }
            };
            
            // Adicionar gradient para gráficos de barra/linha
            if (tipo === 'bar' || tipo === 'line') {
                const gradient = ctx.createLinearGradient(0, 0, 0, 400);
                gradient.addColorStop(0, 'rgba(54, 162, 235, 0.7)');
                gradient.addColorStop(1, 'rgba(54, 162, 235, 0.1)');
                
                datasets.forEach(dataset => {
                    if (!dataset.label.includes('Meta')) {
                        dataset.backgroundColor = gradient;
                    }
                });
            }
            
            myChart = new Chart(ctx, {
                type: tipo,
                data: {
                    labels: chartLabels,
                    datasets: prepararDatasets(datasets, tipo, mostrarMetas)
                },
                plugins: [ChartDataLabels],
                options: options
            });
        }
        
        // Inicializar gráfico
        document.addEventListener('DOMContentLoaded', function() {
            criarGrafico(chartType, chartDatasets, mostrarMetas);
            
            // Inicializar datepickers
            flatpickr("input[type=date]", {
                dateFormat: "Y-m-d",
                allowInput: true
            });
        });
        
        // Funções de exportação
        function exportarCSV() {
            let csv = '<?= $titulo_grafico ?>\n\n';
            
            // Cabeçalho
            const headers = [];
            document.querySelectorAll('thead th').forEach(th => {
                headers.push(th.textContent);
            });
            csv += headers.join(';') + '\n';
            
            // Dados
            document.querySelectorAll('tbody tr').forEach(tr => {
                const row = [];
                tr.querySelectorAll('td').forEach(td => {
                    row.push(td.textContent);
                });
                csv += row.join(';') + '\n';
            });
            
            // Criar link de download
            const blob = new Blob([csv], {type: 'text/csv;charset=utf-8;'});
            const link = document.createElement('a');
            const url = URL.createObjectURL(blob);
            link.setAttribute('href', url);
            link.setAttribute('download', 'analise_<?= $filtros['tipo_grafico'] ?>_<?= date('Ymd') ?>.csv');
            link.style.visibility = 'hidden';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }
        
        function imprimirGrafico() {
            const canvas = document.getElementById('graficoPrincipal');
            const win = window.open('', 'Print Chart');
            win.document.write('<html><head><title><?= $titulo_grafico ?></title>');
            win.document.write('<style>body{text-align:center;}</style>');
            win.document.write('</head><body>');
            win.document.write('<h1><?= $titulo_grafico ?></h1>');
            win.document.write('<img src="' + canvas.toDataURL() + '"/>');
            win.document.write('</body></html>');
            win.document.close();
            win.focus();
            setTimeout(() => { win.print(); win.close(); }, 500);
        }
        
        function toggleTabela() {
            const tabela = document.getElementById('tabelaDados');
            const chartWrapper = document.querySelector('.chart-wrapper');
            
            if (tabela.style.display === 'none') {
                tabela.style.display = 'block';
                chartWrapper.style.height = '300px';
            } else {
                tabela.style.display = 'none';
                chartWrapper.style.height = '500px';
            }
            
            if (myChart) {
                myChart.resize();
            }
        }
        
        function toggleFiltros() {
            const filtros = document.getElementById('chartFilters');
            filtros.style.display = filtros.style.display === 'none' ? 'block' : 'none';
        }
        
        function aplicarFiltrosGrafico() {
            const tipoVisualizacao = document.getElementById('tipoVisualizacao').value;
            const mostrarMetas = document.getElementById('mostrarMetas') ? document.getElementById('mostrarMetas').checked : false;
            
            criarGrafico(tipoVisualizacao, chartDatasets, mostrarMetas);
            toggleFiltros();
        }
        
        // Toggle dropdown menu do hamburger
        function toggleMenu() {
            const menu = document.getElementById('dropdownMenu');
            menu.style.display = (menu.style.display === 'block') ? 'none' : 'block';
        }
        
        // Toggle submenus
        function toggleSubmenu(id) {
            const submenu = document.getElementById(id);
            const menuItem = submenu.parentElement;
            
            if (submenu.style.display === 'block') {
                submenu.style.display = 'none';
                menuItem.classList.remove('open');
            } else {
                submenu.style.display = 'block';
                menuItem.classList.add('open');
            }
        }
    </script>
</body>
</html>