{% extends "admin_base" %}
{% block title %}{{ resource.title | default(value="Éléments") }}{% endblock %}
{% block breadcrumb %}
  <span class="breadcrumb-sep">/</span>
  <a href="/admin">{% if admin_list_breadcrumb_admin %}{{ admin_list_breadcrumb_admin }}{% endif %}</a>
  <span class="breadcrumb-sep">/</span>
  <span>{{ resource.title | default(value="Éléments") }}</span>
{% endblock %}
{% block content %}
  {% set_global can_create = false %}
  {% if current_user %}
    {% if current_user.is_superuser %}{% set_global can_create = true %}
    {% else %}{% for role in current_user.roles %}{% if role in resource.permissions.create %}{% set_global can_create = true %}{% endif %}{% endfor %}{% endif %}
  {% endif %}
  <div class="page-header">
    <div>
      <h1 class="page-title">{{ resource.title | default(value="Éléments") }}</h1>
      <p class="page-subtitle">{{ total | default(value=0) }} {% if admin_list_entries_count %}{{ admin_list_entries_count }}{% endif %}</p>
    </div>
    {% if can_create %}
    <a href="/admin/{{ resource.key }}/create" class="btn btn-primary">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="15" height="15">
        <line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
      </svg>
      {% if admin_list_btn_create %}{{ admin_list_btn_create }}{% endif %}
    </a>
    {% endif %}
  </div>

  {# ── Barre de recherche + bouton filtres ── #}
  {% set has_filters = resource.display.list_filter | length > 0 %}
  <div class="admin-search-row">
    <form method="GET" action="" class="admin-search-form">
      <div class="admin-search-wrapper">
        <input
          type="text"
          name="search"
          value="{{ search }}"
          placeholder="{% if admin_list_search_placeholder %}{{ admin_list_search_placeholder }}{% else %}Search...{% endif %}"
          class="admin-search-input"
        >
        {% if sort_by %}<input type="hidden" name="sort_by" value="{{ sort_by }}">{% endif %}
        {% if sort_dir %}<input type="hidden" name="sort_dir" value="{{ sort_dir }}">{% endif %}
        {% for col, val in active_filters %}<input type="hidden" name="filter_{{ col }}" value="{{ val | escape }}">{% endfor %}
        <button type="submit" class="btn btn-secondary admin-search-btn">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14">
            <circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>
          </svg>
        </button>
        {% if search %}
        <a href="?{% if sort_by %}sort_by={{ sort_by }}&sort_dir={{ sort_dir }}{% endif %}{{ filter_qs }}" class="btn btn-secondary">✕</a>
        {% endif %}
      </div>
    </form>
    {% if has_filters %}
    <button class="btn btn-ghost btn-icon mobile-filter-toggle" id="mobileFilterToggle" type="button" aria-label="Filtres">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="18" height="18">
        <line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="15" y2="12"/><line x1="3" y1="18" x2="9" y2="18"/>
      </svg>
      {% if active_filters %}<span class="filter-badge">{{ active_filters | length }}</span>{% endif %}
    </button>
    {% endif %}
  </div>
  <div class="{% if has_filters %}admin-list-layout{% endif %}">

    {# ── Colonne principale : card + pagination ── #}
    <div>
      <div class="card">
        {% if entries is defined and entries | length > 0 %}
          <div class="admin-table-wrapper">
            <table class="admin-table">
              <thead>
                <tr>
                  <th>
                    <a href="?sort_by=id&sort_dir={% if sort_by == "id" %}{{ sort_dir_toggle }}{% else %}asc{% endif %}{% if search %}&search={{ search | urlencode }}{% endif %}&page=1" class="th-sort-link">
                      {% if admin_list_th_id %}{{ admin_list_th_id }}{% endif %}
                      {% if sort_by == "id" %}<span class="sort-indicator">{% if sort_dir == "asc" %}▲{% else %}▼{% endif %}</span>{% endif %}
                    </a>
                  </th>
                  {% for col in visible_columns %}
                    <th>
                      <a href="?sort_by={{ col }}&sort_dir={% if sort_by == col %}{{ sort_dir_toggle }}{% else %}asc{% endif %}{% if search %}&search={{ search | urlencode }}{% endif %}&page=1" class="th-sort-link">
                        {% if column_labels[col] %}{{ column_labels[col] }}{% else %}{{ col }}{% endif %}
                        {% if sort_by == col %}<span class="sort-indicator">{% if sort_dir == "asc" %}▲{% else %}▼{% endif %}</span>{% endif %}
                      </a>
                    </th>
                  {% endfor %}
                  <th class="th-right">{% if admin_list_th_actions %}{{ admin_list_th_actions }}{% endif %}</th>
                </tr>
              </thead>
              <tbody>
                {% for entry in entries %}
                  <tr>
                    <td><span class="id-badge">#{{ entry.id }}</span></td>
                    {% for col in visible_columns %}
                      {% set value = entry[col] %}
                      <td class="td-data">
                        {% if value == true %}
                          <span class="badge badge-green">{% if admin_list_bool_true %}{{ admin_list_bool_true }}{% endif %}</span>
                        {% elif value == false %}
                          <span class="badge badge-neutral">{% if admin_list_bool_false %}{{ admin_list_bool_false }}{% endif %}</span>
                        {% elif value %}
                          <span class="td-content">{% if value is string %}{{ value | escape }}{% else %}{{ value }}{% endif %}</span>
                        {% else %}
                          <span class="text-muted">—</span>
                        {% endif %}
                      </td>
                    {% endfor %}
                    <td class="td-actions">
                      {% set_global can_modify = false %}
                      {% if current_user %}
                        {% if current_user.is_superuser %}{% set_global can_modify = true %}
                        {% else %}{% for role in current_user.roles %}{% if role in resource.permissions.edit %}{% set_global can_modify = true %}{% endif %}{% endfor %}{% endif %}
                      {% endif %}
                      <div class="row-menu">
                        <button class="row-menu-trigger" type="button" aria-haspopup="true" aria-expanded="false">
                          <svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16">
                            <circle cx="12" cy="5" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="12" cy="19" r="1.5"/>
                          </svg>
                        </button>
                        <div class="row-menu-dropdown">
                          <a href="/admin/{{ resource.key }}/{{ entry.id }}/detail" class="row-menu-item">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
                            {% if admin_list_btn_detail %}{{ admin_list_btn_detail }}{% endif %}
                          </a>
                          {% if current_user and can_modify %}
                          <a href="/admin/{{ resource.key }}/{{ entry.id }}/edit" class="row-menu-item">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
                            {% if admin_list_btn_edit %}{{ admin_list_btn_edit }}{% endif %}
                          </a>
                          <div class="row-menu-separator"></div>
                          <form method="POST" action="/admin/{{ resource.key }}/{{ entry.id }}/delete">
                            <button type="submit" class="row-menu-item row-menu-danger"
                                    data-confirm-delete="{% if admin_list_confirm_delete %}{{ admin_list_confirm_delete }}{% else %}Vraiment supprimer ?{% endif %}">
                              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14H6L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/><path d="M9 6V4h6v2"/></svg>
                              {% if admin_list_btn_delete %}{{ admin_list_btn_delete }}{% endif %}
                            </button>
                          </form>
                          {% endif %}
                        </div>
                      </div>
                    </td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
        {% else %}
          <div class="empty-state">
            <svg class="empty-state-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
              <path d="M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2"/>
              <rect x="9" y="3" width="6" height="4" rx="1"/>
            </svg>
            <p class="empty-state-title">{% if admin_list_empty_title %}{{ admin_list_empty_title }}{% endif %}</p>
            <p class="empty-state-desc">{% if admin_list_empty_desc %}{{ admin_list_empty_desc }}{% endif %}</p>
            {% if can_create %}<a href="/admin/{{ resource.key }}/create" class="btn btn-primary mt-sm">{% if admin_list_btn_create_first %}{{ admin_list_btn_create_first }}{% endif %}</a>{% endif %}
          </div>
        {% endif %}
      </div>
      {% if page_count is defined and page_count > 1 %}
      <div class="pagination">
        {% if has_prev %}
          <a href="?page={{ prev_page }}{% if sort_by %}&sort_by={{ sort_by }}&sort_dir={{ sort_dir }}{% endif %}{% if search %}&search={{ search | urlencode }}{% endif %}{{ filter_qs }}" class="btn btn-sm btn-secondary">&laquo;</a>
        {% else %}
          <span class="btn btn-sm btn-secondary disabled">&laquo;</span>
        {% endif %}
        <span class="pagination-info">{{ page }} / {{ page_count }}</span>
        {% if has_next %}
          <a href="?page={{ next_page }}{% if sort_by %}&sort_by={{ sort_by }}&sort_dir={{ sort_dir }}{% endif %}{% if search %}&search={{ search | urlencode }}{% endif %}{{ filter_qs }}" class="btn btn-sm btn-secondary">&raquo;</a>
        {% else %}
          <span class="btn btn-sm btn-secondary disabled">&raquo;</span>
        {% endif %}
      </div>
      {% endif %}
    </div>

    {# ── Sidebar filtres (droite) ── #}
    {% if has_filters %}
    <div class="filter-sidebar-overlay" id="filterOverlay"></div>
  <aside class="admin-filter-sidebar" id="filterSidebar" data-resource="{{ resource.key }}">
      <div class="filter-sidebar-header">
        <span class="filter-sidebar-title">Filtres</span>
        <button class="sidebar-toggle" id="filterToggle" title="Masquer les filtres">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
            <polyline points="9 18 15 12 9 6"/>
          </svg>
        </button>
      </div>
      <div class="filter-sidebar-body">
        {% for filter_entry in resource.display.list_filter %}
          {% set col = filter_entry[0] %}
          {% set label = filter_entry[1] %}
          {% set values = filter_values[col] %}
          {% set meta = filter_meta[col] %}
          {% if values and values | length > 0 %}
          <div class="filter-group" data-filter-col="{{ col }}">
            <button class="filter-group-title" type="button" aria-expanded="true">
              {{ label }}
              <svg class="filter-group-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="12" height="12">
                <polyline points="6 9 12 15 18 9"/>
              </svg>
            </button>
            <div class="filter-group-body">
              {% if active_filters[col] %}
              <a href="?{% if sort_by %}sort_by={{ sort_by }}&sort_dir={{ sort_dir }}&{% endif %}{% if search %}search={{ search | urlencode }}&{% endif %}page=1" class="filter-option filter-clear">✕ Tout</a>
              {% endif %}
              {% for val in values %}
                {% set is_active = active_filters[col] == val %}
                <a href="?filter_{{ col }}={{ val | urlencode }}{% if sort_by %}&sort_by={{ sort_by }}&sort_dir={{ sort_dir }}{% endif %}{% if search %}&search={{ search | urlencode }}{% endif %}&page=1"
                    class="filter-option {% if is_active %}filter-active{% endif %}">
                  {{ val }}
                </a>
              {% endfor %}
              {% if meta.total_pages > 1 %}
              <div class="filter-pagination">
                {% if meta.has_prev %}
                  <a href="?{{ meta.prev_qs }}&page=1" class="filter-page-btn">&#8249;</a>
                {% else %}
                  <span class="filter-page-btn disabled">&#8249;</span>
                {% endif %}
                <span class="filter-page-info">{{ meta.current_page + 1 }} / {{ meta.total_pages }}</span>
                {% if meta.has_next %}
                  <a href="?{{ meta.next_qs }}&page=1" class="filter-page-btn">&#8250;</a>
                {% else %}
                  <span class="filter-page-btn disabled">&#8250;</span>
                {% endif %}
              </div>
              {% endif %}
            </div>
          </div>
          {% endif %}
        {% endfor %}
      </div>
    </aside>
    {% endif %}

  </div>{# fin admin-list-layout #}
  <script nonce="{{ csp_nonce }}" src="{{ "js/admin/admin-actions.js" | runique_static }}"></script>
  <script nonce="{{ csp_nonce }}" src="{{ "js/admin/admin-kebab.js" | runique_static }}"></script>
  <script nonce="{{ csp_nonce }}" src="{{ "js/admin/admin-list.js" | runique_static }}"></script>
{% endblock %}