@php
    $prefix = $prefix ?? 'section';
    $assignmentWrapId = $prefix . '-scheme-assignment-wrap';
    $hiddenInputsId = $prefix . 'SchemeAssignmentHiddenInputs';
    $searchInputId = $prefix . 'SchemeSearch';
    $searchBtnId = $prefix . 'SchemeSearchBtn';
    $tableId = $prefix . 'SchemeAssignmentTable';
    $tableBodyId = $prefix . 'SchemeAssignmentTableBody';
    $selectAllId = $prefix . '-scheme-select-all';
    $paginationInfoId = $prefix . 'SchemeAssignmentPaginationInfo';
    $paginationId = $prefix . 'SchemeAssignmentPagination';
    $assignmentVisible = $assignmentVisible ?? true;
@endphp
<div class="row" id="{{ $assignmentWrapId }}" @if(! $assignmentVisible) style="display: none;" @endif>
    <div class="col-12">
        <div class="card card-info">
            <div class="card-header d-flex flex-wrap align-items-center justify-content-between">
                <h3 class="card-title mb-0">Scheme Assignment</h3>
                <div class="form-inline mt-2 mt-md-0">
                    <label class="sr-only" for="{{ $searchInputId }}">Search schemes</label>
                    <input type="search" id="{{ $searchInputId }}" class="form-control form-control-sm mr-2" placeholder="Search schemes..." autocomplete="off">
                    <button type="button" class="btn btn-sm btn-default" id="{{ $searchBtnId }}">
                        <i class="fas fa-search"></i> Search
                    </button>
                </div>
            </div>
            <div class="card-body p-0">
                <div id="{{ $hiddenInputsId }}"></div>
                <div class="table-responsive">
                    <table class="table table-bordered table-striped table-hover mb-0" id="{{ $tableId }}">
                        <thead>
                            <tr>
                                <th style="width: 40px;">
                                    <input type="checkbox" id="{{ $selectAllId }}" title="Select all schemes on this page">
                                </th>
                                <th>ADP #</th>
                                <th>UID</th>
                                <th class="text-left">Scheme name</th>
                                <th class="text-left">Type</th>
                                <th>Start year</th>
                                <th>Completion date</th>
                                <th class="text-left">Department</th>
                                <th class="text-left">Sub Department</th>
                                <th class="text-left">Sector</th>
                                <th class="text-left">Sub Sector</th>
                            </tr>
                        </thead>
                        <tbody id="{{ $tableBodyId }}">
                            <tr>
                                <td colspan="11" class="text-center text-muted py-4">Loading schemes…</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="card-footer d-flex flex-wrap align-items-center justify-content-between">
                <div id="{{ $paginationInfoId }}" class="text-muted small"></div>
                <nav aria-label="Scheme assignment pagination">
                    <ul class="pagination pagination-sm mb-0" id="{{ $paginationId }}"></ul>
                </nav>
            </div>
        </div>
    </div>
</div>