@extends('layouts.public')

@section('title', 'Frequently Asked Questions - ' . config('app.name'))
@section('meta_description', 'Frequently asked questions about Shavhani Attorneys — consultations, fees, RAF/PRASA claims, and more.')

@push('schema')
<script type="application/ld+json">
{!! json_encode(app(\App\Services\SchemaService::class)->generateFAQPage()) !!}
</script>
@endpush

@section('content')
<x-page-hero title="Frequently Asked Questions" subtitle="Common questions about consultations, fees, and the matters we handle." compact />

<section class="section-spacing bg-firm-surface border-t border-slate-200">
    <div class="firm-container max-w-3xl">
        <div class="space-y-3">
            @forelse(\App\Models\FAQ::where('is_active', true)->orderBy('order')->get() as $faq)
            <details class="faq-item">
                <summary>{{ $faq->question }} <span class="text-firm-red-500 text-xl leading-none">+</span></summary>
                <div class="faq-answer">{!! nl2br(e($faq->answer)) !!}</div>
            </details>
            @empty
            <p class="text-center text-slate-500 py-12">FAQs will be available soon.</p>
            @endforelse
        </div>

        <div class="mt-12 firm-card bg-firm-ink text-white text-center border-firm-ink">
            <p class="text-lg mb-4">Still have questions?</p>
            <a href="{{ route('contact') }}" class="btn-primary">Contact Us</a>
        </div>
    </div>
</section>
@endsection