{# M5 — 통일성/페널티 상세 모달 fragment (Task 3.15).
   HTMX 가 #usage-modal 에 swap. 오버레이 클릭 or 닫기 버튼으로 닫기. #}
<div class="modal-overlay" @click.self="document.getElementById('usage-modal').innerHTML=''" x-data>
  <div class="modal-content">
    <button class="modal-close"
            @click="document.getElementById('usage-modal').innerHTML=''"
            aria-label="{{ _('Close') }}">✕</button>

    <h2>{{ _("Consistency / penalty details") }}</h2>
    <p class="usage-detail-window">
      {{ _("Last") }} {{ (summary.window_seconds // 86400) }} {{ _("day usage summary") }}
    </p>

    {% if summary.top_packs %}
      <h3>{{ _("Top adopted packs") }}</h3>
      <ul class="usage-pack-list">
        {% for p in summary.top_packs %}
          <li class="usage-pack-item">
            <span class="usage-pack-name">{{ p.pack_name or p.pack_id }}</span>
            <span class="usage-pack-count">{{ p.uses }} {{ _("times") }}</span>
          </li>
        {% endfor %}
      </ul>
    {% else %}
      <p class="usage-empty">{{ _("No packs adopted yet.") }}</p>
    {% endif %}

    <p class="usage-rejected">
      {{ _("Rejections") }}: <strong>{{ summary.rejected_count }}</strong>
    </p>
  </div>
</div>