{% extends 'base.html.twig' %}

{% block title %}FAQ{% endblock %}

{% block body %}
<section id="faq" class="faq-section">
    <div class="faq-container">
        <div class="faq-header">
            <h1 class="faq-title">Foire Aux Questions (FAQ)</h1>
            <p class="faq-subtitle">Trouvez des réponses à vos questions les plus fréquentes</p>
            <div class="faq-search">
                <input type="text" id="faq-search" placeholder="Recherchez une question..." onkeyup="filterFAQs()">
            </div>
        </div>
        <div class="faq-content">
            {% for faq in faqs %}
            <div class="faq-item">
                <h3 class="faq-question">{{ faq.question }}</h3>
                <p class="faq-answer">{{ faq.answer }}</p>
            </div>
            {% else %}
            <p class="no-faq-message">Aucune question pour le moment</p>
            {% endfor %}
        </div>
    </div>
</section>


{% endblock %}