@section('title', __('Driver Document Request'))
<div>

    <x-baseview title="{{ __('Driver Document Request') }}">
        <div class="flex justify-end mt-4">
            <a href="{{ route('drivers.documents.review') }}"
                class="px-4 py-2 text-sm font-bold text-white rounded-md bg-primary-600 hover:bg-primary-700">
                {{ __('Abrir esteira de revisão') }}
            </a>
        </div>
        <livewire:tables.driver-document-request-table />
    </x-baseview>
    {{-- upload documents modal --}}
    <div x-data="{ open: @entangle('showEdit') }">
        <x-modal confirmText="{{ __('Upload') }}" action="uploadDocument">

            <p class="text-xl font-semibold">{{ __('Upload Documents') }}</p>
            <x-label title="{{ __('Documents') }}" />
            <x-input.filepond wire:model="documents" name="documents" multiple="true"
                acceptedFileTypes="['image/*','application/pdf','application/msword','application/vnd.openxmlformats-officedocument.wordprocessingml.document']"
                allowImagePreview="false" allowFileSizeValidation="true" maxFileSize="10mb" />

        </x-modal>
    </div>

    {{-- details --}}
    <div x-data="{ open: @entangle('showDetails'), zoom: null }">
        <x-modal :withForm="false">

            <p class="text-xl font-semibold">{{ __('Document Request') }}</p>
            <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
                <x-details.item title="{{ __('Driver') }}" text="{{ $selectedModel->model->name ?? '' }}" />
                <x-details.item title="{{ __('Status') }}">
                    <p class="text-sm font-medium">
                        {{ $selectedModel->model->is_active ?? 0 ? __('Active') : __('Inactive') }}
                    </p>
                </x-details.item>
            </div>

            @if ($selectedModel != null)
                @php
                    // documentos da solicitação + os enviados no cadastro (perfil do motorista)
                    $todosDocumentos = collect($selectedModel->documents ?? []);
                    if ($selectedModel->model) {
                        $todosDocumentos = $todosDocumentos->concat($selectedModel->model->getMedia('documents'));
                    }
                    $analises = $this->analyses;
                    $rotulos = ['cnh' => __('Driver licence'), 'crlv' => __('Vehicle document'), 'rg' => 'RG'];
                @endphp

                {{-- ===== documentos ===== --}}
                <div class="mt-3">
                    <div class="flex items-center justify-between">
                        <p class="font-semibold">{{ __('Documents sent') }} ({{ $todosDocumentos->count() }})</p>
                        <button type="button" wire:click="reanalyze" wire:loading.attr="disabled"
                            class="px-3 py-1 text-xs text-white rounded" style="background-color:#0f766e">
                            <span wire:loading.remove wire:target="reanalyze">{{ __('Run automatic analysis') }}</span>
                            <span wire:loading wire:target="reanalyze">{{ __('Analysing...') }}</span>
                        </button>
                    </div>

                    @forelse ($todosDocumentos as $document)
                        @php $a = $analises[$document->id] ?? null; @endphp
                        <div class="mt-3 border rounded-lg overflow-hidden">
                            {{-- faixa do veredito automático --}}
                            @if ($a)
                                @php
                                    $cor = ['approved' => ['#065f46', '#d1fae5'], 'rejected' => ['#991b1b', '#fee2e2'], 'review' => ['#92400e', '#fef3c7']][$a['status']] ?? ['#374151', '#f3f4f6'];
                                    $icone = ['approved' => '✅', 'rejected' => '⛔', 'review' => '⚠️'][$a['status']] ?? 'ℹ️';
                                    $texto = ['approved' => __('Automatic analysis approved'), 'rejected' => __('Automatic analysis rejected'), 'review' => __('Needs your review')][$a['status']] ?? $a['status'];
                                @endphp
                                <div style="background:{{ $cor[1] }};color:{{ $cor[0] }};padding:.5rem .75rem">
                                    <p class="text-sm font-bold">{{ $icone }} {{ $texto }}
                                        <span class="font-normal">· {{ $rotulos[$a['tipo']] ?? $a['tipo'] }}</span>
                                    </p>
                                    @if (!empty($a['motivos']))
                                        <ul style="list-style:disc;padding-left:1.1rem;font-size:.78rem;margin-top:.2rem">
                                            @foreach ($a['motivos'] as $m)<li>{{ $m }}</li>@endforeach
                                        </ul>
                                    @endif
                                    @if (!empty($a['dados']))
                                        <p style="font-size:.72rem;margin-top:.25rem;opacity:.85">
                                            @if (!empty($a['dados']['nome'])) {{ __('Name') }}: <b>{{ $a['dados']['nome'] }}</b> · @endif
                                            @if (!empty($a['dados']['cpf'])) CPF: <b>{{ $a['dados']['cpf'] }}</b> · @endif
                                            @if (!empty($a['dados']['categoria'])) {{ __('Category') }}: <b>{{ $a['dados']['categoria'] }}</b> · @endif
                                            @if (!empty($a['dados']['validade'])) {{ __('Valid until') }}: <b>{{ \Carbon\Carbon::parse($a['dados']['validade'])->format('d/m/Y') }}</b> @endif
                                            @if (!empty($a['dados']['placa'])) · {{ __('Plate') }}: <b>{{ $a['dados']['placa'] }}</b> @endif
                                        </p>
                                    @endif
                                </div>
                            @else
                                <div style="background:#f3f4f6;color:#374151;padding:.4rem .75rem">
                                    <p class="text-xs">{{ __('Not analysed yet — click "Run automatic analysis".') }}</p>
                                </div>
                            @endif

                            {{-- o documento em si, grande e legível --}}
                            @if (isMediaImage($document))
                                <img src="{{ route('secure.media', $document->id) }}" alt="{{ $document->file_name }}"
                                    class="w-full cursor-zoom-in"
                                    style="max-height:26rem;object-fit:contain;background:#111827"
                                    @click="zoom = '{{ route('secure.media', $document->id) }}'" />
                            @else
                                <a href="{{ route('secure.media', $document->id) }}" target="_blank"
                                    class="block p-4 text-center">
                                    <p class="text-sm"><span class="font-bold">{{ __('Name') }}</span>: {{ $document->file_name }}</p>
                                    <p class="text-sm"><span class="font-bold">{{ __('Size') }}</span>: {{ $document->human_readable_size }}</p>
                                    <p class="text-sm italic text-primary-500 hover:underline">{{ __('Click to download/preview') }}</p>
                                </a>
                            @endif

                            <div class="flex items-center justify-between px-3 py-2 text-xs text-gray-500 bg-gray-50">
                                <span>{{ $document->file_name }} · {{ $document->human_readable_size }}</span>
                                <a href="{{ route('secure.media', $document->id) }}" target="_blank"
                                    class="font-semibold text-primary-600 hover:underline">{{ __('Open in a new tab') }}</a>
                            </div>
                        </div>
                    @empty
                        <p class="p-4 text-sm font-semibold text-center">{{ __('No documents found') }}</p>
                    @endforelse
                </div>

                {{-- ===== nota ao motorista ===== --}}
                <div class="mt-4">
                    <x-label title="{{ __('Note to the driver (shown in the app)') }}" />
                    @if (!empty($selectedModel->note))
                        <p class="p-2 text-xs whitespace-pre-line rounded" style="background:#fffbeb;color:#92400e">{{ $selectedModel->note }}</p>
                    @endif
                    <textarea wire:model.defer="noteText" rows="2" class="w-full p-2 mt-1 text-sm border rounded"
                        placeholder="{{ __('Explain what needs to be fixed (e.g. CNH photo unreadable)') }}"></textarea>
                    <button type="button" wire:click="saveNote" class="px-3 py-1 mt-1 text-white rounded"
                        style="background-color:#1a4531">{{ __('Save note') }}</button>
                </div>
            @endif

            {{-- ampliação --}}
            <template x-if="zoom">
                <div @click="zoom = null"
                    style="position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:60;display:flex;align-items:center;justify-content:center;cursor:zoom-out">
                    <img :src="zoom" style="max-width:96vw;max-height:96vh;object-fit:contain" />
                </div>
            </template>
        </x-modal>
    </div>

</div>