{{--
    O técnico propôs uma solução e o chamado está parado esperando esta resposta.

    Validar não encerra o chamado — devolve-o ao técnico, que finaliza. Negar
    exige um motivo, que vira acompanhamento público e volta para a equipe.
--}}
<form method="post" id="validacao-form-{{ $chamado->id }}" class="validacao-wrap"
    action="{{ route('user.chamado.validar', ['id' => $chamado->id]) }}">
    @csrf
    <input type="hidden" name="desfecho" id="validacao-desfecho-{{ $chamado->id }}" value="validar">

    <div class="validacao-box">
        <div class="validacao-titulo">
            <i class="bi bi-patch-question mr-1"></i> A equipe responsável solicita sua validação.
        </div>
        <p class="validacao-sub">
            Se precisar de algo mais, rejeite e explique o que falta.
        </p>

        <div class="validacao-motivo" id="validacao-motivo-{{ $chamado->id }}" hidden>
            <textarea name="justificativa" rows="2" class="validacao-textarea"
                placeholder="O que ainda não está resolvido?"></textarea>
        </div>

        <div class="validacao-acoes">
            <button type="submit" class="saas-btn validacao-negar" data-desfecho="negar"
                data-chamado="{{ $chamado->id }}">
                <i class="bi bi-patch-exclamation mr-1"></i> Rejeitar
            </button>
            <button type="submit" class="saas-btn validacao-validar" data-desfecho="validar"
                data-chamado="{{ $chamado->id }}">
                <i class="bi bi-patch-check mr-1"></i> Validar
            </button>
        </div>
    </div>
</form>

<script>
(function () {
    var id = '{{ $chamado->id }}';
    var form = document.getElementById('validacao-form-' + id);
    if (!form) return;

    var campoDesfecho = document.getElementById('validacao-desfecho-' + id);
    var motivo = document.getElementById('validacao-motivo-' + id);
    var textarea = motivo ? motivo.querySelector('textarea') : null;

    form.querySelectorAll('[data-desfecho]').forEach(function (btn) {
        btn.addEventListener('click', function (e) {
            var desfecho = btn.getAttribute('data-desfecho');
            campoDesfecho.value = desfecho;

            if (desfecho !== 'negar') return;

            // Primeiro clique em "Não resolveu" abre o motivo em vez de enviar:
            // a justificativa é obrigatória no servidor.
            if (motivo.hidden) {
                e.preventDefault();
                motivo.hidden = false;
                textarea.focus();
                return;
            }

            if (!textarea.value.trim()) {
                e.preventDefault();
                textarea.focus();
            }
        });
    });
})();
</script>