{% if runs %}
    {% for run in runs %}
    <tr class="hover">
        <td class="id-truncated">{{ run.id[:8] }}</td>
        <td>
            <span class="badge badge-sm badge-outline badge-primary uppercase text-[0.65rem]">
                {{ run.module }}
            </span>
        </td>
        <td>{{ run.name or "—" }}</td>
        <td>
            <span class="badge badge-sm
                {% if run.status.name == 'COMPLETED' %}badge-success
                {% elif run.status.name == 'RUNNING' %}badge-info
                {% elif run.status.name == 'FAILED' %}badge-error
                {% elif run.status.name == 'CANCELLED' %}badge-warning
                {% else %}badge-ghost{% endif %}">
                {{ run.status.name }}
            </span>
        </td>
        <td class="id-truncated">{{ run.target_id[:8] if run.target_id else "—" }}</td>
        <td class="text-xs text-base-content/50">
            {{ run.started_at.strftime('%Y-%m-%d %H:%M') if run.started_at else "—" }}
        </td>
    </tr>
    {% endfor %}
{% else %}
    <tr>
        <td colspan="6">
            <div class="empty-state">
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-8 h-8">
                    <path stroke-linecap="round" stroke-linejoin="round" d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.347a1.125 1.125 0 0 1 0 1.972l-11.54 6.347a1.125 1.125 0 0 1-1.667-.986V5.653Z" />
                </svg>
                <p class="text-sm mt-2">No runs found. Start a workflow to see runs here.</p>
            </div>
        </td>
    </tr>
{% endif %}