@extends('layouts.app')

@section('title', app()->getLocale() === 'ar' ? $job->title_ar : $job->title_en)

@section('content')
<div class="grid lg:grid-cols-3 gap-6">
    <div class="lg:col-span-2">
        <div class="bg-white border rounded-lg p-6 mb-6">
            <h1 class="text-2xl font-bold mb-2">{{ app()->getLocale() === 'ar' ? $job->title_ar : $job->title_en }}</h1>
            <p class="text-slate-500 mb-4">
                {{ app()->getLocale() === 'ar' ? $job->country->name_ar : $job->country->name_en }}
                - {{ app()->getLocale() === 'ar' ? $job->specialty->name_ar : $job->specialty->name_en }}
            </p>

            <div class="prose max-w-none">
                <p>{{ app()->getLocale() === 'ar' ? $job->description_ar : $job->description_en }}</p>
            </div>

            <hr class="my-4">

            <h3 class="font-semibold mb-2">الشروط</h3>
            <p class="text-slate-700 whitespace-pre-line">{{ $job->requirements }}</p>

            <div class="mt-4 text-sm text-slate-600">
                الخبرة المطلوبة: {{ $job->experience_required }} سنة
                @if($job->salary_min || $job->salary_max)
                    <br>الراتب: {{ $job->salary_min }} - {{ $job->salary_max }}
                @endif
            </div>
        </div>
    </div>

    <aside>
        <div class="bg-white border rounded-lg p-5">
            <h3 class="font-bold mb-3">التقديم على الوظيفة</h3>

            @auth
                <form method="POST" action="{{ route('jobs.apply', $job) }}" enctype="multipart/form-data" class="space-y-3">
                    @csrf
                    <div>
                        <label class="text-sm font-medium">رفع السيرة الذاتية (PDF/Word)</label>
                        <input type="file" name="cv" class="w-full border rounded px-3 py-2 mt-1">
                        @error('cv')<p class="text-red-600 text-sm mt-1">{{ $message }}</p>@enderror
                    </div>

                    <button class="w-full bg-blue-600 text-white rounded px-4 py-2">إرسال الطلب</button>
                </form>
            @else
                <p class="text-sm text-slate-600 mb-3">يجب تسجيل الدخول أولًا للتقديم.</p>
                <a href="{{ route('login') }}" class="inline-block bg-blue-600 text-white rounded px-4 py-2">تسجيل الدخول</a>
            @endauth