{% extends 'base.html' %}

{% block title %}FAQ · Back-office{% endblock %}

{% block content %}
<section class="section">
  <div class="container">
    <div class="panel">
      <div style="display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap">
        <h2 style="margin:0">FAQ</h2>
        <div style="display:flex;gap:10px;flex-wrap:wrap">
          <a class="btn" href="{{ url_for('web.backoffice_home') }}">Dashboard</a>
          <a class="btn btn-primary" href="{{ url_for('web.bo_faqs_create') }}">Nouvelle FAQ</a>
        </div>
      </div>

      <div class="grid" style="margin-top:14px">
        {% for f in items %}
          <div class="card">
            <h3>{{ f.position }} · {{ f.question }}</h3>
            <p style="white-space:pre-wrap">{{ f.answer[:160] }}{% if f.answer|length > 160 %}...{% endif %}</p>
            <div class="meta">
              <span>{% if f.published %}Publié{% else %}Masqué{% endif %}</span>
            </div>
            <div style="margin-top:12px;display:flex;gap:10px;flex-wrap:wrap">
              <a class="btn" href="{{ url_for('web.bo_faqs_edit', faq_id=f.id) }}">Modifier</a>
              <form method="post" action="{{ url_for('web.bo_faqs_delete', faq_id=f.id) }}">
                <button class="btn" type="submit">Supprimer</button>
              </form>
            </div>
          </div>
        {% else %}
          <div class="alert">Aucune FAQ.</div>
        {% endfor %}
      </div>
    </div>
  </div>
</section>
{% endblock %}