@extends('jobs.layout')
@section('title', 'Frequently asked questions')
@section('content')
<main class="wrap">
    <span class="eyebrow">Help center</span><h1 class="title">Frequently asked questions</h1>
    <p class="muted">Answers to common questions about using JULISTAH JOBS.</p>
    @if ($faqs->isEmpty())
        <div class="empty"><strong>No help articles have been published yet.</strong><br>Please check back soon.</div>
    @else
        <section class="blog-list" aria-label="Frequently asked questions">
            @foreach ($faqs as $faq)
                <article class="panel">
                    @if ($faq->image_path)<img src="{{ route('content.image', ['type' => 'faq', 'record' => $faq->id]) }}" alt="" style="width:100%;max-height:300px;object-fit:cover;border-radius:12px;margin-bottom:16px">@endif
                    <h2 class="section-title">{{ $faq->question }}</h2>
                    <div class="prose">{{ $faq->answer }}</div>
                </article>
            @endforeach
        </section>
    @endif
</main>
@endsection