@props([
    'documentableType' => 'processo',
    'showLabel' => true,
    'columns' => 4,
])

@php
    // Variáveis por tipo de documento
    $variaveisProcesso = [
        'processo.numero_processo' => 'Número do Processo',
        'processo.exercicio' => 'Exercício',
        'processo.modalidade' => 'Modalidade',
        'processo.numero_modalidade' => 'Número da Modalidade',
        'processo.sequencial' => 'Sequencial',
        'processo.objeto' => 'Objeto do Processo',
        'processo.descricao' => 'Descrição da Necessidade',
        'processo.abertura' => 'Data de Abertura',
        'processo.status' => 'Status do Processo',
    ];

    $variaveisAta = [
        'ata.numero_ata' => 'Número da ATA',
        'ata.data' => 'Data da ATA',
        'ata.objeto' => 'Objeto da ATA',
        'ata.lote' => 'Lote',
        'ata.vigencia' => 'Vigência',
        'ata.exercicio' => 'Exercício',
    ];

    $variaveisContrato = [
        'contrato.numero_contrato' => 'Número do Contrato',
        'contrato.data' => 'Data do Contrato',
        'contrato.objeto' => 'Objeto do Contrato',
        'contrato.contratado' => 'Contratado',
        'contrato.cnpj' => 'CNPJ',
        'contrato.exercicio' => 'Exercício',
        'contrato.tipo_valor' => 'Tipo de Valor',
        'contrato.valor_mensal' => 'Valor Mensal',
        'contrato.meses' => 'Meses',
        'contrato.valor_global' => 'Valor Global',
        'contrato.valor_total' => 'Valor Total',
    ];

    $variaveisEmpresa = [
        'empresa.nome' => 'Nome da Empresa',
        'empresa.cnpj' => 'CNPJ da Empresa',
        'empresa.endereco' => 'Endereço',
        'empresa.representante' => 'Representante',
        'empresa.cpf_representante' => 'CPF do Representante',
        'empresa.valor_mensal' => 'Valor Mensal',
        'empresa.meses' => 'Meses',
        'empresa.valor_global' => 'Valor Global',
    ];

    $variaveisUnidade = [
        'unidade.nome' => 'Nome da Unidade',
        'unidade.responsavel' => 'Responsável',
        'unidade.cargo' => 'Cargo',
    ];

    $variaveisData = [
        'data.hoje' => 'Data Atual (d/m/Y)',
        'data.completa' => 'Data e Hora Atual',
        'data.dia' => 'Dia',
        'data.mes' => 'Mês (número)',
        'data.mes_extenso' => 'Mês (extenso)',
        'data.ano' => 'Ano',
        'data.hora' => 'Hora',
        'data.dia_semana' => 'Dia da Semana',
        'data.extenso' => 'Data por Extenso',
    ];

    $variaveisUsuario = [
        'usuario.nome' => 'Nome do Usuário',
        'usuario.email' => 'Email do Usuário',
    ];

    $variaveisTabelaProcesso = [
        'tabela.itens' => 'Tabela de Itens',
        'tabela.itens_com_valores' => 'Tabela de Itens com Valores',
    ];

    $variaveisTabelaAta = [
        'tabela.itens' => 'Tabela de Itens da ATA',
        'tabela.itens_com_valores' => 'Tabela de Itens com Valores',
        'tabela.itens_por_lote' => 'Tabela de Itens por Lote',
    ];

    $variaveisTabelaContrato = [
        'tabela.itens' => 'Tabela de Itens do Processo',
        'tabela.itens_com_valores' => 'Tabela de Itens com Valores',
        'tabela.valor_contrato' => 'Tabela de Valor do Contrato',
    ];

    // Determinar variáveis a exibir baseado no tipo de documento
    $variavelsPorTipo = [];
    if ($documentableType === 'ata') {
        $variavelsPorTipo = [
            'ATA' => $variaveisAta,
            'Processo' => $variaveisProcesso,
            'Empresa' => $variaveisEmpresa,
            'Unidade' => $variaveisUnidade,
            'Data' => $variaveisData,
            'Usuário' => $variaveisUsuario,
            'Tabelas' => $variaveisTabelaAta,
        ];
    } elseif ($documentableType === 'contrato') {
        $variavelsPorTipo = [
            'Contrato' => $variaveisContrato,
            'ATA' => $variaveisAta,
            'Processo' => $variaveisProcesso,
            'Empresa' => $variaveisEmpresa,
            'Unidade' => $variaveisUnidade,
            'Data' => $variaveisData,
            'Usuário' => $variaveisUsuario,
            'Tabelas' => $variaveisTabelaContrato,
        ];
    } else {
        // Default: Processo
        $variavelsPorTipo = [
            'Processo' => $variaveisProcesso,
            'Empresa' => $variaveisEmpresa,
            'Unidade' => $variaveisUnidade,
            'Data' => $variaveisData,
            'Usuário' => $variaveisUsuario,
            'Tabelas' => $variaveisTabelaProcesso,
        ];
    }
@endphp

<div class="variable-buttons mt-4 p-4 bg-slate-50 rounded-lg border border-slate-200">
    @if ($showLabel)
        <h3 class="text-sm font-semibold text-gray-800 mb-3">Variáveis Disponíveis</h3>
        <p class="text-xs text-slate-600 mb-3">Clique em uma variável para inseri-la no texto</p>
    @endif

    @foreach ($variavelsPorTipo as $secao => $variaveis)
        <div class="mb-4">
            <h4 class="text-xs font-bold text-gray-700 mb-2 uppercase">{{ $secao }}</h4>
            <div class="grid grid-cols-2 md:grid-cols-{{ $columns }} gap-2">
                @foreach ($variaveis as $varName => $label)
                    @php
                        $variableText = '{{' . $varName . '}}';
                    @endphp
                    <button 
                        type="button" 
                        class="insert-variable text-xs px-3 py-2 bg-white border border-slate-300 rounded hover:bg-blue-50 hover:border-blue-400 transition-colors text-left font-mono text-slate-700" 
                        data-variable="{{ $variableText }}"
                        title="{{ $label }}">
                        <span class="block text-slate-600 font-bold">{{ $varName }}</span>
                        <span class="text-slate-500 text-xs">{{ $label }}</span>
                    </button>
                @endforeach
            </div>
        </div>
    @endforeach
</div>

<!-- Seção de Ajuda sobre Geração por IA -->
<div class="mt-4 p-4 bg-blue-50 rounded-lg border border-blue-200">
    <h3 class="text-sm font-semibold text-blue-900 mb-2">🤖 Geração por IA</h3>
    <p class="text-xs text-blue-800 mb-2">
        Use tags <code class="bg-blue-100 px-2 py-1 rounded text-xs font-mono">@{{ 'gerarcomia' }}...@{{ '/gerarcomia' }}</code> para gerar conteúdo automaticamente com IA:
    </p>
    <div class="bg-white p-2 rounded border border-blue-200 text-xs font-mono text-slate-700">
        @{{ 'gerarcomia' }}Gere um resumo executivo dessa licitação@{{ '/gerarcomia' }}
    </div>
    <p class="text-xs text-blue-700 mt-2 italic">
        A IA utilizará contexto do processo/ata/contrato para gerar um texto relevante no local da tag.
    </p>
</div>