@extends('layouts.recruiter')
@section('title', 'My Jobs — JOBES')

@section('recruiter_content')
<div class="card-seeker-panel animate__animated animate__fadeIn">
    <div class="d-flex justify-content-between align-items-center flex-wrap gap-3 mb-4">
        <h5 class="fw-800 text-dark mb-0" style="font-size:1.1rem; border-left:3px solid #0d9488; padding-left:10px;">My Job Posts</h5>
        <a href="{{ route('recruiter.jobs.create') }}" class="btn btn-teal-gradient px-4 py-2.5">
            <i class="fas fa-plus me-2"></i> Post a Job
        </a>
    </div>
    
    @if($jobs->count())
    <div class="table-responsive">
        <table class="table align-middle mb-0" style="border-collapse:separate; border-spacing:0 8px;">
            <thead>
                <tr style="background:#f1f5f9; color:#0f172a;">
                    <th class="py-3 px-3 text-dark border-0" style="border-top-left-radius:10px; border-bottom-left-radius:10px; font-weight:700;">Job Title</th>
                    <th class="py-3 px-3 text-dark border-0" style="font-weight:700;">Category</th>
                    <th class="py-3 px-3 text-dark border-0" style="font-weight:700;">Applicants</th>
                    <th class="py-3 px-3 text-dark border-0" style="font-weight:700;">Status</th>
                    <th class="py-3 px-3 text-dark border-0" style="font-weight:700;">Posted On</th>
                    <th class="py-3 px-3 text-dark border-0" style="border-top-right-radius:10px; border-bottom-right-radius:10px; font-weight:700;">Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach($jobs as $job)
                <tr class="bg-light hover-shadow-xs transition-all-200" style="border-radius:10px;">
                    <td class="py-3 px-3 border-0 text-start" style="border-top-left-radius:10px; border-bottom-left-radius:10px;">
                        <a href="{{ route('jobs.show', $job->slug) }}" target="_blank" class="fw-800 text-dark text-decoration-none hover-teal" style="font-size:0.95rem;">
                            {{ $job->title }}
                        </a>
                    </td>
                    <td class="py-3 px-3 border-0 text-start text-muted small fw-700">
                        {{ $job->category->name ?? '—' }}
                    </td>
                    <td class="py-3 px-3 border-0 text-start text-dark fw-800 small">
                        {{ $job->applications_count }}
                    </td>
                    <td class="py-3 px-3 border-0 text-start">
                        @php
                            $statusColor = match($job->status) {
                                'active' => 'background:#d1fae5; color:#065f46;',
                                'pending' => 'background:#fef3c7; color:#92400e;',
                                default => 'background:#e2e8f0; color:#475569;'
                            };
                        @endphp
                        <span class="badge px-3 py-2 text-uppercase fw-800" style="{{ $statusColor }} border-radius:30px; font-size:0.7rem;">
                            {{ $job->status }}
                        </span>
                    </td>
                    <td class="py-3 px-3 border-0 text-muted small fw-700">
                        {{ $job->created_at->format('d M Y') }}
                    </td>
                    <td class="py-3 px-3 border-0 text-start" style="border-top-right-radius:10px; border-bottom-right-radius:10px;">
                        <div class="d-flex align-items-center gap-2">
                            <a href="{{ route('recruiter.jobs.edit', $job->id) }}" class="btn btn-light border btn-sm fw-800 p-2 text-dark" style="border-radius:8px;" title="Edit Job">
                                <i class="fas fa-edit text-teal-accent"></i>
                            </a>
                            <form method="POST" action="{{ route('recruiter.jobs.destroy', $job->id) }}" onsubmit="return confirm('Are you sure you want to delete this job post?')" class="d-inline-block">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-light border btn-sm fw-800 p-2 text-danger" style="border-radius:8px;" title="Delete Job">
                                    <i class="fas fa-trash"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    
    <div class="mt-4 d-flex justify-content-center">
        {{ $jobs->links() }}
    </div>
    @else
    <div class="text-center py-5">
        <div style="font-size:4rem; filter: grayscale(10%) contrast(90%);">💼</div>
        <h5 class="text-dark fw-800 mt-3">No Jobs Posted Yet</h5>
        <p class="text-muted small mb-4">Start attracting talent by posting your first job opening.</p>
        <a href="{{ route('recruiter.jobs.create') }}" class="btn btn-teal-gradient px-5 py-2.5">Post First Job</a>
    </div>
    @endif
</div>
@endsection