@extends('layouts.app')

@section('content')
<div class="max-w-4xl mx-auto">
    <h2 class="text-2xl font-bold mb-4">Hasil Rekomendasi Kamera</h2>
    <p class="mb-4 text-gray-600">Total kamera diproses: {{ $total_kamera_diproses }}</p>
    <p class="mb-6 inline-block rounded-full bg-[#e6f7fd] text-[#007fa8] px-3 py-1 text-sm">
        Jenis penggunaan: {{ $penggunaan_terpilih ?? 'Semua Kondisi' }}
    </p>

    <div class="grid md:grid-cols-3 gap-4">
        @foreach($hasil as $k)
        <div class="bg-white rounded-lg shadow p-4 border-t-4 {{ $loop->first ? 'border-yellow-400' : 'border-gray-200' }}">
            <div class="text-2xl mb-2">
                @if($loop->first)
                    <i class="bi bi-trophy-fill text-yellow-500"></i>
                @elseif($loop->iteration == 2)
                    <i class="bi bi-award-fill text-gray-400"></i>
                @else
                    <i class="bi bi-award-fill text-amber-700"></i>
                @endif
            </div>
            @if(!empty($k->image_path))
                <div class="mb-3 rounded-lg border border-gray-100 bg-gray-50 p-3">
                    <img
                        src="{{ asset($k->image_path) }}"
                        alt="{{ $k->nama }}"
                        class="h-44 w-full object-contain"
                        onerror="this.style.display='none'; this.nextElementSibling.style.display='block';"
                    >
                    <p class="hidden text-xs text-gray-500">Foto {{ $k->nama }} belum ditemukan.</p>
                </div>
            @endif
            <h3 class="text-xl font-bold">{{ $k->nama }}</h3>
            <p class="text-gray-600">{{ $k->merek }}</p>
            <div class="mt-2 text-2xl font-bold text-[#edc039]">{{ number_format($k->skor, 2) }}</div>
            <div class="mt-2 text-sm">
                <p><i class="bi bi-cash-coin text-[#edc039] mr-1"></i>Harga: Rp {{ number_format($k->harga) }}/hari</p>
                <p><i class="bi bi-camera text-[#edc039] mr-1"></i>ISO: {{ number_format($k->iso) }} <span class="text-gray-500">(Skor: {{ number_format($k->iso_score, 2) }}/1)</span></p>
                <p><i class="bi bi-bullseye text-[#edc039] mr-1"></i>AF Point: {{ $k->af_point }} <span class="text-gray-500">(Skor: {{ number_format($k->af_score, 2) }}/1)</span></p>
                <p><i class="bi bi-circle-square text-[#edc039] mr-1"></i>Sensor: {{ $k->sensor }} <span class="text-gray-500">(Skor: {{ number_format($k->sensor_score, 2) }}/1)</span></p>
                <p><i class="bi bi-graph-up-arrow text-[#edc039] mr-1"></i>Price Score: {{ number_format($k->price_score, 2) }}/1</p>
                @if($k->lensa_rekomendasi)
                    <div class="mt-3 p-2 bg-gray-100 rounded">
                        <p class="font-semibold"><i class="bi bi-badge-4k text-[#edc039] mr-1"></i>Lensa Rekomendasi:</p>
                        <p>{{ $k->lensa_rekomendasi }}</p>
                        <p>+ Rp {{ number_format($k->harga_lensa) }}/hari</p>
                        <p class="font-bold mt-1">Total: Rp {{ number_format($k->total_harga) }}/hari</p>
                    </div>
                @endif
            </div>
            <a href="{{ route('sewa.kamera.create', $k->id) }}" class="mt-4 inline-block w-full text-center btn-dark py-2.5">
                Sewa Kamera
            </a>
            @if($k->lensa_rekomendasi)
                <a href="{{ route('sewa.paket.create', ['kamera_id' => $k->id]) }}" class="mt-2 inline-block w-full text-center btn-dark px-4 py-2.5 font-medium">
                    Sewa Kamera + Lensa
                </a>
            @endif
        </div>
        @endforeach
    </div>
</div>
@endsection