@php
    $totalFiltered = $table_detail->count();
    $totalWithScore = $table_detail->filter(fn($item) => (int) ($item->with_score ?? 0) === 1)->count();
    $totalWithoutScore = $table_detail->filter(fn($item) => (int) ($item->with_score ?? 0) !== 1)->count();
    $totalEvaluated = $table_detail->filter(fn($item) => ($item->evaluation_status ?? 'PENDING') === 'EVALUATED')->count();
@endphp

<div class="row px-4 pb-2 g-3">
    <div class="col-md-4 col-sm-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-body p-3">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <p class="text-xxs text-uppercase text-secondary font-weight-bolder mb-1">Total Data (Filter)</p>
                        <h4 class="font-weight-bolder text-dark mb-0">{{ $totalFiltered }}</h4>
                    </div>
                    <span class="badge bg-light text-dark border">
                        <i class="fas fa-table"></i>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4 col-sm-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-body p-3">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <p class="text-xxs text-uppercase text-secondary font-weight-bolder mb-1">With Score</p>
                        <h4 class="font-weight-bolder text-success mb-0">{{ $totalWithScore }}</h4>
                    </div>
                    <span class="badge bg-success text-white">
                        <i class="fas fa-check-circle"></i>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4 col-sm-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-body p-3">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <p class="text-xxs text-uppercase text-secondary font-weight-bolder mb-1">Without Score</p>
                        <h4 class="font-weight-bolder text-secondary mb-0">{{ $totalWithoutScore }}</h4>
                    </div>
                    <span class="badge bg-secondary text-white">
                        <i class="fas fa-minus-circle"></i>
                    </span>
                </div>
            </div>
        </div>
    </div>
    </div>
</div>