@php
    use Illuminate\Pagination\LengthAwarePaginator;

    $items = $assignments instanceof LengthAwarePaginator
        ? collect($assignments->items())
        : collect($assignments ?? []);

    $groupedByBusiness = $items->groupBy(function ($assignment) {
        return $assignment->business_id ?? 'no-business';
    });

@endphp

<style>
    .ip-accordion-wrap {
        display: grid;
        gap: 14px;
    }
    .ip-business-section {
        border: 1px solid #e3e8f2;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 2px 8px rgba(27, 41, 72, 0.04);
        overflow: hidden;
    }
    .ip-business-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 16px;
        cursor: pointer;
        list-style: none;
        background: linear-gradient(180deg, #fbfcff 0%, #f5f8ff 100%);
    }
    .ip-business-summary::-webkit-details-marker {
        display: none;
    }
    .ip-business-title {
        font-weight: 700;
        font-size: 17px;
        color: #1f2d4d;
    }
    .ip-business-subtitle {
        margin-top: 3px;
        font-size: 12px;
        color: #5d6b86;
    }
    .ip-business-meta {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #5d6b86;
        font-size: 12px;
    }
    .ip-business-body {
        padding: 12px 14px 14px;
        border-top: 1px solid #edf1f7;
        background: #ffffff;
    }
    .ip-assignment-card {
        border: 1px solid #e9edf5;
        border-radius: 10px;
        padding: 12px;
        background: #fcfdff;
    }
    .ip-assignment-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 10px;
    }
    .ip-assignment-meta {
        font-size: 12px;
        color: #5f6b82;
    }
    .ip-status-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(140px, 1fr));
        gap: 8px;
        margin-bottom: 10px;
    }
    .ip-status-item {
        border: 1px solid #e7ecf6;
        border-radius: 8px;
        padding: 8px;
        background: #fff;
        text-align: center;
    }
    .ip-status-item .label {
        display: block;
        margin-bottom: 5px;
        font-size: 11px;
        color: #667593;
    }
    .ip-calls-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 12px;
    }
    .ip-calls-table th,
    .ip-calls-table td {
        padding: 7px 8px;
        border-bottom: 1px solid #edf2f8;
        text-align: left;
        vertical-align: middle;
    }
    .ip-calls-table th {
        color: #61708b;
        font-weight: 600;
        background: #f8faff;
    }
    .ip-actions {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .ip-empty {
        border: 1px dashed #d9e1ee;
        border-radius: 10px;
        padding: 18px;
        text-align: center;
        color: #667593;
        background: #fbfcff;
    }
    @media (max-width: 768px) {
        .ip-status-grid {
            grid-template-columns: 1fr;
        }
    }
</style>

<div class="ip-accordion-wrap">
    @forelse($groupedByBusiness as $businessAssignments)
        @php
            $first = $businessAssignments->first();
            $businessName = $first?->business?->name ?? 'Unknown Business';
            $totalCalls = $businessAssignments->sum(fn ($a) => $a->calls->count());
            $completedCalls = $businessAssignments->sum(function ($assignment) {
                return $assignment->calls->filter(function ($call) {
                    return $call->mystery_status === 'completed'
                        && $call->access_status === 'completed'
                        && $call->quality_status === 'completed';
                })->count();
            });
            $sectors = $businessAssignments->pluck('sector.name')->filter()->unique()->implode(', ');
            $months = $businessAssignments->pluck('month')->filter()->unique()->implode(', ');
        @endphp

        <details class="ip-business-section">
            <summary class="ip-business-summary">
                <div>
                    <div class="ip-business-title">{{ $businessName }}</div>
                    <div class="ip-business-subtitle">
                        {{ $sectors ?: 'N/A' }} | {{ $months ?: 'N/A' }}
                    </div>
                </div>
            </summary>

            <div class="ip-business-body">
                @foreach($businessAssignments as $assignment)
                    @php
                        $calls = $assignment->calls->sortBy(fn ($call) => $call->call_number ?? $call->id)->values();
                    @endphp

                    <div class="ip-assignment-card {{ $loop->last ? '' : 'mb-2' }}">
                        <div class="ip-assignment-top">
                            <div class="ip-assignment-meta">
                                Assignment #{{ $assignment->id }} | {{ str_replace('-', '/', (string) $assignment->month) }}
                            </div>
                            <div class="ip-actions">
                                <a class="btn btn-sm btn-outline-primary"
                                   href="{{ route('manager.override', ['assignmentId' => $assignment->id]) }}">
                                    Review & Override
                                </a>
                                <a class="btn btn-sm btn-outline-secondary"
                                   href="{{ route('platform.manager.access.detailed.report', ['mystery_assignment_id' => $assignment->id]) }}">
                                    Access Report
                                </a>
                                <a class="btn btn-sm btn-outline-secondary"
                                   href="{{ route('platform.manager.quality.detailed.report', ['mystery_assignment_id' => $assignment->id]) }}">
                                    Quality Report
                                </a>
                            </div>
                        </div>

                        <table class="ip-calls-table">
                            <thead>
                                <tr>
                                    <th>Call</th>
                                    <th>Scenario</th>
                                    <th>Mystery Shopper</th>
                                    <th>Access Assessor</th>
                                    <th>Quality Assessor</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($calls as $call)
                                    <tr>
                                        <td>{{ $call->call_number ?? $loop->iteration }}</td>
                                        <td>{{ $call->scenario_number ?? 'N/A' }}</td>
                                        <td>{{ $call->mysteryShopper->name ?? 'N/A' }}</td>
                                        <td>{{ $call->assessorAccess->name ?? 'N/A' }}</td>
                                        <td>{{ $call->assessorQuality->name ?? 'N/A' }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="5" class="text-muted">No calls found</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                @endforeach
            </div>
        </details>
    @empty
        <div class="ip-empty">No completed assignments found for the selected filters.</div>
    @endforelse

    @if($assignments instanceof LengthAwarePaginator)
        <div>
            {{ $assignments->links('pagination::bootstrap-4') }}
        </div>
    @endif
</div>