@extends('layouts.app')
@section('title','FAQ — JobPortal')
@section('content')
<div style="background:#080d1a;min-height:100vh;">
    <div class="py-5 text-center" style="background:linear-gradient(135deg,#0f172a,#1e1b4b);"><div class="container"><h1 class="text-white fw-800 mb-2">Frequently Asked <span class="gradient-text">Questions</span></h1></div></div>
    <div class="container py-5" style="max-width:800px;">
        @if($faqs->count())
        <div class="accordion" id="faqAccordion">
            @foreach($faqs as $i => $faq)
            <div class="card-glass mb-3">
                <h2 class="accordion-header"><button class="accordion-button {{ $i>0?'collapsed':'' }}" type="button" data-bs-toggle="collapse" data-bs-target="#faq{{ $i }}" style="background:transparent;color:#e2e8f0;font-weight:600;border-radius:16px;box-shadow:none;">{{ $faq->question }}</button></h2>
                <div id="faq{{ $i }}" class="accordion-collapse collapse {{ $i===0?'show':'' }}" data-bs-parent="#faqAccordion">
                    <div class="accordion-body text-muted">{{ $faq->answer }}</div>
                </div>
            </div>
            @endforeach
        </div>
        @else
        <div class="accordion" id="faqAccordion">
            @foreach([['How do I create an account?','Click Register at the top, choose your role (Job Seeker or Recruiter), and fill in your details. It is completely free!'],['How do I apply for a job?','Browse jobs, click on a listing, and hit Apply Now. You can attach a cover letter.'],['Is JobPortal free for job seekers?','Yes! Job seekers can create profiles, upload resumes, and apply to unlimited jobs for free.'],['How do I post a job as a recruiter?','Register as a Recruiter, complete your company profile, and go to your dashboard to post jobs.'],['Can I set up job alerts?','Yes! Go to your Job Seeker dashboard and create alerts based on keywords, location, and category.']] as $i => $faq)
            <div class="card-glass mb-3">
                <h2 class="accordion-header"><button class="accordion-button {{ $i>0?'collapsed':'' }}" type="button" data-bs-toggle="collapse" data-bs-target="#faq{{ $i }}" style="background:transparent;color:#e2e8f0;font-weight:600;box-shadow:none;">{{ $faq[0] }}</button></h2>
                <div id="faq{{ $i }}" class="accordion-collapse collapse {{ $i===0?'show':'' }}" data-bs-parent="#faqAccordion">
                    <div class="accordion-body text-muted">{{ $faq[1] }}</div>
                </div>
            </div>
            @endforeach
        </div>
        @endif
        <div class="text-center mt-5 card-glass p-4">
            <p class="text-muted mb-3">Still have questions?</p>
            <a href="{{ route('contact') }}" class="btn btn-primary-gradient px-4">Contact Us</a>
        </div>
    </div>
</div>
@endsection