@extends('layouts.montir')

@section('title', 'Identitas Inspeksi')

@section('content')

<div class="relative bg-gray-50 min-h-screen py-8">

    <div class="max-w-md mx-auto bg-white rounded-2xl shadow-md px-6 py-8">

        <!-- PROGRESS -->
        <div class="flex items-center justify-between mb-6">
            <span class="text-orange-500 font-semibold text-lg">
                1<span class="text-gray-400">/20</span>
            </span>
            <div class="flex-1 h-1 bg-gray-200 rounded-full mx-4">
                <div class="h-1 bg-orange-500 rounded-full w-[5%]"></div>
            </div>
        </div>

        <h1 class="text-3xl font-bold mb-8 text-gray-800">Identitas</h1>

        <form id="identitasForm"
              method="POST"
              action="{{ route('montir.inspection.identitas.store') }}">
            @csrf

            <!-- INSPEKTOR -->
            <div class="mb-6">
                <label class="block text-sm font-medium mb-2 text-gray-700">
                    Nama Inspektor
                </label>
                <input type="text"
                       value="{{ auth()->user()->name }}"
                       readonly
                       class="w-full rounded-xl border px-4 py-3 bg-gray-100 cursor-not-allowed">
            </div>

            <!-- CUSTOMER -->
            <div class="mb-6">
                <label class="block text-sm font-medium mb-2 text-gray-700">
                    Nama Customer
                </label>
                <input type="text"
                       name="customer_name"
                       required
                       value="{{ old('customer_name', $inspeksi->customer_name ?? '') }}"
                       class="w-full rounded-xl border px-4 py-3 focus:ring-orange-400">
            </div>

            <!-- CABANG -->
            <div class="mb-6">
                <label class="block text-sm font-medium mb-2 text-gray-700">
                    Cabang
                </label>
                <select name="branch"
                        class="w-full rounded-xl border px-4 py-3 focus:ring-orange-400">
                    @php
                        $branch = old('branch', $inspeksi->branch ?? '');
                    @endphp
                    <option value="Yogyakarta" {{ $branch == 'Yogyakarta' ? 'selected' : '' }}>Yogyakarta</option>
                    <option value="Solo" {{ $branch == 'Solo' ? 'selected' : '' }}>Solo</option>
                    <option value="Semarang" {{ $branch == 'Semarang' ? 'selected' : '' }}>Semarang</option>
                    <option value="Surabaya" {{ $branch == 'Surabaya' ? 'selected' : '' }}>Surabaya</option>
                    <option value="Malang" {{ $branch == 'Malang' ? 'selected' : '' }}>Malang</option>
                </select>
            </div>

            <!-- TANGGAL -->
            <div class="mb-10">
                <label class="block text-sm font-medium mb-2 text-gray-700">
                    Tanggal
                </label>
                <input type="date"
                       name="inspection_date"
                       value="{{ old(
                           'inspection_date',
                           optional($inspeksi)->inspection_date
                               ? \Carbon\Carbon::parse($inspeksi->inspection_date)->format('Y-m-d')
                               : now()->format('Y-m-d')
                       ) }}"
                       class="w-full rounded-xl border px-4 py-3 focus:ring-orange-400">
            </div>

        </form>
    </div>

    <!-- NEXT BUTTON -->
    <div class="fixed bottom-6 inset-x-0 z-50">
        <div class="max-w-md mx-auto px-4">
            <button type="submit"
                    form="identitasForm"
                    class="w-full bg-amber-700 hover:bg-amber-800
                           text-white py-4 rounded-2xl font-semibold text-lg shadow-md">
                Next
            </button>
        </div>
    </div>

</div>

@endsection