{{-- Modal Karyawan Picker --}}
<div class="modal fade" id="karyawanPickerModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title mb-0">List Data Karyawan</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
<style>
    .picker-search-wrap { max-width: 360px; width: 100%; flex-wrap: nowrap; align-items: stretch; }
    .picker-search-wrap > .form-control { height: calc(1.5em + 1rem + 2px); }
    .picker-search-wrap > .btn { height: calc(1.5em + 1rem + 2px); }
</style>
                <div class="d-flex justify-content-end mb-3">
                    <div class="input-group picker-search-wrap">
                        <input type="text" class="form-control" id="karyawanPickerSearch" placeholder="Cari..." oninput="filterKaryawanPicker()">
                        <button class="btn btn-primary" type="button" onclick="filterKaryawanPicker()">
                            <i class="fas fa-search me-1"></i>Cari
                        </button>
                    </div>
                </div>
                <div class="table-responsive">
                    <table class="table table-hover align-items-center mb-0" id="karyawanPickerTable">
                        <thead style="background-color: #00b7bd4f;">
                            <tr>
                                <th style="width: 80px;">Action</th>
                                <th>NIK</th>
                                <th>Nama</th>
                                <th>Departemen</th>
                                <th>Status</th>
                            </tr>
                        </thead>
                        <tbody id="karyawanPickerBody"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>