@php($idsStr = implode(',', $ids ?? []))
<form action="{{ route('manages.documents.bulk-update') }}" method="POST" class="form-horizontal custom-validation ajax-form documents-bulk-update-form">
    @csrf
    @method('PATCH')
    <div class="doc-ids-holder"><input type="hidden" name="ids[]" value="" /></div>
    <div class="row">
        @if(request()->filled('master_document_section_id'))
            <input type="hidden" name="master_document_section_id" value="{{ request('master_document_section_id') }}" />
        @endif
        <div class="col-12 mb-3">
            <h5 class="mb-2">Selected Documents <span class="text-muted">({{ count($documents ?? []) }})</span> <i class="bx bx-chevron-down toggle-doc-list" role="button" aria-expanded="true" aria-controls="bulk-doc-list"></i></h5>
            <div class="border rounded bg-light overflow-auto selected-doc-list-wrapper" id="bulk-doc-list">
                <ul class="list-group list-group-flush small mb-0 selected-doc-list">
                    @forelse(($documents ?? []) as $i => $doc)
                        <li class="list-group-item py-1 px-2 d-flex align-items-center" data-id="{{ $doc->id }}">
                            <span class="me-2 text-muted">{{ $i+1 }}.</span>
                            <span class="text-truncate flex-grow-1" title="{{ $doc->title }}">{{ \Illuminate\Support\Str::limit($doc->title, 60) }}</span>
                        </li>
                    @empty
                        <li class="list-group-item py-1 px-2 text-muted">No documents selected.</li>
                    @endforelse
                </ul>
            </div>
        </div>
        <div class="col-12 mb-3">
            <label class="form-label d-block mb-1">Update Visibility <i class="bx bx-help-circle" data-toggle="tooltip" title="Choose visibility state to apply to all selected documents."></i></label>
            <div class="d-inline-flex flex-wrap align-items-center gap-4 project-checkbox visibility-options">
                <label class="d-inline-flex align-items-center gap-2 mb-0"><input type="radio" name="visibility_action" value="visible"> <span>Visible</span></label>
                <label class="d-inline-flex align-items-center gap-2 mb-0"><input type="radio" name="visibility_action" value="hidden"> <span>Hidden</span></label>
                <label class="d-inline-flex align-items-center gap-2 mb-0"><input type="radio" name="visibility_action" value="none" checked> <span>No Change</span></label>
            </div>
        </div>
        <div class="col-12 mb-3">
            <label class="form-label d-block">Update Permissions <i class="bx bx-help-circle" data-toggle="tooltip" title="Add or Remove the selected user classes from each document."></i></label>
            <div class="table-responsive">
                <table class="table table-sm align-middle permissions-update-table mb-0">
                    <thead>
                        <tr>
                            <th>User Class</th>
                            <th class="text-center align-middle">
                                <div class="d-flex flex-column align-items-center gap-1">
                                    <span class="small text-muted">Add</span>
                                    <div class="project-checkbox"><input type="radio" name="perm_col_select" value="add" class="perm-col-select" aria-label="Select Add for all"></div>
                                </div>
                            </th>
                            <th class="text-center align-middle">
                                <div class="d-flex flex-column align-items-center gap-1">
                                    <span class="small text-muted">Remove</span>
                                    <div class="project-checkbox"><input type="radio" name="perm_col_select" value="remove" class="perm-col-select" aria-label="Select Remove for all"></div>
                                </div>
                            </th>
                            <th class="text-center align-middle">
                                <div class="d-flex flex-column align-items-center gap-1">
                                    <span class="small text-muted">No Change</span>
                                    <div class="project-checkbox"><input type="radio" name="perm_col_select" value="none" class="perm-col-select" aria-label="Select No Change for all" checked></div>
                                </div>
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($roleList as $rid => $rTitle)
                            <tr class="permission-row">
                                <td>{{ $rTitle }}</td>
                                <td class="text-center align-middle"><div class="project-checkbox d-flex justify-content-center"><input type="radio" name="permission_action_{{ $rid }}" value="add" class="perm-radio" data-role-id="{{ $rid }}"></div></td>
                                <td class="text-center align-middle"><div class="project-checkbox d-flex justify-content-center"><input type="radio" name="permission_action_{{ $rid }}" value="remove" class="perm-radio" data-role-id="{{ $rid }}"></div></td>
                                <td class="text-center align-middle"><div class="project-checkbox d-flex justify-content-center"><input type="radio" name="permission_action_{{ $rid }}" value="none" class="perm-radio" data-role-id="{{ $rid }}" checked></div></td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <input type="hidden" name="permission_action" value="none" />
            <div class="d-none role-ids-wrapper"></div>
        </div>
    </div>
    <div class="d-flex justify-content-start mt-2">
        <button type="button" class="black-btn-inner waves-effect me-2" data-bs-dismiss="modal">Cancel</button>
        <button type="submit" class="green-btn-inner waves-effect">Save</button>
    </div>
</form>
<script>
window.HW_DOCUMENT_BULK_UPDATE = window.HW_DOCUMENT_BULK_UPDATE || {};
window.HW_DOCUMENT_BULK_UPDATE.ids = @json($ids ?? []);
</script>
<script src="{{ asset('assets/js/document-bulk-update.js') }}"></script>