<%= turbo_frame_tag "categorize_transaction_list" do %>
  <div class="bg-container-inset rounded-xl p-1 space-y-1">
    <%# Header — same grid template and padding as each row %>
    <div class="grid grid-cols-[1rem_1fr_5rem_6rem_6.5rem] gap-3 px-5 py-2 text-xs font-medium text-secondary uppercase tracking-wide">
      <div></div>
      <p><%= t("transactions.categorizes.show.col_transaction") %></p>
      <p><%= t("transactions.categorizes.show.col_date") %></p>
      <p class="text-right"><%= t("transactions.categorizes.show.col_amount") %></p>
      <p><%= t("transactions.categorizes.show.col_category") %></p>
    </div>
    <%# Rows %>
    <div class="shadow-border-xs rounded-lg overflow-hidden">
      <div class="max-h-[32rem] overflow-y-auto divide-y divide-primary text-sm">
        <% entries.each do |entry| %>
          <%= render partial: "transactions/categorizes/entry_row", locals: { entry: entry, categories: categories } %>
        <% end %>
      </div>
    </div>
  </div>
<% end %>
