@extends('layouts.branch')

@section('title', 'Edit Insurance')
@section('header', 'Update Insurance Profile')

@section('content')
<div class="space-y-6">
    @include('partials.branch._breadcrumbs', [
        'breadcrumbs' => [
            ['name' => 'Insurances', 'url' => route('branch.insurances.index')],
            ['name' => 'Edit Profile', 'url' => '#']
        ]
    ])

    <div class="max-w-4xl mx-auto">
        <form action="{{ route('branch.insurances.update', $insurance->id) }}" method="POST" class="space-y-6 pb-20">
            @csrf
            
            <!-- Company Profile Section -->
            <div class="bg-white border border-slate-200 rounded-xl shadow-sm overflow-hidden">
                <div class="p-6 border-b border-slate-200 bg-slate-50/50 flex justify-between items-center">
                    <div>
                        <h3 class="text-lg font-semibold text-slate-800">Company (Payer) Profile</h3>
                        <p class="text-sm text-slate-500">Official identification and contact details.</p>
                    </div>
                    <span class="px-3 py-1 bg-indigo-50 text-indigo-600 rounded-lg text-xs font-bold uppercase tracking-widest border border-indigo-100">
                        {{ $insurance->company_id }}
                    </span>
                </div>
                
                <div class="p-6 grid grid-cols-1 md:grid-cols-2 gap-6">
                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Company Name*</label>
                        <input type="text" name="company_name" value="{{ old('company_name', $insurance->company_name) }}" required
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all placeholder:text-slate-400">
                        @error('company_name') <p class="text-xs text-red-500">{{ $message }}</p> @enderror
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Claim Email Address</label>
                        <input type="email" name="claim_email" value="{{ old('claim_email', $insurance->claim_email) }}"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Provider Helpline</label>
                        <input type="text" name="helpline_number" value="{{ old('helpline_number', $insurance->helpline_number) }}"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Office Address</label>
                        <textarea name="address" rows="1"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">{{ old('address', $insurance->address) }}</textarea>
                    </div>
                </div>
            </div>

            <!-- TPA Details Section -->
            <div class="bg-white border border-slate-200 rounded-xl shadow-sm overflow-hidden">
                <div class="p-6 border-b border-slate-200 bg-slate-50/50">
                    <h3 class="text-lg font-semibold text-slate-800">TPA (Third Party Administrator)</h3>
                    <p class="text-sm text-slate-500">Details of the handling administrator.</p>
                </div>
                
                <div class="p-6 grid grid-cols-1 md:grid-cols-3 gap-6">
                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">TPA Name</label>
                        <input type="text" name="tpa_name" value="{{ old('tpa_name', $insurance->tpa_name) }}"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Contact Person</label>
                        <input type="text" name="tpa_contact_person" value="{{ old('tpa_contact_person', $insurance->tpa_contact_person) }}"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Portal URL</label>
                        <input type="url" name="tpa_portal_url" value="{{ old('tpa_portal_url', $insurance->tpa_portal_url) }}"
                            class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                    </div>
                </div>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <!-- Contractual Terms -->
                <div class="bg-white border border-slate-200 rounded-xl shadow-sm overflow-hidden">
                    <div class="p-6 border-b border-slate-200 bg-slate-50/50">
                        <h3 class="text-lg font-semibold text-slate-800">Contractual Terms</h3>
                    </div>
                    <div class="p-6 space-y-4">
                        <div class="space-y-2">
                            <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Pre-Agreed Credit Limit (AED)</label>
                            <input type="number" name="credit_limit" value="{{ old('credit_limit', $insurance->credit_limit) }}" step="0.01"
                                class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none transition-all">
                        </div>
                        <div class="grid grid-cols-2 gap-4">
                            <div class="space-y-2">
                                <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Agreement Start</label>
                                <input type="date" name="agreement_start_date" value="{{ old('agreement_start_date', $insurance->agreement_start_date?->format('Y-m-d')) }}"
                                    class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none">
                            </div>
                            <div class="space-y-2">
                                <label class="text-xs font-bold text-slate-500 uppercase tracking-widest">Agreement Expiry</label>
                                <input type="date" name="agreement_expiry_date" value="{{ old('agreement_expiry_date', $insurance->agreement_expiry_date?->format('Y-m-d')) }}"
                                    class="w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none">
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Discount Rates -->
                <div class="bg-white border border-slate-200 rounded-xl shadow-sm overflow-hidden">
                    <div class="p-6 border-b border-slate-200 bg-slate-50/50">
                        <h3 class="text-lg font-semibold text-slate-800">Discount Rates (%)</h3>
                    </div>
                    <div class="p-6 space-y-4">
                        <div class="grid grid-cols-1 gap-4">
                            <div class="flex items-center justify-between gap-4">
                                <label class="text-xs font-bold text-slate-600 uppercase tracking-tight">IPD Services Discount</label>
                                <div class="w-24 relative">
                                    <input type="number" name="discount_ipd" value="{{ old('discount_ipd', $insurance->discount_ipd) }}" step="0.01" max="100" class="w-full px-3 py-2 border border-slate-200 rounded-lg pr-8">
                                    <span class="absolute right-3 top-2 text-slate-400 text-xs">%</span>
                                </div>
                            </div>
                            <div class="flex items-center justify-between gap-4">
                                <label class="text-xs font-bold text-slate-600 uppercase tracking-tight">OPD Services Discount</label>
                                <div class="w-24 relative">
                                    <input type="number" name="discount_opd" value="{{ old('discount_opd', $insurance->discount_opd) }}" step="0.01" max="100" class="w-full px-3 py-2 border border-slate-200 rounded-lg pr-8">
                                    <span class="absolute right-3 top-2 text-slate-400 text-xs">%</span>
                                </div>
                            </div>
                            <div class="flex items-center justify-between gap-4">
                                <label class="text-xs font-bold text-slate-600 uppercase tracking-tight">Diagnostics Discount</label>
                                <div class="w-24 relative">
                                    <input type="number" name="discount_diagnostics" value="{{ old('discount_diagnostics', $insurance->discount_diagnostics) }}" step="0.01" max="100" class="w-full px-3 py-2 border border-slate-200 rounded-lg pr-8">
                                    <span class="absolute right-3 top-2 text-slate-400 text-xs">%</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Actions Footer -->
            <div class="flex items-center justify-end gap-3 pt-6 border-t border-slate-100">
                <a href="{{ route('branch.insurances.index') }}" class="px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-100 rounded-lg transition-colors">
                    Cancel
                </a>
                <button type="submit" class="px-4 py-2 text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 rounded-lg transition-colors shadow-sm shadow-indigo-200">
                    Update Insurance Profile
                </button>
            </div>
        </form>
    </div>
</div>
@endsection