@php
    $input = 'block w-full min-h-12 text-base rounded-lg border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500';
@endphp

<x-app-layout title="Warranty check">
    <x-slot name="header">
        <h1 class="text-xl font-semibold text-gray-900">Warranty check</h1>
        <p class="text-sm text-gray-500">Is the device still under warranty, and what did we repair?</p>
    </x-slot>

    <div class="max-w-3xl mx-auto px-4 py-6 sm:px-6 lg:px-8 space-y-5">
        <x-flash />

        <form method="GET" action="{{ route('warranty.check') }}" class="flex flex-col gap-2 sm:flex-row">
            <label for="q" class="sr-only">Job number, invoice number, IMEI or serial</label>
            <input id="q" name="q" type="search" value="{{ $q }}" autofocus autocomplete="off"
                   placeholder="Job no, invoice no, IMEI or serial" class="{{ $input }} flex-1">
            <button type="submit" class="min-h-12 rounded-lg bg-brand-600 px-6 font-semibold text-white hover:bg-brand-500">Check</button>
        </form>

        @if ($results !== null)
            @forelse ($results as $result)
                @php $device = $result['device']; @endphp
                <section class="rounded-xl bg-white p-4 shadow-sm sm:p-6 space-y-4">
                    <div class="flex flex-wrap items-start justify-between gap-3">
                        <div>
                            <h2 class="text-lg font-semibold text-gray-900">{{ $device->display_name ?: $device->deviceType?->name }}</h2>
                            <p class="text-sm text-gray-500">
                                {{ $device->customer->name }} · {{ $device->customer->phone_display }}
                                @if ($device->serial_number) · <span class="font-mono">{{ $device->serial_number }}</span> @endif
                            </p>
                        </div>
                        @if ($result['active'])
                            <span class="rounded-full bg-green-600 px-4 py-1.5 text-sm font-bold text-white">Under warranty</span>
                        @else
                            <span class="rounded-full bg-gray-500 px-4 py-1.5 text-sm font-bold text-white">No active warranty</span>
                        @endif
                    </div>

                    @if ($result['warranties']->isEmpty())
                        <p class="rounded-lg bg-gray-50 px-4 py-3 text-sm text-gray-600">No warranty found for this device. Warranties are made when an invoice is finalized.</p>
                    @else
                        <ul class="space-y-3">
                            @foreach ($result['warranties']->groupBy('repair_job_id') as $rows)
                                @php $original = $rows->first()->repairJob; @endphp
                                <li class="rounded-lg border border-gray-200 p-3">
                                    <p class="text-sm text-gray-600">
                                        Repair
                                        @if ($original)
                                            <a href="{{ route('jobs.show', $original) }}" class="font-semibold text-brand-700 underline">{{ $original->job_no }}</a>
                                        @endif
                                        @if ($rows->first()->invoice?->invoice_no) · Invoice {{ $rows->first()->invoice->invoice_no }} @endif
                                        @if ($original?->delivered_at) · Delivered {{ $original->delivered_at->format('d M Y') }} @endif
                                    </p>
                                    @if ($original?->diagnosis)
                                        <p class="mt-1 text-sm text-gray-700"><span class="font-medium">Fault found:</span> {{ $original->diagnosis }}</p>
                                    @endif
                                    <ul class="mt-2 divide-y divide-gray-100">
                                        @foreach ($rows as $w)
                                            <li class="flex flex-wrap items-center justify-between gap-2 py-2">
                                                <div>
                                                    <p class="font-medium text-gray-900">{{ $w->description }}</p>
                                                    <p class="text-sm">
                                                        <span @class(['font-semibold', 'text-green-700' => $w->isActive(), 'text-gray-500' => ! $w->isActive(), 'text-red-700' => $w->status === \App\Enums\WarrantyStatus::Void])>
                                                            {{ $w->stateLabel() }}
                                                        </span>
                                                        <span class="text-gray-500">
                                                            · until {{ $w->ends_on->format('d M Y') }}
                                                            @if ($w->isActive()) ({{ $w->daysLeft() }} {{ $w->daysLeft() === 1 ? 'day' : 'days' }} left) @endif
                                                            @if ($w->claims->isNotEmpty()) · Claimed before: {{ $w->claims->pluck('job_no')->join(', ') }} @endif
                                                        </span>
                                                    </p>
                                                    @if ($w->void_reason)
                                                        <p class="text-xs text-red-700">{{ $w->void_reason }}</p>
                                                    @endif
                                                </div>
                                                @if ($w->isActive())
                                                    <a href="{{ route('warranty.job.create', $w) }}" class="inline-flex min-h-11 items-center rounded-lg bg-amber-500 px-4 text-sm font-semibold text-white hover:bg-amber-400">
                                                        Create warranty job
                                                    </a>
                                                @endif
                                            </li>
                                        @endforeach
                                    </ul>
                                </li>
                            @endforeach
                        </ul>
                    @endif
                </section>
            @empty
                <p class="rounded-xl bg-white p-6 text-center text-gray-600 shadow-sm">
                    Nothing found for "{{ $q }}". Check the job number (like {{ setting('job_number_prefix', 'RJ') }}-{{ now()->year }}-0001), the invoice number (INV-…), or the IMEI / serial.
                </p>
            @endforelse
        @endif
    </div>
</x-app-layout>