@php
    $requirements = old('requirements', $country ? implode(PHP_EOL, $country->requirements ?? []) : '');
    $courses = old('courses', $country ? implode(PHP_EOL, $country->courses ?? []) : '');
@endphp

<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
    <div class="lg:col-span-2 space-y-6">
        <div class="bg-white rounded-2xl border border-gray-100 shadow-sm p-6 grid grid-cols-1 md:grid-cols-2 gap-5">
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Country Name <span class="text-red-500">*</span></label>
                <input name="name" value="{{ old('name', $country->name ?? '') }}" required class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('name')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Flag Text</label>
                <input name="flag" value="{{ old('flag', $country->flag ?? '') }}" placeholder="JP" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('flag')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Font Awesome Icon</label>
                <input name="icon_class" value="{{ old('icon_class', $country->icon_class ?? 'fas fa-globe') }}" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('icon_class')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Average Salary</label>
                <input name="salary" value="{{ old('salary', $country->salary ?? '') }}" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('salary')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Visa Success Rate</label>
                <input name="visa_rate" value="{{ old('visa_rate', $country->visa_rate ?? '') }}" placeholder="97%" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('visa_rate')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-bold text-gray-900 mb-2">Badge</label>
                <input name="badge" value="{{ old('badge', $country->badge ?? '') }}" placeholder="High Demand" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('badge')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
        </div>

        <div class="bg-white rounded-2xl border border-gray-100 shadow-sm p-6">
            <label class="block text-sm font-bold text-gray-900 mb-2">Requirements</label>
            <textarea name="requirements" rows="7" placeholder="One requirement per line" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">{{ $requirements }}</textarea>
            @error('requirements')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
        </div>

        <div class="bg-white rounded-2xl border border-gray-100 shadow-sm p-6">
            <label class="block text-sm font-bold text-gray-900 mb-2">Available Courses</label>
            <textarea name="courses" rows="6" placeholder="One course per line" class="block w-full rounded-xl border-0 py-3 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">{{ $courses }}</textarea>
            @error('courses')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
        </div>
    </div>

    <div class="space-y-6">
        <div class="bg-white rounded-2xl border border-gray-100 shadow-sm p-6 space-y-4">
            <h3 class="text-sm font-bold text-gray-900">Display Settings</h3>
            <div>
                <label class="block text-xs font-semibold text-gray-700 mb-1">Badge Color Classes</label>
                <input name="badge_color" value="{{ old('badge_color', $country->badge_color ?? 'bg-blue-100 text-blue-700') }}" class="block w-full rounded-xl border-0 py-2.5 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('badge_color')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-xs font-semibold text-gray-700 mb-1">Sort Order</label>
                <input name="sort_order" type="number" min="0" value="{{ old('sort_order', $country->sort_order ?? 0) }}" class="block w-full rounded-xl border-0 py-2.5 px-4 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-[#027fc5]">
                @error('sort_order')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <label class="flex items-center gap-3 text-sm font-semibold text-gray-700">
                <input type="hidden" name="is_active" value="0">
                <input type="checkbox" name="is_active" value="1" {{ old('is_active', $country->is_active ?? true) ? 'checked' : '' }} class="rounded text-primary-600">
                Active
            </label>
        </div>
        <div class="space-y-3">
            <button class="w-full rounded-xl px-5 py-3 text-sm font-bold text-white shadow-lg" style="background:#027fc5;"><i class="fas fa-save mr-1"></i> {{ $submitLabel }}</button>
            <a href="{{ route('admin.countries.index') }}" class="block text-center rounded-xl px-5 py-3 text-sm font-semibold bg-gray-100 text-gray-700 hover:bg-gray-200">Cancel</a>
        </div>
    </div>
</div>