@extends('layouts.admin')

@section('page-title', 'Job-Openings')

@section('content')
<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2 class="mb-4 text-center">Current Job Openings</h2>
        <a href="{{ route('careers.create')}}" class="btn btn-outline-primary">Add Openings</a>
     </div>
    <div class="row">
        @forelse($jobs as $job)
            <div class="col-md-4 mb-4">
                <div class="card h-100 shadow-sm">
                    <div class="card-body">
                        <h5 class="card-title">{{ $job->job_title }}</h5>
                        <p class="card-text">
                            <strong>Type:</strong> {{ $job->job_type }}<br>
                            <strong>Location:</strong> {{ $job->location }}<br>
                            @if($job->salary)
                                <strong>Salary:</strong> {{ $job->salary }}<br>
                            @endif
                        </p>
                        <a href="{{ route('career.apply', $job->id) }}" class="btn btn-outline-primary">Apply Now</a>
                        <a href="{{ route('careers.edit', $job->id) }}" class="btn btn-outline-primary">Edit</a>
                       <form action="{{ route('careers.destroy', $job->id) }}" method="POST" class="d-inline">
                            @csrf
                            @method('DELETE')
                            <button class="btn btn-sm dlt-btn" onclick="return confirm('Delete this job?')">Delete</button>
                        </form>
                    </div>
                </div>
            </div>
        @empty
            <p class="text-center">No open positions at the moment.</p>
        @endforelse
    </div>
</div>
@endsection