@php
    $leaves = $root->leafProcedures();
    $total  = $leaves->count();
    $passed = $leaves->filter(fn ($p) => (bool) $p->loadedAssessmentsFor($userId)->first()?->isPassing())->count();
    $pct    = $total > 0 ? round($passed / $total * 100) : 0;
    $done   = $total > 0 && $passed === $total;
@endphp

<div class="proc-group card mb-2" data-group>
    <button class="proc-group-header" type="button" data-bs-toggle="collapse"
            data-bs-target="#grp{{ $root->id }}" aria-expanded="true">
        <i class="bi bi-chevron-right proc-chevron"></i>

        <span class="proc-group-title">
            @if($root->code)<span class="proc-code">{{ $root->code }}</span>@endif
            {{ $root->name }}
        </span>

        <span class="proc-group-meta">
            @if($done)
            <span class="badge bg-success-subtle text-success-emphasis"><i class="bi bi-check2-all me-1"></i>Complete</span>
            @endif
            <span class="proc-mini-bar" title="{{ $passed }} of {{ $total }} passed">
                <span style="width: {{ $pct }}%"></span>
            </span>
            <span class="proc-count">{{ $passed }}/{{ $total }}</span>
        </span>
    </button>

    <div id="grp{{ $root->id }}" class="collapse show">
        <div class="table-responsive">
            <table class="table proc-table mb-0 align-middle">
                <thead>
                    <tr>
                        <th>Procedure</th>
                        <th class="text-center" style="width:6rem">Score</th>
                        <th class="text-center" style="width:9rem">Status</th>
                        <th class="d-none d-md-table-cell" style="width:8rem">Last assessed</th>
                        <th class="text-end" style="width:5rem">History</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($root->children as $child)
                        @if($child->children->isNotEmpty())
                        <tr class="proc-subgroup">
                            <td colspan="5">{{ $child->name }}</td>
                        </tr>
                            @foreach($child->children as $leaf)
                            @include('student.logbook._procedure-row', ['procedure' => $leaf, 'userId' => $userId])
                            @endforeach
                        @else
                        @include('student.logbook._procedure-row', ['procedure' => $child, 'userId' => $userId])
                        @endif
                    @endforeach
                </tbody>
            </table>
        </div>
        <div class="proc-empty d-none">
            <i class="bi bi-search me-1"></i>No procedures match your filters in this section.
        </div>
    </div>
</div>