<div class="card shadow-sm border-0 rounded-4">
    <div class="card-body p-4">

        <h4 class="fw-bold text-primary mb-4 border-bottom pb-2">
            <i class="fa-solid fa-handshake me-2"></i>
            Cadastro de Parceria Público-Privada
        </h4>

        {{-- ================= INFORMAÇÕES GERAIS ================= --}}
        <h5 class="fw-bold text-secondary mb-3 mt-4">
            Informações Gerais
        </h5>

        <div class="row">
            <div class="col-md-12 mb-4">
                <div class="d-flex justify-content-between align-items-center">
                    <label class="form-label fw-semibold">Projeto *</label>
                    <div class="form-check form-switch">
                        <input type="hidden" name="show_projeto" value="0">
                        <input class="form-check-input" type="checkbox"
                               name="show_projeto" value="1"
                               {{ old('show_projeto', $ppp->show_projeto ?? 1) ? 'checked' : '' }}>
                    </div>
                </div>
                <input type="text" class="form-control"
                       name="projeto"
                       value="{{ old('projeto', $ppp->projeto ?? '') }}" required>
            </div>
        </div>

        <div class="row">
            <div class="col-md-6 mb-4">
                <div class="d-flex justify-content-between align-items-center">
                    <label class="form-label fw-semibold">Empresa</label>
                    <div class="form-check form-switch">
                        <input type="hidden" name="show_empresa" value="0">
                        <input class="form-check-input" type="checkbox"
                               name="show_empresa" value="1"
                               {{ old('show_empresa', $ppp->show_empresa ?? 1) ? 'checked' : '' }}>
                    </div>
                </div>
                <input type="text" class="form-control"
                       name="empresa"
                       value="{{ old('empresa', $ppp->empresa ?? '') }}">
            </div>

            <div class="col-md-6 mb-4">
                <div class="d-flex justify-content-between align-items-center">
                    <label class="form-label fw-semibold">Secretaria Responsável</label>
                    <div class="form-check form-switch">
                        <input type="hidden" name="show_secretaria_responsavel" value="0">
                        <input class="form-check-input" type="checkbox"
                               name="show_secretaria_responsavel" value="1"
                               {{ old('show_secretaria_responsavel', $ppp->show_secretaria_responsavel ?? 1) ? 'checked' : '' }}>
                    </div>
                </div>
                <input type="text" class="form-control"
                       name="secretaria_responsavel"
                       value="{{ old('secretaria_responsavel', $ppp->secretaria_responsavel ?? '') }}">
            </div>
        </div>

        <hr class="my-4">

        {{-- ================= CRITÉRIOS, PRAZOS E STATUS ================= --}}
        <h5 class="fw-bold text-secondary mb-3">
            Critérios, Prazos e Status
        </h5>

        <div class="row">
            @php
                $campos = [
                    'criterio_julgamento' => 'Critério de Julgamento',
                    'prazo_concessao' => 'Prazo de Concessão',
                    'proxima_etapa' => 'Próxima Etapa',
                    'prazo_implantacao' => 'Prazo de Implantação'
                ];
            @endphp

            @foreach($campos as $name => $label)
                <div class="col-md-4 mb-4">
                    <div class="d-flex justify-content-between align-items-center">
                        <label class="form-label fw-semibold">{{ $label }}</label>
                        <div class="form-check form-switch">
                            <input type="hidden" name="show_{{ $name }}" value="0">
                            <input class="form-check-input" type="checkbox"
                                   name="show_{{ $name }}" value="1"
                                   {{ old("show_$name", $ppp->{"show_$name"} ?? 1) ? 'checked' : '' }}>
                        </div>
                    </div>

                    <input type="text"
                           name="{{ $name }}"
                           class="form-control"
                           value="{{ old($name, $ppp->$name ?? '') }}">
                </div>
            @endforeach

            <!-- CAMPO: ANDAMENTO (COM ESCOLHAS E PORCENTAGEM OCULTA) -->
            <div class="col-md-4 mb-4">
                <div class="d-flex justify-content-between align-items-center">
                    <label class="form-label fw-semibold">Andamento</label>
                    <div class="form-check form-switch">
                        <input type="hidden" name="show_andamento" value="0">
                        <input class="form-check-input" type="checkbox"
                            name="show_andamento" value="1"
                            {{ old('show_andamento', $ppp->show_andamento ?? 1) ? 'checked' : '' }}>
                    </div>
                </div>

                <select name="andamento" class="form-select">
                    <option value="">Selecione o andamento...</option>

                    @php
                        $opcoesAndamento = [
                            'Autorização do CGP' => 'Autorização do CGP',
                            'Estudo' => 'Estudo',
                            'Consulta Pública' => 'Consulta Pública',
                            'Edital' => 'Edital',
                            'Envio ao TCE' => 'Envio ao TCE',
                            'Sessão Pública' => 'Sessão Pública',
                            'Contrato' => 'Contrato'
                        ];

                        $andamentoAtual = old('andamento', $ppp->andamento ?? '');
                    @endphp

                    @foreach($opcoesAndamento as $valor => $texto)
                        <option value="{{ $valor }}" {{ $andamentoAtual === $valor ? 'selected' : '' }}>
                            {{ $texto }}
                        </option>
                    @endforeach
                </select>
            </div>
        </div>

        <hr class="my-4">

        {{-- ================= DADOS FINANCEIROS ================= --}}
        <h5 class="fw-bold text-secondary mb-3">
            Dados Financeiros
        </h5>

        @php
            $financeiros = [
                'valor_estimado_contrato' => 'Valor Estimado do Contrato',
                'investimento_total' => 'Investimento Total',
                'outorga_fixa' => 'Outorga Fixa',
                'outorga_variavel' => 'Outorga Variável',
                'aporte_municipio' => 'Aporte do Município',
                'contraprestacao_mensal' => 'Contraprestação Mensal',
                'payback' => 'Payback',
                'tir' => 'TIR',
                'capex' => 'CAPEX',
                'opex' => 'OPEX'
            ];
        @endphp

        <div class="row">
            @foreach($financeiros as $name => $label)
                <div class="col-md-4 mb-4">
                    <div class="d-flex justify-content-between align-items-center">
                        <label class="form-label fw-semibold">{{ $label }}</label>
                        <div class="form-check form-switch">
                            <input type="hidden" name="show_{{ $name }}" value="0">
                            <input class="form-check-input" type="checkbox"
                                   name="show_{{ $name }}" value="1"
                                   {{ old("show_$name", $ppp->{"show_$name"} ?? 1) ? 'checked' : '' }}>
                        </div>
                    </div>

                    <input type="text"
                           name="{{ $name }}"
                           class="form-control"
                           value="{{ old($name, $ppp->$name ?? '') }}">
                </div>
            @endforeach
        </div>

        <hr class="my-4">

        {{-- ================= HISTÓRICO DE TRAMITAÇÃO ================= --}}

<h5 class="fw-bold text-secondary mb-3 mt-4">
    <i class="fa-solid fa-clock-rotate-left me-2"></i>
    Histórico de Tramitação / Observações
</h5>

<div class="row">

    {{-- ================= ADICIONAR NOVOS HISTÓRICOS (CREATE E EDIT) ================= --}}
    <div class="col-md-12 mb-4">
        <div class="card bg-light border-0 shadow-sm">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-center mb-3">
                    <h6 class="fw-bold text-dark m-0">Adicionar Novos Históricos</h6>
                    <button type="button" class="btn btn-sm btn-primary" onclick="addNovoHistorico()">
                        <i class="fa-solid fa-plus me-1"></i> Adicionar Tramitação
                    </button>
                </div>

                <div id="novosHistoricosContainer"></div>

                <small class="text-muted mt-2 d-block">
                    <i class="fa-solid fa-info-circle"></i>
                    Os novos registros serão salvos junto com a PPP.
                </small>
            </div>
        </div>
    </div>

    {{-- ================= LINHA DO TEMPO (SOMENTE SE FOR EDIT E EXISTIREM REGISTROS) ================= --}}
    @if(isset($ppp) && isset($ppp->id) && $ppp->historicos && $ppp->historicos->count() > 0)
        <div class="col-md-12">
            <h6 class="fw-bold text-dark mb-3">Linha do Tempo</h6>

            <div class="timeline" style="border-left: 2px solid #0d6efd; padding-left: 20px; margin-left: 10px;">
                @foreach($ppp->historicos as $historico)
                    <div class="timeline-item mb-4 p-3 bg-white border rounded shadow-sm position-relative"
                         style="margin-left: 10px;">

                        <span class="position-absolute"
                              style="left: -40px; top: 18px; background: #fff; border: 2px solid #0d6efd; border-radius: 50%; width: 16px; height: 16px;">
                        </span>

                        <div class="d-flex justify-content-between align-items-center border-bottom pb-2 mb-3">
                            <small class="text-muted">
                                <i class="fa-regular fa-calendar-days me-1"></i>
                                Registrado em {{ $historico->created_at->format('d/m/Y \à\s H:i') }}
                            </small>

                            <div class="form-check text-danger m-0">
                                <button type="button"
                                        class="btn btn-sm btn-outline-danger"
                                        onclick="excluirHistorico({{ $historico->id }}, this)">
                                    <i class="fa-solid fa-trash"></i>
                                </button>
                            </div>
                        </div>

                        <div class="row align-items-end">
                            <div class="col-md-2 mb-2">
                                <label class="form-label fw-semibold small text-secondary">
                                    Data do Ocorrido
                                </label>

                                <input type="date"
                                    class="form-control form-control-sm"
                                    name="historicos_edit[{{ $historico->id }}][data]"
                                    value="{{ $historico->data ? \Carbon\Carbon::parse($historico->data)->format('Y-m-d') : $historico->created_at->format('Y-m-d') }}">
                            </div>

                            <!-- <div class="col-md-2 mb-2">
                                <label class="form-label fw-semibold small text-secondary">
                                    Data do Fim
                                </label>

                                <input type="date"
                                    class="form-control form-control-sm"
                                    name="historicos_edit[{{ $historico->id }}][data_fim]"
                                    value="{{ $historico->data_fim ? \Carbon\Carbon::parse($historico->data_fim)->format('Y-m-d') : '' }}">
                            </div> -->
                            <div class="col-md-2 mb-2">
                                @if($historico->data_fim)

                                    <label class="form-label fw-semibold small text-secondary">
                                        Data do Fim
                                    </label>

                                    <input type="date"
                                        class="form-control form-control-sm"
                                        name="historicos_edit[{{ $historico->id }}][data_fim]"
                                        value="{{ \Carbon\Carbon::parse($historico->data_fim)->format('Y-m-d') }}">

                                @else

                                    <div class="form-check mt-4">
                                        <input class="form-check-input"
                                            type="checkbox"
                                            id="check_data_fim_{{ $historico->id }}"
                                            onclick="mostrarDataFim({{ $historico->id }})">

                                        <label class="form-check-label small">
                                            Possui data final
                                        </label>
                                    </div>

                                    <div class="mt-2 d-none" id="campo_data_fim_{{ $historico->id }}">
                                        <input type="date"
                                            class="form-control form-control-sm"
                                            name="historicos_edit[{{ $historico->id }}][data_fim]">
                                    </div>

                                @endif

                            </div>

                            <div class="col-md-3 mb-2">
                                <label class="form-label fw-semibold small text-secondary">
                                    Órgão / Secretaria / Organização
                                </label>

                                <input type="text"
                                    class="form-control form-control-sm"
                                    name="historicos_edit[{{ $historico->id }}][orgao]"
                                    value="{{ $historico->orgao }}">
                            </div>

                            <div class="col-md-5 mb-2">
                                <label class="form-label fw-semibold small text-secondary">
                                    Observação / Andamento / Tempo
                                </label>

                                <textarea class="form-control form-control-sm"
                                        name="historicos_edit[{{ $historico->id }}][observacao]"
                                        rows="1">{{ $historico->observacao }}</textarea>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    @endif

</div>

<script>
    let historicoCount = 0;

    function addNovoHistorico() {
    const container = document.getElementById('novosHistoricosContainer');
    const index = historicoCount++;

    const html = `
        <div class="row align-items-start mb-3 bg-white p-3 rounded border position-relative"
             id="novo_hist_${index}">

            <button type="button"
                    class="btn btn-danger btn-sm position-absolute"
                    style="top: -10px; right: -10px; border-radius: 50%; width: 25px; height: 25px; padding: 0; line-height: 1;"
                    onclick="removerHistorico('novo_hist_${index}')">
                <i class="fa-solid fa-xmark"></i>
            </button>

            <div class="col-md-3 mb-2">
                <label class="form-label fw-semibold small text-secondary">
                    Data do Ocorrido
                </label>

                <input type="date"
                       class="form-control form-control-sm mb-1"
                       name="novo_historico[${index}][data]"
                       value="{{ now()->format('Y-m-d') }}"
                       required>

                <div class="form-check">
                    <input class="form-check-input"
                           type="checkbox"
                           id="check_fim_${index}"
                           onclick="toggleDataFim(${index})">

                    <label class="form-check-label small">
                        Possui data final
                    </label>
                </div>
            </div>

            <div class="col-md-3 mb-2 d-none" id="data_fim_${index}">
                <label class="form-label fw-semibold small text-secondary">
                    Data do Fim
                </label>

                <input type="date"
                       class="form-control form-control-sm"
                       name="novo_historico[${index}][data_fim]">
            </div>

            <div class="col-md-3 mb-2">
                <label class="form-label fw-semibold small text-secondary">
                    Órgão / Secretaria
                </label>

                <input type="text"
                       class="form-control form-control-sm"
                       name="novo_historico[${index}][orgao]"
                       placeholder="Ex: TCE-RJ"
                       required>
            </div>

            <div class="col-md-3">
                <label class="form-label fw-semibold small text-secondary">
                    Observação / Tempo
                </label>

                <textarea class="form-control form-control-sm"
                          name="novo_historico[${index}][observacao]"
                          rows="1"
                          placeholder="Detalhes..."></textarea>
            </div>

        </div>
    `;

    container.insertAdjacentHTML('beforeend', html);
}

function toggleDataFim(index) {

    const checkbox = document.getElementById('check_fim_' + index);
    const campo = document.getElementById('data_fim_' + index);

    if (checkbox.checked) {
        campo.classList.remove('d-none');
    } else {
        campo.classList.add('d-none');
    }

}

function mostrarDataFim(id) {

    const campo = document.getElementById('campo_data_fim_' + id);

    if (campo.classList.contains('d-none')) {
        campo.classList.remove('d-none');
    } else {
        campo.classList.add('d-none');
    }

}
</script>

<script>
    function removerHistorico(id) {

    if (confirm('Deseja realmente remover esta tramitação?')) {
        document.getElementById(id).remove();
    }

    }
</script>

<script>
    function excluirHistorico(id, btn) {

    if (!confirm('Deseja realmente excluir este histórico?')) {
        return;
    }

    fetch(`/admin/ppps/historico/${id}`, {
        method: 'DELETE',
        headers: {
            'X-CSRF-TOKEN': '{{ csrf_token() }}',
            'Content-Type': 'application/json'
        }
    })
    .then(response => response.json())
    .then(data => {

        if(data.success){

            btn.closest('.timeline-item').remove();

        } else {

            alert('Erro ao excluir.');

        }

    });

}
</script>

<hr class="my-4">

        {{-- ================= INFORMAÇÕES COMPLEMENTARES ================= --}}
        <h5 class="fw-bold text-secondary mb-3">
            Informações Complementares
        </h5>

        @php
            $textareas = [
                'obrigacao' => 'Obrigações',
                'observacoes' => 'Observações'
            ];
        @endphp

        @foreach($textareas as $name => $label)
            <div class="mb-4">
                <div class="d-flex justify-content-between align-items-center">
                    <label class="form-label fw-semibold">{{ $label }}</label>
                    <div class="form-check form-switch">
                        <input type="hidden" name="show_{{ $name }}" value="0">
                        <input class="form-check-input" type="checkbox"
                               name="show_{{ $name }}" value="1"
                               {{ old("show_$name", $ppp->{"show_$name"} ?? 1) ? 'checked' : '' }}>
                    </div>
                </div>

                <textarea class="form-control"
                          name="{{ $name }}" rows="3">{{ old($name, $ppp->$name ?? '') }}</textarea>
            </div>
        @endforeach

        <div class="d-flex justify-content-end mt-4">
            <button type="submit" class="btn btn-primary px-4 py-2 rounded-3 shadow-sm">
                <i class="fa-solid fa-save me-2"></i>
                Salvar
            </button>
        </div>

    </div>
</div>