@if ($errors->any())
    <div class="mb-6 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700">
        <p class="font-semibold">Please correct the highlighted information.</p>
        <ul class="mt-2 list-disc pl-5">@foreach ($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul>
    </div>
@endif

<div class="grid gap-6 xl:grid-cols-2">
    <section class="overflow-hidden rounded-2xl border border-blue-100 bg-white shadow-sm shadow-blue-950/5">
        <div class="flex items-center gap-3 border-b border-blue-100 bg-gradient-to-r from-blue-50 to-white px-6 py-5">
            <span class="grid size-10 place-items-center rounded-xl bg-blue-600 text-white shadow-lg shadow-blue-600/20"><svg class="size-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8"/></svg></span>
            <div><h2 class="font-bold text-slate-900">Personal information</h2><p class="mt-0.5 text-xs text-slate-500">Customer identity and primary contact details</p></div>
        </div>
        <div class="grid gap-6 p-6 lg:grid-cols-2">
            <div><label class="form-label">Customer name <span class="text-red-500">*</span></label><input name="name" value="{{ old('name', $customer->name) }}" required class="form-input" placeholder="Enter full name"></div>
            <div><label class="form-label">Mobile number <span class="text-red-500">*</span></label><input name="mobile" value="{{ old('mobile', $customer->mobile) }}" required class="form-input" placeholder="+91 98765 43210"></div>
            <div><label class="form-label">Email address</label><input type="email" name="email" value="{{ old('email', $customer->email) }}" class="form-input" placeholder="customer@example.com"></div>
            <div><label class="form-label">Status <span class="text-red-500">*</span></label><select name="status" class="form-input"><option value="active" @selected(old('status', $customer->status ?: 'active') === 'active')>Active</option><option value="inactive" @selected(old('status', $customer->status) === 'inactive')>Inactive</option></select></div>
        </div>
    </section>
    <section class="overflow-hidden rounded-2xl border border-violet-100 bg-white shadow-sm shadow-violet-950/5">
        <div class="flex items-center gap-3 border-b border-violet-100 bg-gradient-to-r from-violet-50 to-white px-6 py-5">
            <span class="grid size-10 place-items-center rounded-xl bg-violet-600 text-white shadow-lg shadow-violet-600/20"><svg class="size-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 2h12v20l-3-2-3 2-3-2-3 2V2M9 7h6M9 11h6"/></svg></span>
            <div><h2 class="font-bold text-slate-900">Billing and notes</h2><p class="mt-0.5 text-xs text-slate-500">Optional invoicing details and internal remarks</p></div>
        </div>
        <div class="grid gap-6 p-6 lg:grid-cols-2">
            <div><label class="form-label">Tax / GST number</label><input name="tax_number" value="{{ old('tax_number', $customer->tax_number) }}" class="form-input" placeholder="Optional tax reference"></div>
            <div class="lg:col-span-2"><label class="form-label">Address</label><textarea name="address" rows="3" class="form-input" placeholder="Customer billing or residential address">{{ old('address', $customer->address) }}</textarea></div>
            <div class="lg:col-span-2"><label class="form-label">Remarks</label><textarea name="remarks" rows="3" class="form-input" placeholder="Booking preferences or internal notes">{{ old('remarks', $customer->remarks) }}</textarea></div>
        </div>
    </section>
</div>