{# One "My Loans" table row. Context: loan, notice (opt), error (opt),
   hide_actions (opt) — csrf_token/user provided by _render. Swapped whole
   via hx-swap="outerHTML" so success AND failure keep the row intact. #}
<tr id="loan-{{ loan.id }}">
  <td data-label="Barcode"><code>{{ loan.item.barcode }}</code></td>
  <td data-label="Title"><a href="/ui/catalog/{{ loan.item.work_id }}">{{ loan.item.work.title }}</a></td>
  <td data-label="Due">
    {{ loan.due_at.strftime("%Y-%m-%d") if loan.due_at else "—" }}
    {% if loan.renewal_count %}<small>(renewal {{ loan.renewal_count | int }})</small>{% endif %}
  </td>
  <td data-label="" style="display:flex; gap:0.5rem; flex-wrap:wrap; align-items:center">
    {% if not hide_actions %}
    <form
      hx-post="/ui/me/loans/{{ loan.id }}/renew"
      hx-target="#loan-{{ loan.id }}"
      hx-swap="outerHTML"
      hx-include="[name='csrf_token']"
      style="margin:0"
    >
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="outline" style="padding:0.2rem 0.6rem">Renew</button>
    </form>
    {% if has_permission(user, 'loan.claim.self') %}
    <form
      hx-post="/ui/me/loans/{{ loan.id }}/claim-returned"
      hx-target="#loan-{{ loan.id }}"
      hx-swap="outerHTML"
      hx-include="[name='csrf_token']"
      hx-confirm="Tell the library you returned this item? A librarian will investigate and confirm."
      style="margin:0"
    >
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="outline contrast" style="padding:0.2rem 0.6rem">I returned this</button>
    </form>
    {% endif %}
    {% endif %}
    {% if notice %}<em>{{ notice }}</em>{% endif %}
    {% if error %}<span class="error-banner" role="alert" style="padding:0.2rem 0.6rem">{{ error }}</span>{% endif %}
  </td>
</tr>