@extends('website.layouts.main')

@section('meta_title', ($company->name ?? 'Company').' Careers')
@section('content')
<section class="section-space">
    <div class="container">
        @if(session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif

        <div class="mb-4">
            <h1 class="h3 fw-bold">{{ $company->name }} — Careers</h1>
            <p class="text-muted">Open positions. Apply directly — no login required.</p>
        </div>

        <div class="row g-4">
            @forelse($jobs as $job)
                <div class="col-md-6 col-lg-4">
                    <div class="card card-soft h-100 border-0 shadow-sm">
                        <div class="card-body d-flex flex-column">
                            <h2 class="h5 fw-semibold">{{ $job->title }}</h2>
                            <p class="text-muted small mb-2">{{ $job->department?->name ?? 'General' }}</p>
                            <p class="small mb-1"><i class="bi bi-geo-alt"></i> {{ $job->location ?: 'Flexible' }}</p>
                            <p class="small mb-3"><i class="bi bi-clock"></i> {{ ucfirst($job->employment_type) }} · {{ $job->openings }} opening(s)</p>
                            @if($job->description)
                                <p class="small text-muted flex-grow-1">{{ \Illuminate\Support\Str::limit(strip_tags($job->description), 120) }}</p>
                            @endif
                            <a href="{{ route('careers.show', [$companyKey, $job]) }}" class="btn btn-kiyo mt-3">Apply now</a>
                        </div>
                    </div>
                </div>
            @empty
                <div class="col-12">
                    <div class="alert alert-light border">No open positions at the moment.</div>
                </div>
            @endforelse
        </div>
    </div>
</section>
@endsection