{{--
    Variables:
    $permissionsByPage  — Collection grouped by page key
    $modulePages        — ['page_key' => 'Display Label']
    $rolePermIds        — array of permission IDs already assigned ([] for create)
    $readonly           — bool: true = show checkmarks only, false = show checkboxes
--}}
@php
    $childPages  = ['manage_inventory', 'manage_orders', 'delivery_team'];
    $actions     = ['Create', 'Read', 'Update', 'Delete'];
@endphp

<div class="table-responsive mt-2">
    <table class="table table-nowrap align-middle">
        <thead class="all-table-head">
            <tr>
                <th class="p-3 table-head-content" style="width:32px;"></th>
                <th class="p-3 table-head-content">Module</th>
                <th class="p-3 table-head-content" colspan="4">Permissions</th>
            </tr>
        </thead>
        <tbody class="list form-check-all">

            {{-- ── Dashboard ─────────────────────────────────── --}}
            @php $page = 'dashboard'; $perms = $permissionsByPage[$page] ?? collect(); @endphp
            <tr>
                <td class="p-3"></td>
                <td class="table-body-content p-3">{{ $modulePages[$page] }}</td>
                <td class="permission p-3">
                    @foreach($actions as $action)
                    @php $perm = $perms->firstWhere('name', $action); @endphp
                    @if($perm)
                    <div class="d-flex flex-row gap-2 align-items-center">
                        @if($readonly)
                            <i class="{{ in_array($perm->id, $rolePermIds) ? 'ri-checkbox-circle-fill text-success' : 'ri-close-circle-line text-danger' }}"
                               style="font-size:16px;"></i>
                            <span class="table-body-content fw-400 mb-0">{{ $action }}</span>
                        @else
                            <input class="form-check-input perm-{{ strtolower($action) }}"
                                   type="checkbox" name="permissions[]" value="{{ $perm->id }}"
                                   id="perm_{{ $perm->id }}"
                                   {{ in_array($perm->id, $rolePermIds) ? 'checked' : '' }}>
                            <label class="table-body-content fw-400 mb-0" for="perm_{{ $perm->id }}">{{ $action }}</label>
                        @endif
                    </div>
                    @endif
                    @endforeach
                </td>
            </tr>

            {{-- ── Product Management (parent header) ──────── --}}
            <tr class="parent-row" data-id="pm">
                <td class="p-3">
                    <img loading="lazy" class="toggle-arrow"
                         src="{{ asset('backend/template/images/svg/down-arrow.svg') }}" alt=""
                         style="width:16px;cursor:pointer;">
                </td>
                <td class="table-body-content p-3 fw-semibold">Product Management</td>
                <td class="p-3"></td>
            </tr>

            {{-- ── Product Management children ─────────────── --}}
            @foreach($childPages as $ci => $page)
            @php
                $perms   = $permissionsByPage[$page] ?? collect();
                $isLast  = $ci === count($childPages) - 1;
            @endphp
            <tr class="child-row child-pm d-none {{ $isLast ? '' : 'border-bottom-none' }} bg-color">
                <td class="p-3"></td>
                <td class="table-body-content p-3" style="padding-left:28px !important;">
                    {{ $modulePages[$page] }}
                </td>
                <td class="permission p-3">
                    @foreach($actions as $action)
                    @php $perm = $perms->firstWhere('name', $action); @endphp
                    @if($perm)
                    <div class="d-flex flex-row gap-2 align-items-center">
                        @if($readonly)
                            <i class="{{ in_array($perm->id, $rolePermIds) ? 'ri-checkbox-circle-fill text-success' : 'ri-close-circle-line text-danger' }}"
                               style="font-size:16px;"></i>
                            <span class="table-body-content fw-400 mb-0">{{ $action }}</span>
                        @else
                            <input class="form-check-input perm-{{ strtolower($action) }}"
                                   type="checkbox" name="permissions[]" value="{{ $perm->id }}"
                                   id="perm_{{ $perm->id }}"
                                   {{ in_array($perm->id, $rolePermIds) ? 'checked' : '' }}>
                            <label class="table-body-content fw-400 mb-0" for="perm_{{ $perm->id }}">{{ $action }}</label>
                        @endif
                    </div>
                    @endif
                    @endforeach
                </td>
            </tr>
            @endforeach

            {{-- ── Remaining standalone modules ────────────── --}}
            @foreach(['manage_content', 'manage_users', 'legal_policy'] as $page)
            @php $perms = $permissionsByPage[$page] ?? collect(); @endphp
            <tr>
                <td class="p-3"></td>
                <td class="table-body-content p-3">{{ $modulePages[$page] }}</td>
                <td class="permission p-3">
                    @foreach($actions as $action)
                    @php $perm = $perms->firstWhere('name', $action); @endphp
                    @if($perm)
                    <div class="d-flex flex-row gap-2 align-items-center">
                        @if($readonly)
                            <i class="{{ in_array($perm->id, $rolePermIds) ? 'ri-checkbox-circle-fill text-success' : 'ri-close-circle-line text-danger' }}"
                               style="font-size:16px;"></i>
                            <span class="table-body-content fw-400 mb-0">{{ $action }}</span>
                        @else
                            <input class="form-check-input perm-{{ strtolower($action) }}"
                                   type="checkbox" name="permissions[]" value="{{ $perm->id }}"
                                   id="perm_{{ $perm->id }}"
                                   {{ in_array($perm->id, $rolePermIds) ? 'checked' : '' }}>
                            <label class="table-body-content fw-400 mb-0" for="perm_{{ $perm->id }}">{{ $action }}</label>
                        @endif
                    </div>
                    @endif
                    @endforeach
                </td>
            </tr>
            @endforeach

        </tbody>
    </table>
</div>