{{-- Modal Quét & Fix Log ICL thiếu / lỗi --}}
<div id="scan_missing_icl_logs_modal" class="fixed inset-0 z-50 hidden bg-slate-900/60 backdrop-blur-sm flex items-center justify-center p-4">
    <div class="bg-white rounded-2xl max-w-3xl w-full p-6 shadow-2xl border border-slate-100 transform transition-all flex flex-col max-h-[90vh]">
        
        {{-- Header Modal --}}
        <div class="flex items-center justify-between pb-4 border-b border-slate-100 mb-4 flex-shrink-0">
            <div class="flex items-center gap-3">
                <div class="p-2 bg-amber-50 text-amber-600 rounded-lg">
                    <i data-lucide="search-code" class="w-5 h-5"></i>
                </div>
                <div>
                    <h3 class="font-extrabold text-slate-800 text-base">Quét & Fix Log ICL Thiếu / Lỗi</h3>
                    <p class="text-xs text-slate-400">Kiểm tra các bài thi chưa có log, thiếu success_at hoặc log thất bại</p>
                </div>
            </div>
            <button id="btn_close_scan_missing_modal" class="text-slate-400 hover:text-slate-600 p-1 rounded-lg hover:bg-slate-100 transition-all">
                <i data-lucide="x" class="w-5 h-5"></i>
            </button>
        </div>

        {{-- Content Modal --}}
        <div id="scan_missing_modal_content" class="flex-1 overflow-y-auto py-2">
            
            {{-- Bước 1: Quét danh sách --}}
            <div id="scan_missing_step_scan" class="space-y-5">
                <div class="bg-amber-50/60 p-4 rounded-xl border border-amber-100 text-xs text-amber-800 leading-relaxed">
                    <span class="font-bold">Mục đích:</span> Lọc danh sách lượt thi (`student_score`) được tạo trong khoảng thời gian đã chọn, đối chiếu với nhật ký `student_score_icl_logs`. Các lượt thi thỏa mãn một trong các điều kiện sau sẽ được đưa vào danh sách:
                    <ul class="list-disc list-inside mt-1.5 space-y-0.5 font-medium">
                        <li>Chưa có bản ghi log ICL nào.</li>
                        <li>Đã có log ICL nhưng log mới nhất (MAX ID) bị thất bại (`status = 0`).</li>
                        <li>Đã có log ICL nhưng log mới nhất chưa được cập nhật thời gian hoàn tất (`success_at = null`).</li>
                    </ul>
                </div>
                
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-[11px] font-bold text-slate-500 uppercase tracking-wider mb-1.5">Bài thi tạo Từ ngày</label>
                        <input type="text" id="scan_missing_start_date" class="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-amber-100 focus:border-amber-500 transition-all bg-white" placeholder="DD-MM-YYYY">
                    </div>
                    <div>
                        <label class="block text-[11px] font-bold text-slate-500 uppercase tracking-wider mb-1.5">Bài thi tạo Đến ngày</label>
                        <input type="text" id="scan_missing_end_date" class="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-amber-100 focus:border-amber-500 transition-all bg-white" placeholder="DD-MM-YYYY">
                    </div>
                </div>

                <div class="pt-4">
                    <button id="btn_run_scan_missing_icl_logs" class="w-full py-3 bg-amber-600 hover:bg-amber-700 text-white font-bold text-sm rounded-xl shadow-md shadow-amber-200 transition-all flex items-center justify-center gap-2">
                        <i data-lucide="search" class="w-4 h-4"></i> Bắt đầu Quét dữ liệu
                    </button>
                </div>
            </div>

            {{-- Đang quét (Loading) --}}
            <div id="scan_missing_step_scanning" class="hidden text-center py-8">
                <div class="inline-block animate-spin text-amber-600 mb-3">
                    <i data-lucide="loader-2" class="w-8 h-8"></i>
                </div>
                <p class="text-slate-600 font-medium text-sm">Đang quét danh sách bài thi & đối chiếu log ICL...</p>
            </div>

            {{-- Bước 2: Kết quả quét & Preview --}}
            <div id="scan_missing_step_result" class="hidden space-y-4">
                <div class="flex items-center justify-between bg-amber-50 border border-amber-200 p-3.5 rounded-xl">
                    <div class="flex items-center gap-2.5">
                        <div class="p-1.5 bg-amber-100 text-amber-700 rounded-lg">
                            <i data-lucide="alert-triangle" class="w-4 h-4"></i>
                        </div>
                        <div>
                            <h4 class="font-bold text-slate-800 text-sm" id="scan_missing_result_title">Tìm thấy 0 bài thi cần fix</h4>
                            <p class="text-slate-500 text-xs mt-0.5">Vui lòng tích chọn các bài thi bạn muốn đồng bộ lại sang ICL.</p>
                        </div>
                    </div>
                </div>

                {{-- Bảng danh sách preview --}}
                <div class="border border-slate-200 rounded-xl overflow-hidden max-h-72 overflow-y-auto">
                    <table class="w-full text-left border-collapse text-xs">
                        <thead class="bg-slate-50 text-slate-500 font-semibold sticky top-0 border-b border-slate-200 z-10">
                            <tr>
                                <th class="p-3 w-10 text-center">
                                    <input type="checkbox" id="scan_missing_select_all" class="rounded border-slate-300 text-amber-600 focus:ring-amber-500 w-4 h-4 cursor-pointer" checked>
                                </th>
                                <th class="p-3 w-20 text-center">Score ID</th>
                                <th class="p-3">Học viên</th>
                                <th class="p-3">Khóa học / Bài thi</th>
                                <th class="p-3">Ngày tạo</th>
                                <th class="p-3">Lý do phát hiện</th>
                            </tr>
                        </thead>
                        <tbody id="scan_missing_preview_list" class="divide-y divide-slate-100 text-slate-700 bg-white">
                            {{-- Dynamic insertion via JS --}}
                        </tbody>
                    </table>
                </div>

                <div class="pt-4 flex gap-3">
                    <button id="btn_cancel_scan_missing" class="flex-1 py-3 bg-slate-100 hover:bg-slate-200 text-slate-700 font-bold text-sm rounded-xl transition-all">
                        Quay lại chọn ngày
                    </button>
                    <button id="btn_confirm_batch_sync_missing" class="flex-1 py-3 bg-amber-600 hover:bg-amber-700 text-white font-bold text-sm rounded-xl shadow-md shadow-amber-200 transition-all flex items-center justify-center gap-2">
                        <i data-lucide="play" class="w-4 h-4"></i> Bắt đầu Đồng bộ lại hàng loạt
                    </button>
                </div>
            </div>

            {{-- Bước 3: Tiến trình đồng bộ --}}
            <div id="scan_missing_step_progress" class="hidden py-2 space-y-4">
                <div class="flex justify-between text-xs font-bold text-slate-600">
                    <span id="scan_missing_progress_label">Đang tiến hành đồng bộ dữ liệu sang ICL...</span>
                    <span id="scan_missing_progress_percent" class="text-amber-600">0%</span>
                </div>
                <div class="w-full bg-slate-100 rounded-full h-3 overflow-hidden">
                    <div id="scan_missing_progress_bar" class="bg-amber-500 h-3 rounded-full transition-all duration-300 w-0"></div>
                </div>
                <div class="flex justify-between items-center text-[11px] font-bold text-slate-500 uppercase tracking-wider">
                    <span>Trạng thái chi tiết:</span>
                    <span id="scan_missing_progress_count" class="text-slate-600 normal-case font-bold">0 / 0</span>
                </div>
                
                {{-- Console Log Terminal --}}
                <div id="scan_missing_console" class="bg-slate-950 text-emerald-400 font-mono text-[11px] p-3 rounded-lg overflow-y-auto max-h-48 border border-slate-900 shadow-inner flex flex-col space-y-1">
                    <div>[Hệ thống] Sẵn sàng đồng bộ lại...</div>
                </div>
            </div>

            {{-- Bước 4: Hoàn tất --}}
            <div id="scan_missing_step_complete" class="hidden text-center py-6">
                <div class="w-16 h-16 bg-emerald-50 text-emerald-500 rounded-full flex items-center justify-center mx-auto mb-4 border border-emerald-100 shadow-sm animate-bounce">
                    <i data-lucide="check-circle-2" class="w-8 h-8"></i>
                </div>
                <h4 class="font-bold text-slate-800 text-lg mb-1">Đồng bộ hoàn tất!</h4>
                <p class="text-slate-500 text-sm mb-6" id="scan_missing_complete_desc">Đã xử lý xong danh sách bài thi được chọn.</p>
                <button id="btn_finish_scan_missing" class="w-full py-3 bg-slate-100 hover:bg-slate-200 text-slate-700 font-bold text-sm rounded-xl transition-all">
                    Hoàn tất & Đóng
                </button>
            </div>

        </div>
    </div>
</div>