<div class="board">
    {% for col_name, col_status in [("Pending", "pending"), ("Claimed", "claimed"), ("Done", "done"), ("Failed", "failed"), ("Blocked", "blocked")] %}
    <div class="column">
        <div class="column-header">
            {{ col_name }}
            <span class="count">{{ tasks_by_status.get(col_status, [])|length }}</span>
        </div>
        {% for task in tasks_by_status.get(col_status, []) %}
        <div class="card status-{{ task.status }}"
             hx-get="/dashboard/api/task/{{ task.id }}"
             hx-target="#task-detail"
             hx-swap="innerHTML">
            <div class="task-id">{{ task.id }}</div>
            <div class="task-title">{{ task.title }}</div>
            <span class="badge badge-{{ task.priority }}">{{ task.priority }}</span>
            {% if task.assignee %}<span style="font-size:0.75rem; color:var(--text-muted)">{{ task.assignee }}</span>{% endif %}
        </div>
        {% endfor %}
    </div>
    {% endfor %}
</div>
