@php $old = fn ($k, $d = null) => old($k, $shipment->{$k} ?? $d); $date = fn ($k) => old($k, optional($shipment->{$k})->toDateString()); @endphp
<div x-data="{ method: '{{ $old('shipping_method', 'roro') }}' }" class="space-y-6">
    <fieldset class="grid gap-4 sm:grid-cols-4">
        <legend class="mb-2 text-base font-semibold">Supplier and route</legend>
        <div class="sm:col-span-2"><label for="supplier_id" class="mb-1 block text-sm font-medium">Supplier / auction</label>
            <select id="supplier_id" name="supplier_id" class="field"><option value="">None</option>@foreach ($suppliers as $s)<option value="{{ $s->id }}" @selected($old('supplier_id') == $s->id)>{{ $s->name }}</option>@endforeach</select></div>
        <div><label for="origin_country" class="mb-1 block text-sm font-medium">Origin country</label>
            <select id="origin_country" name="origin_country" class="field"><option value="">Not set</option>@foreach (config('inventory.countries') as $k => $l)<option value="{{ $k }}" @selected($old('origin_country') === $k)>{{ $l }}</option>@endforeach</select></div>
        <div><label for="origin_port" class="mb-1 block text-sm font-medium">Port of loading</label><input id="origin_port" name="origin_port" value="{{ $old('origin_port') }}" class="field"></div>
        <div><label for="destination_port" class="mb-1 block text-sm font-medium">Port of discharge</label><input id="destination_port" name="destination_port" value="{{ $old('destination_port', 'Mombasa') }}" required class="field"></div>
        <div><label for="shipping_method" class="mb-1 block text-sm font-medium">Method</label>
            <select id="shipping_method" name="shipping_method" x-model="method" class="field">@foreach (config('inventory.shipping_methods') as $k => $l)<option value="{{ $k }}">{{ $l }}</option>@endforeach</select></div>
        <div><label for="shipping_line" class="mb-1 block text-sm font-medium">Shipping line</label><input id="shipping_line" name="shipping_line" value="{{ $old('shipping_line') }}" class="field"></div>
        <div><label for="vessel_name" class="mb-1 block text-sm font-medium">Vessel</label><input id="vessel_name" name="vessel_name" value="{{ $old('vessel_name') }}" class="field"></div>
    </fieldset>

    <fieldset class="grid gap-4 sm:grid-cols-4">
        <legend class="mb-2 text-base font-semibold">Documents</legend>
        <div><label for="bill_of_lading_no" class="mb-1 block text-sm font-medium">Bill of Lading no.</label><input id="bill_of_lading_no" name="bill_of_lading_no" value="{{ $old('bill_of_lading_no') }}" class="field uppercase"></div>
        <div x-show="method === 'container'"><label for="container_no" class="mb-1 block text-sm font-medium">Container no.</label>
            <input id="container_no" name="container_no" value="{{ $old('container_no') }}" placeholder="MSKU1234567" :required="method === 'container'" :disabled="method !== 'container'" class="field uppercase" maxlength="11"></div>
        <div><label for="voyage_no" class="mb-1 block text-sm font-medium">Voyage no.</label><input id="voyage_no" name="voyage_no" value="{{ $old('voyage_no') }}" class="field"></div>
        <div><label for="clearing_agent" class="mb-1 block text-sm font-medium">Clearing agent</label><input id="clearing_agent" name="clearing_agent" value="{{ $old('clearing_agent') }}" class="field"></div>
        <div><label for="clearing_agent_phone" class="mb-1 block text-sm font-medium">Agent phone</label><input id="clearing_agent_phone" name="clearing_agent_phone" value="{{ $old('clearing_agent_phone') }}" class="field"></div>
    </fieldset>

    <fieldset class="grid gap-4 sm:grid-cols-4">
        <legend class="mb-2 text-base font-semibold">Dates</legend>
        <div><label for="booked_on" class="mb-1 block text-sm font-medium">Booked on</label><input id="booked_on" name="booked_on" type="date" value="{{ $date('booked_on') }}" class="field"></div>
        <div><label for="etd" class="mb-1 block text-sm font-medium">ETD (departure)</label><input id="etd" name="etd" type="date" value="{{ $date('etd') }}" class="field"></div>
        <div><label for="eta" class="mb-1 block text-sm font-medium">ETA (arrival)</label><input id="eta" name="eta" type="date" value="{{ $date('eta') }}" class="field"></div>
        <div><label for="port_free_days" class="mb-1 block text-sm font-medium">Free storage days at port</label><input id="port_free_days" name="port_free_days" type="number" min="0" max="60" value="{{ $old('port_free_days') }}" class="field"></div>
    </fieldset>

    <div><label for="notes" class="mb-1 block text-sm font-medium">Notes</label><textarea id="notes" name="notes" rows="3" class="field">{{ $old('notes') }}</textarea></div>
</div>