{# Per-check results grouped by run (for HTMX inline expansion) #}
{% if runs %}
{% set hx_base = "/partials/check-results/" ~ slug %}
{% set next_dir = "desc" if (dir == "asc") else "asc" %}
<div class="flex flex-col gap-2">
    {% for run in runs %}
    <details class="border border-base-300 rounded-box">
        <summary class="px-3 py-2 cursor-pointer hover:bg-base-200 flex items-center gap-3 text-sm">
            <span class="badge badge-ghost badge-xs">{{ run.triggered_by }}</span>
            <span class="opacity-30">│</span>
            {% if run.pass_count %}
            <span class="text-success"><i class="fa-solid fa-check"></i> {{ run.pass_count }}</span>
            {% endif %}
            {% if run.fail_count %}
            {% if severity == 'warning' %}
            <span class="text-warning"><i class="fa-solid fa-triangle-exclamation"></i> {{ run.fail_count }}</span>
            {% else %}
            <span class="text-error"><i class="fa-solid fa-xmark"></i> {{ run.fail_count }}</span>
            {% endif %}
            {% endif %}
            <span class="opacity-30">│</span>
            <span class="font-mono-nums opacity-70">{{ time_ago(run.started_at) }}</span>
        </summary>
        <div class="max-h-72 overflow-y-auto">
        <table class="table table-xs w-full">
            <thead class="sticky top-0 bg-base-200 z-10">
                <tr class="text-xs uppercase tracking-wider">
                    <th>Repository</th>
                    <th>Branch</th>
                    <th class="text-center">Status</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                {% for r in run.results %}
                <tr class="hover">
                    <td><a href="/repo/{{ r.repo_full_name }}" class="link link-hover text-sm">{{ r.repo_full_name }}</a></td>
                    <td class="font-mono text-xs">{{ r.branch }}</td>
                    <td class="text-center">
                        {% if r.passed %}
                        <i class="fa-solid fa-check status-icon status-icon-pass" title="pass"></i>
                        {% elif severity == "warning" %}
                        <i class="fa-solid fa-triangle-exclamation status-icon status-icon-pending" title="warning"></i>
                        {% else %}
                        <i class="fa-solid fa-xmark status-icon status-icon-fail" title="fail"></i>
                        {% endif %}
                    </td>
                    <td>
                        <button class="btn btn-ghost btn-xs"
                                hx-get="/partials/check-output/{{ r.id }}"
                                hx-target="#inline-check-output-{{ r.id }}"
                                hx-swap="innerHTML"
                                hx-on::before-request="var t = document.getElementById('inline-check-output-{{ r.id }}'); if(t.innerHTML.trim()) { t.innerHTML = ''; event.preventDefault(); }">
                            Output
                        </button>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" id="inline-check-output-{{ r.id }}" class="p-0"></td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        </div>
    </details>
    {% endfor %}
</div>
{% else %}
<div class="text-center py-4 opacity-50 text-sm">No results for this check.</div>
{% endif %}