{# Expense-account grid -- fully template-driven. A single for-loop over the per-row
   view-models (bulk-code/account-row-vm), each delegating to account-row.html. Replaces
   the Clojure data-grid / data-grid-row / data-grid-cell composition. The trailing
   "New account" button posts the whole #bulk-code-form (op=new-account). #}
<div class="shrink overflow-y-scroll">
  <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400 shrink">
    <thead class="text-xs text-gray-800 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400 group-[.raw]:sticky group-[.raw]:z-10 group-[.raw]:top-0">
      <tr>
        <th class="px-4 py-3" scope="col">Account</th>
        <th class="px-4 py-3 w-32" scope="col">Location</th>
        <th class="px-4 py-3 w-16" scope="col">%</th>
        <th class="px-4 py-3 w-16" scope="col"></th>
      </tr>
    </thead>
    <tbody>
      {% for row in rows %}{% include "templates/transaction-bulk-code/account-row.html" %}{% endfor %}
      <tr class="new-row border-b dark:border-gray-600 group hover:bg-gray-100 dark:hover:bg-gray-700">
        <td class="px-4 py-2" colspan="4">{{ new_account_button|safe }}</td>
      </tr>
    </tbody>
  </table>
</div>