{% extends "admin/change_list.html" %}
{% load i18n %}

{% block result_list %}

{# ── Summary Banner ── #}
{% if summary %}
<div style="
    display:flex;gap:12px;flex-wrap:wrap;
    margin-bottom:16px;padding:12px 16px;
    background:#f8f9fa;border:1px solid #dee2e6;border-radius:6px;
">
  {% with items=summary %}
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#333;">{{ items.total }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Total</div>
  </div>
  <div style="width:1px;background:#dee2e6;"></div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#2e7d32;">{{ items.active }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Active</div>
  </div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#1565c0;">{{ items.approved }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Approved</div>
  </div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#6a1b9a;">{{ items.converted }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Converted</div>
  </div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#b71c1c;">{{ items.expired }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Expired</div>
  </div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#4e342e;">{{ items.closed }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Closed</div>
  </div>
  <div style="text-align:center;min-width:80px;">
    <div style="font-size:22px;font-weight:700;color:#888;">{{ items.draft }}</div>
    <div style="font-size:11px;color:#666;text-transform:uppercase;">Draft</div>
  </div>
  {% endwith %}
</div>
{% endif %}

{# ── Original table ── #}
{{ block.super }}
{% endblock %}