{% if migrations and migrations | length > 0 %}
<span id="mig-badge-{{ slug }}" hx-swap-oob="true"
      class="badge badge-sm badge-warning">
  ○ {{ migrations | length }} migration{% if migrations | length > 1 %}s{% endif %}
</span>
<details class="collapse collapse-arrow bg-warning/10 border border-warning/30 rounded-lg">
  <summary class="collapse-title text-xs font-semibold py-2 min-h-0 px-3 cursor-pointer text-warning">
    ○ Pending migrations
  </summary>
  <div class="collapse-content px-3 pb-3">
    <div class="space-y-1">
      {% for m in migrations %}
      <div class="flex gap-2 items-start">
        <span class="badge badge-xs badge-warning font-mono flex-shrink-0 mt-0.5">{{ m.id }}</span>
        <span class="text-xs text-base-content/70">{{ m.description }}</span>
      </div>
      {% endfor %}
    </div>
    <p class="text-xs text-base-content/40 mt-2">Run <code class="font-mono">ontoref migrate show &lt;id&gt;</code> for instructions.</p>
  </div>
</details>
{% endif %}