@extends('layouts.app')
@section('title', 'Post a Job')

@section('content')
<div class="max-w-3xl mx-auto px-4 py-8">
    <h1 class="text-2xl font-bold mb-6">Post a New Job</h1>

    <form method="POST" action="{{ route('employer.jobs.store') }}"
          class="bg-white rounded-lg shadow p-6 space-y-5">
        @csrf

        <div>
            <label class="text-sm font-medium">Job Title *</label>
            <input name="title" value="{{ old('title') }}" required
                   class="w-full border rounded px-3 py-2 mt-1">
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div>
                <label class="text-sm font-medium">Category</label>
                <select name="category_id" class="w-full border rounded px-3 py-2 mt-1">
                    <option value="">— Select —</option>
                    @foreach($categories as $cat)
                        <option value="{{ $cat->id }}" @selected(old('category_id') == $cat->id)>
                            {{ $cat->name }}
                        </option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="text-sm font-medium">Job Type *</label>
                <select name="job_type" required class="w-full border rounded px-3 py-2 mt-1">
                    <option value="full_time" @selected(old('job_type') == 'full_time')>Full Time</option>
                    <option value="part_time" @selected(old('job_type') == 'part_time')>Part Time</option>
                    <option value="contract" @selected(old('job_type') == 'contract')>Contract</option>
                    <option value="internship" @selected(old('job_type') == 'internship')>Internship</option>
                </select>
            </div>
        </div>

        <div>
            <label class="text-sm font-medium">Description *</label>
            <textarea name="description" rows="6" required
                      class="w-full border rounded px-3 py-2 mt-1">{{ old('description') }}</textarea>
        </div>

        <div>
            <label class="text-sm font-medium">Requirements</label>
            <textarea name="requirements" rows="4"
                      class="w-full border rounded px-3 py-2 mt-1">{{ old('requirements') }}</textarea>
        </div>

        <div>
            <label class="text-sm font-medium">Location *</label>
            <input name="location" value="{{ old('location') }}" required
                   class="w-full border rounded px-3 py-2 mt-1">
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div>
                <label class="text-sm font-medium">Experience Min (years)</label>
                <input type="number" name="experience_min" value="{{ old('experience_min', 0) }}"
                       min="0" class="w-full border rounded px-3 py-2 mt-1">
            </div>
            <div>
                <label class="text-sm font-medium">Experience Max (years)</label>
                <input type="number" name="experience_max" value="{{ old('experience_max') }}"
                       min="0" class="w-full border rounded px-3 py-2 mt-1">
            </div>
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div>
                <label class="text-sm font-medium">Salary Min</label>
                <input type="number" name="salary_min" value="{{ old('salary_min') }}"
                       min="0" class="w-full border rounded px-3 py-2 mt-1">
            </div>
            <div>
                <label class="text-sm font-medium">Salary Max</label>
                <input type="number" name="salary_max" value="{{ old('salary_max') }}"
                       min="0" class="w-full border rounded px-3 py-2 mt-1">
            </div>
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div>
                <label class="text-sm font-medium">Vacancies</label>
                <input type="number" name="vacancies" value="{{ old('vacancies', 1) }}"
                       min="1" class="w-full border rounded px-3 py-2 mt-1">
            </div>
            <div>
                <label class="text-sm font-medium">Deadline</label>
                <input type="date" name="deadline" value="{{ old('deadline') }}"
                       class="w-full border rounded px-3 py-2 mt-1">
            </div>
        </div>

        <div class="flex gap-3">
            <button class="bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700">
                Publish Job
            </button>
            <a href="{{ route('employer.jobs.index') }}"
               class="bg-gray-200 text-gray-700 px-6 py-2 rounded hover:bg-gray-300">
                Cancel
            </a>
        </div>
    </form>
</div>
@endsection