@use('Illuminate\Support\Arr')
@use('Illuminate\Support\Str')

<div class="container my-3" style="max-width:800px">
    <x-slot:title>Révisions</x-slot>

    <div class="accordion mb-3" id="accordionRevision">
        @foreach($groupItems as $group=>$items)  
            <div class="accordion-item">
                <h2 class="accordion-header sticky-top">
                <button class="accordion-button collapsed " type="button" data-bs-toggle="collapse" data-bs-target="#collapse-{{ Str::slug($group) }}" aria-expanded="false" aria-controls="collapseTwo">
                    {{ Arr::first($items)->category?->name }}
                </button>
                </h2>
                <div id="collapse-{{ Str::slug($group) }}" class="accordion-collapse collapse" data-bs-parent="#accordionRevision">
                <div class="accordion-body p-0">
                    
                    <table class="table" style="border:none">
                        <tbody class="fs-4">
                    
                        @foreach($items as $item)
                            <tr>
                                <td width="50%"><small>{{ $item->question }}</small></td>
                                <td><small><span class="fst-italic text-black-50">{{ $item->response }}</span></small></td>
                            </tr>
                        @endforeach

                        </tbody>
                    </table>
                </div>
                </div>
            </div>
        @endforeach
    </div>

    <p class="text-center">
        <a href="{{ route('home') }}">Retour</a>
    </p>


</div>