@extends('admin.layout')
@section('title', 'Detail Mitra')
@section('subtitle', $mitra->user?->name)

@php
    $mitraMeta = [
        'pending'  => ['Pending', 'amber'],
        'verified' => ['Terverifikasi', 'green'],
        'rejected' => ['Ditolak', 'red'],
    ];
    [$stLbl, $stTone] = $mitraMeta[$mitra->verification_status->value ?? $mitra->verification_status] ?? ['—','gray'];
    $isPending = ($mitra->verification_status->value ?? $mitra->verification_status) === 'pending';
@endphp

@section('content')
    <div class="flex items-center justify-between gap-3 flex-wrap">
        <a href="{{ route('admin.mitra') }}" class="text-sm text-sub hover:text-brand font-semibold">‹ Kembali ke daftar mitra</a>
        <a href="{{ route('admin.mitra.edit', $mitra) }}"
           class="px-3.5 py-2 rounded-xl border border-line bg-white text-sm font-semibold text-sub hover:text-brand transition">
            Edit data
        </a>
    </div>

    <div class="mt-4"><x-flash /></div>

    <div class="grid lg:grid-cols-3 gap-4 mt-4">
        <div class="lg:col-span-1 space-y-4">
            <div class="bg-white rounded-2xl border border-line p-5">
                <div class="flex items-center gap-3">
                    <span class="w-14 h-14 rounded-2xl bg-accent-soft text-accent grid place-items-center text-lg font-extrabold">{{ $mitra->user?->initials() }}</span>
                    <div>
                        <div class="font-extrabold text-lg leading-tight">{{ $mitra->user?->name }}</div>
                        <div class="text-sm text-sub">{{ $mitra->user?->phone }}</div>
                    </div>
                </div>
                <div class="mt-4 flex items-center gap-2">
                    <x-badge :color="$stTone">{{ $stLbl }}</x-badge>
                    <x-badge :color="$mitra->is_online ? 'green' : 'gray'">{{ $mitra->is_online ? 'Online' : 'Offline' }}</x-badge>
                </div>
                <dl class="mt-4 space-y-2.5 text-sm">
                    <div class="flex justify-between"><dt class="text-sub">Bergabung</dt><dd class="font-semibold">{{ $mitra->joined_at?->format('d M Y') ?? '—' }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-sub">Lokasi</dt><dd class="font-semibold text-right">{{ $mitra->lat }}, {{ $mitra->lng }}</dd></div>
                </dl>
            </div>
        </div>

        <div class="lg:col-span-2 space-y-4">
            {{-- Verifikasi. Ditaruh paling atas selagi statusnya pending: itu
                 satu-satunya hal yang perlu dikerjakan admin di halaman ini.
                 Setelah diputuskan, kartunya tetap ada supaya keputusan bisa
                 diubah (mis. salah tolak).

                 KTP sudah tidak dipakai — penilaiannya kini dari dokumen &
                 sertifikasi yang ada di bawah. --}}
            <div class="bg-white rounded-2xl border {{ $isPending ? 'border-amber-300' : 'border-line' }} p-5">
                <div class="flex items-center justify-between gap-3 flex-wrap">
                    <h3 class="font-bold text-sm">Verifikasi</h3>
                    <x-badge :color="$stTone">{{ $stLbl }}</x-badge>
                </div>

                {{-- Dokumen pendukung ikut ditampilkan di sini: keputusan
                     verifikasi diambil di halaman ini, jadi berkasnya harus
                     terbaca tanpa pindah ke form ubah. --}}
                <div class="mt-4 pt-4 border-t border-line">
                    <h4 class="font-bold text-sm">Dokumen &amp; sertifikasi</h4>
                    @if ($mitra->documents->count())
                        <ul class="mt-2 space-y-1.5">
                            @foreach ($mitra->documents as $doc)
                                <li class="flex flex-wrap items-baseline gap-2 text-sm">
                                    <a href="{{ route('admin.mitra.document', [$mitra, $doc]) }}" target="_blank" rel="noopener"
                                       class="font-semibold text-brand hover:text-brand-dark break-all">{{ $doc->name }}</a>
                                    <span class="text-xs text-sub">
                                        {{ $doc->mime ?? '—' }}
                                        @if ($doc->size)
                                            · {{ $doc->size >= 1048576
                                                ? number_format($doc->size / 1048576, 1).' MB'
                                                : max(1, (int) round($doc->size / 1024)).' KB' }}
                                        @endif
                                    </span>
                                </li>
                            @endforeach
                        </ul>
                    @else
                        <p class="mt-2 text-sm text-sub">Belum ada dokumen.</p>
                    @endif
                </div>

                <div class="mt-4 flex flex-wrap items-center gap-2">
                    @if ($mitra->verification_status !== \App\Enums\MitraVerificationStatus::Verified)
                        <form method="POST" action="{{ route('admin.mitra.verification', $mitra) }}">
                            @csrf
                            <input type="hidden" name="status" value="verified">
                            <button class="px-4 py-2 rounded-xl bg-emerald-600 text-white text-sm font-semibold hover:bg-emerald-700 transition">
                                Verifikasi
                            </button>
                        </form>
                    @endif

                    @if ($mitra->verification_status !== \App\Enums\MitraVerificationStatus::Rejected)
                        <form method="POST" action="{{ route('admin.mitra.verification', $mitra) }}"
                              onsubmit="return confirm('Tolak pendaftaran mitra ini?')">
                            @csrf
                            <input type="hidden" name="status" value="rejected">
                            <button class="px-4 py-2 rounded-xl border border-red-300 text-red-600 text-sm font-semibold hover:bg-red-50 transition">
                                Tolak
                            </button>
                        </form>
                    @endif

                    @if (! $isPending)
                        <form method="POST" action="{{ route('admin.mitra.verification', $mitra) }}">
                            @csrf
                            <input type="hidden" name="status" value="pending">
                            <button class="px-4 py-2 rounded-xl border border-line text-sub text-sm font-semibold hover:text-brand transition">
                                Kembalikan ke Pending
                            </button>
                        </form>
                    @endif
                </div>
            </div>

            <div class="bg-white rounded-2xl border border-line p-5">
                <h3 class="font-bold text-sm">Bio & area</h3>
                <p class="mt-2 text-sm text-ink/80">{{ $mitra->bio ?? '—' }}</p>
                @if ($mitra->area_note)<p class="mt-2 text-sm text-sub"><b>Area:</b> {{ $mitra->area_note }}</p>@endif
                @if ($mitra->address)<p class="mt-1 text-sm text-sub"><b>Alamat:</b> {{ $mitra->address }}</p>@endif
            </div>

            @if ($mitra->workPhotos->count())
                <div class="bg-white rounded-2xl border border-line p-5">
                    <h3 class="font-bold text-sm">Foto pekerjaan ({{ $mitra->workPhotos->count() }})</h3>
                    <div class="mt-3 grid grid-cols-2 sm:grid-cols-3 gap-2">
                        @foreach ($mitra->workPhotos as $wp)
                            <div class="aspect-square rounded-xl bg-canvas border border-line overflow-hidden grid place-items-center text-xs text-sub p-2 text-center">
                                @if ($wp->url())
                                    <img src="{{ $wp->url() }}" alt="{{ $wp->label ?? 'Foto pekerjaan' }}" class="w-full h-full object-cover">
                                @else
                                    {{ $wp->label ?? 'Foto' }}
                                @endif
                            </div>
                        @endforeach
                    </div>
                </div>
            @endif

            <div class="bg-white rounded-2xl border border-line p-5">
                <h3 class="font-bold text-sm">Ulasan terbaru</h3>
                <div class="mt-3 space-y-3">
                    @forelse ($reviews as $rev)
                        <div class="border border-line rounded-xl p-3.5">
                            <div class="flex items-center justify-between">
                                <span class="font-semibold text-sm">{{ $rev->customer?->name ?? 'Anonim' }}</span>
                                <span class="text-amber-500 text-sm">{{ str_repeat('★', $rev->rating) }}<span class="text-line">{{ str_repeat('★', 5 - $rev->rating) }}</span></span>
                            </div>
                            @if ($rev->body)<p class="mt-1.5 text-sm text-ink/80">{{ $rev->body }}</p>@endif
                            <div class="mt-1 text-xs text-sub">{{ $rev->created_at?->format('d M Y') }} · Order {{ $rev->order?->code }}</div>
                        </div>
                    @empty
                        <p class="text-sm text-sub">Belum ada ulasan.</p>
                    @endforelse
                </div>
            </div>
        </div>
    </div>
@endsection