@section('title', 'Kategori Penelitian')
<div>
    <div class="d-flex align-items-center">
        <div class="p-0 m-0">
            <h3 class="fw-semibold mb-0">Kategori Penelitian</h3>
        </div>
    </div>
    <hr class="my-3">
    <div class="row g-3">
        @foreach ($research_categories as $result)
            <div class="col-12 col-lg-4">
                <div class="card h-100 cursor-pointer" wire:click="detail('{{ $result->id }}')">
                    <div class="card-header">
                        <div class="d-flex align-items-start">
                            <div>
                                <h4 class="mb-0">{{ Str::limit($result->name, 33) }}</h4>
                                <div class="d-flex gap-3">
                                    <div>
                                        <div>Jumlah Soal : <span class="text-muted">{{ $result->research_questions_count }}</span></div>
                                    </div>
                                </div>
                            </div>
                            {{-- <div class="ms-auto">
                                <div class="dropdown zindex-2">
                                    <button type="button" class="btn dropdown-toggle hide-arrow p-0" data-bs-toggle="dropdown" aria-expanded="false">
                                        <i class="fa-regular fa-ellipsis-vertical fa-fw text-muted"></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li><a class="dropdown-item text-danger" href="javascript:void(0);" wire:click="confirmDelete({{ $result->id }})"><i class="fa-regular fa-trash-alt fa-fw me-1"></i> Hapus Protokol</a></li>
                                    </ul>
                                </div>
                            </div> --}}
                        </div>
                    </div>
                    <div class="card-footer border-top">
                        <div class="d-flex align-items-center">
                            <ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
                                @foreach ($result->researchCompleteds as $research)
                                    @php
                                        $researcher = $research->researchers->where('position', 'ketua')->first()?->researcher;
                                    @endphp
                                    @if ($researcher)
                                        <li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" class="avatar avatar-sm pull-up" aria-label="{{ $researcher->name }}" data-bs-original-title="{{ $researcher->name }}">
                                            <img class="rounded-circle" src="{{ $researcher->photo && Storage::disk('public')->exists($researcher->photo) ? asset('storage/' . $researcher->photo) : asset('assets/image/profile-' . ($researcher->gender ?? 'man') . '.webp') }}" alt="{{ $researcher->name }}" loading="lazy">
                                        </li>
                                    @endif
                                @endforeach
                                <li class="ms-1"><small class="text-muted">{{ $result->research_completeds_count }} Peneliti Telah Mengerjakan Ini.</small></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>
</div>