Sistem Manajemen Ruang Sidang – FDK UIN Sunan Kalijaga<\/title>\n \n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n \n <script>\n tailwind.config = {\n theme: {\n extend: {\n colors: {\n brand: {\n green: '#006368', \/* Brand Green Utama *\/\n greenHover: '#004d50', \/* Hover Green *\/\n greenLight: '#e6f2f3', \/* Background Green Ringan *\/\n greenDark: '#00373a', \/* Sangat Gelap untuk Teks\/Header *\/\n orange: '#F08619', \/* Brand Orange Utama *\/\n orangeHover: '#d5710f', \/* Hover Orange *\/\n orangeLight: '#fef3e8' \/* Background Orange Ringan *\/\n }\n }\n }\n }\n }\n <\/script>\n \n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n \n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght=300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n \n <style>\n body {\n font-family: 'Inter', sans-serif;\n }\n \n .hidden {\n display: none !important;\n }\n\n \/* Custom Scrollbar for better UX in Search Dropdowns *\/\n .custom-scrollbar::-webkit-scrollbar {\n width: 6px;\n }\n .custom-scrollbar::-webkit-scrollbar-track {\n background: #f1f5f9;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb {\n background: #cbd5e1;\n border-radius: 4px;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n background: #94a3b8;\n }\n\n \/* Rotation animation for sync button *\/\n @keyframes spin-slow {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n }\n .animate-spin-slow {\n animation: spin-slow 2s linear infinite;\n }\n\n \/* ==========================================\n OFFICIAL PRINT ENGINE REPAIR (A4 FORMAT)\n ========================================== *\/\n @media print {\n html, body {\n background: #ffffff !important;\n color: #000000 !important;\n -webkit-print-color-adjust: exact !important;\n print-color-adjust: exact !important;\n }\n \/* Sembunyikan seluruh UI web utama *\/\n body * {\n visibility: hidden !important;\n }\n \/* Tampilkan area print secara eksklusif *\/\n #print-area, #print-area * {\n visibility: visible !important;\n }\n #print-area {\n position: absolute !important;\n left: 0 !important;\n top: 0 !important;\n width: 100% !important;\n max-width: 100% !important;\n display: block !important;\n color: black !important;\n background: white !important;\n font-family: 'Times New Roman', Times, serif !important;\n line-height: 1.4 !important;\n }\n \/* Pengaturan Kertas A4 Portrait *\/\n @page {\n size: A4 portrait;\n margin: 1.5cm;\n }\n .no-print {\n display: none !important;\n }\n \/* Menjaga border tetap solid dan tajam saat cetak *\/\n table, th, td {\n border-color: #000000 !important;\n }\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-50 text-slate-800 min-h-screen flex flex-col justify-center py-6\">\n\n \n <main class=\"flex-grow container mx-auto px-4 max-w-7xl no-print\">\n \n \n <div class=\"flex flex-col md:flex-row justify-between items-center gap-4 mb-6 bg-white p-4 rounded-xl border border-slate-200\">\n <div class=\"flex items-center gap-3\">\n <div class=\"bg-brand-green text-white p-2.5 rounded-lg font-bold\">\n <i data-lucide=\"graduation-cap\" class=\"w-6 h-6\"><\/i>\n <\/div>\n <div>\n <h1 class=\"text-lg font-bold text-slate-800\">Sistem Ruang Sidang FDK<\/h1>\n <p class=\"text-xs text-slate-500\">Fakultas Dakwah dan Komunikasi \u2022 UIN Sunan Kalijaga<\/p>\n <\/div>\n <\/div>\n\n \n <div id=\"db-connection-status\" class=\"flex items-center gap-2 px-3 py-1.5 rounded-full border text-xs font-semibold transition-all duration-300\">\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-slate-400 opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-slate-500\"><\/span>\n <\/span>\n <span>Memuat Status Koneksi…<\/span>\n <\/div>\n \n <div class=\"flex items-center gap-3\">\n \n <div id=\"auth-section\">\n <button onclick=\"openLoginModal()\" class=\"flex items-center gap-2 bg-brand-orange hover:bg-brand-orangeHover text-white font-semibold px-4 py-2 rounded-lg transition text-sm\">\n <i data-lucide=\"log-in\" class=\"w-4 h-4\"><\/i>\n Login Kaprodi\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-4 mb-6\">\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 flex flex-col justify-between\">\n <label class=\"block text-xs font-semibold uppercase tracking-wider text-slate-500 mb-2\">Tanggal Pelaksanaan Sidang<\/label>\n <div class=\"flex gap-2\">\n <input type=\"date\" id=\"selected-date\" onchange=\"loadSchedules()\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green font-medium text-slate-700\">\n <button onclick=\"setToToday()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 px-3 py-2 rounded-lg text-sm font-semibold transition\" title=\"Hari Ini\">\n Hari Ini\n <\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 grid grid-cols-2 gap-4\">\n <div class=\"flex flex-col justify-between\">\n <span class=\"text-xs font-semibold uppercase tracking-wider text-slate-500\">Total Sesi Terisi<\/span>\n <div class=\"flex items-baseline gap-1 mt-1\">\n <span id=\"stats-terisi\" class=\"text-2xl font-bold text-slate-800\">0<\/span>\n <span id=\"stats-terisi-denom\" class=\"text-xs text-slate-400\">\/ 15 Sesi<\/span>\n <\/div>\n <\/div>\n <div class=\"flex flex-col justify-between border-l border-slate-100 pl-4\">\n <span class=\"text-xs font-semibold uppercase tracking-wider text-slate-500\">Tersedia (Hijau)<\/span>\n <div class=\"flex items-baseline gap-1 mt-1\">\n <span id=\"stats-tersedia\" class=\"text-2xl font-bold text-brand-green\">15<\/span>\n <span class=\"text-xs text-brand-green font-medium\">Sesi<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 flex items-center justify-between\">\n <div class=\"flex items-start gap-3\">\n <div class=\"p-2 bg-brand-greenLight text-brand-green rounded-lg mt-0.5\">\n <i data-lucide=\"info\" class=\"w-5 h-5\"><\/i>\n <\/div>\n <div>\n <h3 class=\"text-xs font-bold uppercase tracking-wider text-slate-600\">Ketentuan Sesi<\/h3>\n <p class=\"text-xs text-slate-500 mt-1\" id=\"ketentuan-sesi-text\">Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: Kosong, Putih: Terisi.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white rounded-xl border border-slate-200 overflow-hidden mb-8\">\n <div class=\"p-4 bg-slate-50 border-b border-slate-200 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-2\">\n <div>\n <h2 class=\"font-bold text-slate-800 flex items-center gap-2\">\n <i data-lucide=\"calendar\" class=\"w-5 h-5 text-brand-green\"><\/i>\n Jadwal Penggunaan Ruang Sidang (Munaqosah \/ Proposal)\n <\/h2>\n <p class=\"text-xs text-slate-500 mt-0.5\" id=\"display-date-string\">Memuat tanggal…<\/p>\n <\/div>\n \n <div class=\"flex flex-wrap items-center gap-3 text-xs\">\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-brand-greenLight border border-brand-green\/30 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Kosong \/ Tersedia<\/span>\n <\/div>\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-white border border-slate-300 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Terisi \/ Terjadwal<\/span>\n <\/div>\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-slate-100 border border-slate-200 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Sesi Sholat Jumat<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"overflow-x-auto\">\n <table class=\"w-full min-w-[800px] border-collapse\">\n <thead>\n <tr class=\"bg-slate-100 text-slate-700 text-xs font-bold uppercase tracking-wider text-center border-b border-slate-200\">\n <th class=\"py-3 px-4 w-48 border-r border-slate-200\">Waktu & Sesi<\/th>\n <th class=\"py-3 px-4 border-r border-slate-200\">RUANG 1<\/th>\n <th class=\"py-3 px-4 border-r border-slate-200\">RUANG 2<\/th>\n <th class=\"py-3 px-4\">RUANG 3<\/th>\n <\/tr>\n <\/thead>\n <tbody class=\"divide-y divide-slate-200\" id=\"schedule-grid-body\">\n \n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <\/main>\n\n \n <div id=\"print-area\" class=\"hidden p-0 max-w-4xl mx-auto bg-white text-black text-[12px] font-serif leading-relaxed\">\n \n \n <div class=\"grid grid-cols-[90px_1fr] items-center border-b-[4px] border-double border-[#006368] pb-3 mb-5\">\n \n <div class=\"w-[85px] h-[85px] flex items-center justify-center\">\n \n <img decoding=\"async\" id=\"print-logo-png\" src=\"https:\/\/lpm.uin-suka.ac.id\/images\/logo.png\" alt=\"Logo UIN Sunan Kalijaga\" class=\"w-full h-auto max-h-[85px] object-contain\" onerror=\"this.onerror=null; this.src='https:\/\/placehold.co\/150x150\/006368\/ffffff?text=Logo+UIN';\">\n <\/div>\n \n \n <div class=\"text-center font-serif ml-2\">\n <h2 class=\"text-[14px] font-bold tracking-wider uppercase leading-tight text-slate-900\">Kementerian Agama Republik Indonesia<\/h2>\n <h1 class=\"text-[17px] font-extrabold uppercase leading-snug tracking-normal text-[#006368]\">Universitas Islam Negeri Sunan Kalijaga Yogyakarta<\/h1>\n <h3 class=\"text-[15px] font-bold uppercase tracking-wide leading-tight text-[#F08619]\">Fakultas Dakwah dan Komunikasi<\/h3>\n <p class=\"text-[9.5px] font-normal italic mt-1 leading-normal text-slate-700\">\n Alamat: Jl. Marsda Adisucipto, Yogyakarta 55281 | Telp: (0274) 515856, Fax: (0274) 552230<br>\n Email: fdk@uin-suka.ac.id | Website: http:\/\/fdk.uin-suka.ac.id\n <\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"text-center mb-5\">\n <h4 class=\"text-[14px] font-bold uppercase tracking-wider underline leading-normal text-slate-900\" id=\"print-document-title\">KARTU JADWAL PELAKSANAAN SIDANG<\/h4>\n <p class=\"text-[10px] font-mono tracking-wide mt-1 text-slate-600\" id=\"print-slip-id\">No. Berkas: FDK-MUN-0000<\/p>\n <\/div>\n\n <p class=\"mb-4 text-[11.5px] leading-relaxed text-slate-800\">\n Berdasarkan Keputusan Dekan Fakultas Dakwah dan Komunikasi UIN Sunan Kalijaga, diberitahukan kepada mahasiswa yang bersangkutan bahwa pelaksanaan agenda ujian\/sidang akademik akan diselenggarakan secara luring sesuai dengan ketentuan di bawah ini:\n <\/p>\n\n \n <table class=\"w-full border-collapse border border-slate-900 text-[11.5px] my-5 font-serif\">\n <tbody>\n <tr>\n <td class=\"border border-slate-900 p-2 w-[30%] bg-slate-50 font-bold\">Jenis Kegiatan Ujian\/Sidang<\/td>\n <td class=\"border border-slate-900 p-2 w-[70%] font-bold text-[#006368] tracking-wide uppercase\" id=\"print-jenis-sidang\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Nama Mahasiswa<\/td>\n <td class=\"border border-slate-900 p-2 font-semibold text-slate-800\" id=\"print-mahasiswa\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">NIM \/ Program Studi<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-nim-prodi\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Hari, Tanggal Pelaksanaan<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-tanggal\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Waktu & Sesi<\/td>\n <td class=\"border border-slate-900 p-2 font-semibold text-teal-900\" id=\"print-waktu\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Tempat \/ Ruangan<\/td>\n <td class=\"border border-slate-900 p-2 font-bold text-slate-900\" id=\"print-ruang\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Judul Naskah Akademik<\/td>\n <td class=\"border border-slate-900 p-2 italic leading-relaxed text-slate-800\" id=\"print-judul\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Pembimbing<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-pembimbing\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Sekretaris Sidang<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-sekretaris\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Penguji I (Utama)<\/td>\n <td class=\"border border-slate-900 p-2 font-medium\" id=\"print-penguji1\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Penguji II (Pendamping)<\/td>\n <td class=\"border border-slate-900 p-2 font-medium\" id=\"print-penguji2\">–<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n \n <div class=\"mb-8 p-3 border border-dashed border-[#006368]\/50 bg-slate-50 rounded\">\n <p class=\"font-bold underline text-[10.5px] mb-1.5 uppercase tracking-wider text-[#006368]\">Instruksi & Tata Tertib Sidang Akademik:<\/p>\n <ol class=\"list-decimal list-inside text-[10px] text-slate-600 space-y-1\">\n <li>Mahasiswa diwajibkan hadir di lokasi ruang sidang sekurang-kurangnya 15 menit sebelum sesi dimulai.<\/li>\n <li>Wajib mengenakan seragam pakaian formal (Kemeja Putih, Celana\/Rok Hitam) lengkap dengan Jas<\/li>\n <li>Membawa draf dokumen akademik tercetak (hardcopy) sebanyak 3 rangkap untuk diserahkan kepada Dewan Penguji.<\/li>\n <li>Keterlambatan tanpa konfirmasi resmi dapat mengakibatkan pembatalan sesi atau penundaan jadwal sidang.<\/li>\n <\/ol>\n <\/div>\n\n \n <div class=\"flex justify-between items-start text-[11px] mt-8\">\n <div class=\"w-[45%] text-slate-400 italic\">\n <p class=\"text-[9px] mt-8 text-slate-500 font-mono\">\n Sistem Manajemen Ruang Sidang FDK<br>\n Dokumen ini sah dikeluarkan melalui portal digital Kaprodi FDK UIN Sunan Kalijaga Yogyakarta.\n <\/p>\n <\/div>\n \n <div class=\"text-center w-[45%] font-serif\">\n <p id=\"print-ttd-date\" class=\"mb-1\">Yogyakarta, 23 Juni 2026<\/p>\n <p class=\"font-semibold text-slate-800\" id=\"print-ttd-role\">a.n. Dekan,<br>Ketua Program Studi<\/p>\n \n \n <div class=\"h-[75px] flex items-center justify-center relative\">\n <span class=\"text-[9px] text-[#006368] border border-[#006368]\/30 rounded px-2.5 py-0.5 font-mono tracking-widest bg-emerald-50\/50 uppercase z-10 font-bold\">TERVALIDASI SISTEM<\/span>\n <div class=\"absolute opacity-[0.12] w-[60px] h-[60px]\">\n <svg viewBox=\"0 0 100 100\" class=\"w-full h-full\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <polygon points=\"50,3 83,17 97,50 83,83 50,97 17,83 3,50 17,17\" fill=\"#006368\"\/>\n <\/svg>\n <\/div>\n <\/div>\n \n <p class=\"font-bold underline text-slate-900 text-[11.5px]\" id=\"print-ttd-officer\">Dr. KPI Ahmad, M.S.I.<\/p>\n <p class=\"text-[10px] text-slate-700 font-medium\" id=\"print-ttd-nip\">NIP. “197508122003121002”<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n\n \n\n \n <div id=\"login-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-md overflow-hidden transform transition-all\">\n <div class=\"bg-brand-green text-white p-5 border-b-4 border-brand-orange flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"shield-check\" class=\"w-6 h-6 text-brand-orange\"><\/i>\n <h3 class=\"font-bold text-lg\">Login Petugas Prodi<\/h3>\n <\/div>\n <button onclick=\"closeLoginModal()\" class=\"text-teal-100 hover:text-white transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n <form id=\"login-form\" onsubmit=\"handleLogin(event)\" class=\"p-6 space-y-4\">\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Program Studi (Akun Terdaftar)<\/label>\n <select id=\"login-email\" name=\"username\" autocomplete=\"username\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green font-medium\" required>\n <option value=\"kaprodi.kpi@uinsuka.ac.id\">Komunikasi dan Penyiaran Islam (KPI)<\/option>\n <option value=\"kaprodi.bki@uinsuka.ac.id\">Bimbingan dan Konseling Islam (BKI)<\/option>\n <option value=\"kaprodi.pmi@uinsuka.ac.id\">Pengembangan Masyarakat Islam (PMI)<\/option>\n <option value=\"kaprodi.md@uinsuka.ac.id\">Manajemen Dakwah (MD)<\/option>\n <option value=\"kaprodi.iks@uinsuka.ac.id\">Ilmu Kesejahteraan Sosial (IKS)<\/option>\n <option value=\"kaprodi.mkpi@uinsuka.ac.id\">Magister Komunikasi dan Penyiaran Islam (MKPI)<\/option>\n <option value=\"kaprodi.mbki@uinsuka.ac.id\">Magister Bimbingan dan Konseling Islam (MBKI)<\/option>\n <option value=\"kaprodi.mpmi@uinsuka.ac.id\">Magister Pengembangan Masyarakat Islam (MPMI)<\/option>\n <option value=\"kaprodi.mks@uinsuka.ac.id\">Magister Kesjahteraan Sosial (MKS)<\/option>\n <\/select>\n <\/div>\n <div>\n <div class=\"flex justify-between items-center mb-1.5\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider\">Kata Sandi<\/label>\n <\/div>\n <input type=\"password\" id=\"login-password\" name=\"password\" autocomplete=\"current-password\" placeholder=\"Masukkan kata sandi Kaprodi\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <div id=\"login-error-msg\" class=\"text-xs text-rose-600 bg-rose-50 border border-rose-200 p-2.5 rounded-lg hidden flex items-center gap-1.5\">\n <i data-lucide=\"alert-circle\" class=\"w-4 h-4 shrink-0\"><\/i>\n Sandi salah! Silakan hubungi Administrator.\n <\/div>\n <button type=\"submit\" class=\"w-full bg-brand-green hover:bg-brand-greenHover text-white font-bold py-2.5 rounded-lg transition mt-2 flex items-center justify-center gap-2\">\n <i data-lucide=\"unlock\" class=\"w-4 h-4\"><\/i>\n Verifikasi Masuk\n <\/button>\n <\/form>\n <\/div>\n <\/div>\n\n \n <div id=\"booking-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-xl overflow-hidden transform transition-all max-h-[90vh] flex flex-col animate-fadeIn\">\n <div class=\"bg-brand-green text-white p-5 border-b-4 border-brand-orange flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"edit-3\" class=\"w-6 h-6 text-brand-orange\" id=\"modal-title-icon\"><\/i>\n <h3 class=\"font-bold text-lg\" id=\"modal-title\">Atur Sesi Sidang Baru<\/h3>\n <\/div>\n <button onclick=\"closeBookingModal()\" class=\"text-teal-100 hover:text-white transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n \n <form onsubmit=\"handleSaveBooking(event)\" class=\"p-6 space-y-4 overflow-y-auto flex-grow custom-scrollbar\">\n \n <div class=\"grid grid-cols-3 gap-3 bg-slate-50 p-3 rounded-lg border border-slate-200 text-xs\">\n <div>\n <span class=\"block text-slate-400\">Tanggal<\/span>\n <span class=\"font-bold text-slate-700\" id=\"meta-date\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Ruangan<\/span>\n <span class=\"font-bold text-brand-green\" id=\"meta-room\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Waktu & Sesi<\/span>\n <span class=\"font-bold text-brand-green\" id=\"meta-session\">–<\/span>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-brand-orangeLight\/60 p-3.5 rounded-xl border border-brand-orange\/20\">\n <label class=\"block text-xs font-bold text-slate-700 uppercase tracking-wider mb-2\">Jenis Kegiatan Sidang<\/label>\n <div class=\"grid grid-cols-2 gap-3\">\n <label class=\"flex items-center gap-2 bg-white px-3 py-2 rounded-lg border border-slate-300 cursor-pointer hover:border-brand-green transition\">\n <input type=\"radio\" name=\"field-type\" id=\"type-munaqosah\" value=\"Sidang Munaqosah\" checked onchange=\"updateModalHeaderByType()\" class=\"text-brand-green focus:ring-brand-green h-4 w-4\">\n <span class=\"text-xs font-semibold text-slate-800\">Sidang Munaqosah<\/span>\n <\/label>\n <label class=\"flex items-center gap-2 bg-white px-3 py-2 rounded-lg border border-slate-300 cursor-pointer hover:border-brand-green transition\">\n <input type=\"radio\" name=\"field-type\" id=\"type-proposal\" value=\"Sidang Proposal\" onchange=\"updateModalHeaderByType()\" class=\"text-brand-green focus:ring-brand-green h-4 w-4\">\n <span class=\"text-xs font-semibold text-slate-800\">Sidang Proposal<\/span>\n <\/label>\n <\/div>\n <\/div>\n\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Nama Mahasiswa<\/label>\n <input type=\"text\" id=\"field-student\" placeholder=\"Nama Lengkap\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">NIM Mahasiswa<\/label>\n <input type=\"text\" id=\"field-nim\" placeholder=\"Masukkan NIM\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <\/div>\n\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Program Studi<\/label>\n <select id=\"field-prodi\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <option value=\"KPI\">KPI – Komunikasi dan Penyiaran Islam<\/option>\n <option value=\"BKI\">BKI – Bimbingan dan Konseling Islam<\/option>\n <option value=\"PMI\">PMI – Pengembangan Masyarakat Islam<\/option>\n <option value=\"MD\">MD – Manajemen Dakwah<\/option>\n <option value=\"IKS\">IKS – Ilmu Kesejahteraan Sosial<\/option>\n <option value=\"M-KPI\">M-KPI – Magister Komunikasi dan Penyiaran Islam<\/option>\n <option value=\"M-BKI\">M-BKI – Magister Bimbingan dan Konseling Islam<\/option>\n <option value=\"M-PMI\">M-PMI – Magister Pengembangan Masyarakat Islam<\/option>\n <option value=\"M-KS\">M-KS – Magister Kesjahteraan Sosial<\/option>\n <\/select>\n <\/div>\n\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\" id=\"label-field-title\">Judul Skripsi \/ Tugas Akhir<\/label>\n <textarea id=\"field-title\" rows=\"2\" placeholder=\"Masukkan judul akademik lengkap mahasiswa\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required><\/textarea>\n <\/div>\n\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n \n <div class=\"relative\" id=\"dropdown-field-advisor\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Pembimbing<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-advisor')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-advisor-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-advisor-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-advisor')\" id=\"field-advisor-search\" placeholder=\"Cari nama pembimbing...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-advisor-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-advisor-value\" value=\"\">\n <input type=\"text\" id=\"field-advisor-manual\" placeholder=\"Tulis Nama Pembimbing Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n \n \n <div class=\"relative\" id=\"dropdown-field-secretary\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Sekretaris Sidang<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-secretary')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-secretary-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-secretary-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-secretary')\" id=\"field-secretary-search\" placeholder=\"Cari nama sekretaris...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-secretary-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-secretary-value\" value=\"\">\n <input type=\"text\" id=\"field-secretary-manual\" placeholder=\"Tulis Nama Sekretaris Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n <\/div>\n\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n \n <div class=\"relative\" id=\"dropdown-field-examiner1\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Penguji I<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-examiner1')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-examiner1-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-examiner1-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-examiner1')\" id=\"field-examiner1-search\" placeholder=\"Cari nama penguji I...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-examiner1-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-examiner1-value\" value=\"\">\n <input type=\"text\" id=\"field-examiner1-manual\" placeholder=\"Tulis Nama Penguji I Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n \n \n <div class=\"relative\" id=\"dropdown-field-examiner2\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Penguji II<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-examiner2')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-examiner2-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-examiner2-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-examiner2')\" id=\"field-examiner2-search\" placeholder=\"Cari nama penguji II...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-examiner2-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-examiner2-value\" value=\"\">\n <input type=\"text\" id=\"field-examiner2-manual\" placeholder=\"Tulis Nama Penguji II Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n <\/div>\n\n \n <div class=\"flex flex-wrap items-center justify-between gap-3 pt-4 border-t border-slate-100\">\n <div class=\"flex items-center gap-2\">\n <button type=\"button\" id=\"btn-delete\" onclick=\"triggerDeleteConfirmation()\" class=\"bg-rose-50 hover:bg-rose-100 text-rose-700 border border-rose-200 px-4 py-2 rounded-lg text-sm font-semibold transition hidden flex items-center gap-1.5\">\n <i data-lucide=\"trash-2\" class=\"w-4 h-4\"><\/i>\n Kosongkan Sesi\n <\/button>\n <button type=\"button\" id=\"btn-print\" onclick=\"triggerPrintFromModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 px-4 py-2 rounded-lg text-sm font-semibold transition hidden flex items-center gap-1.5\">\n <i data-lucide=\"printer\" class=\"w-4 h-4\"><\/i>\n Cetak Slip\n <\/button>\n <\/div>\n\n <div class=\"flex items-center gap-2 ml-auto\">\n <button type=\"button\" onclick=\"closeBookingModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-600 px-4 py-2 rounded-lg text-sm font-semibold transition\">\n Batal\n <\/button>\n <button type=\"submit\" id=\"btn-save-submit\" class=\"bg-brand-green hover:bg-brand-greenHover text-white font-bold px-5 py-2 rounded-lg transition flex items-center gap-1.5\">\n <i data-lucide=\"save\" class=\"w-4 h-4\"><\/i>\n Simpan Jadwal\n <\/button>\n <\/div>\n <\/div>\n <\/form>\n <\/div>\n <\/div>\n\n \n <div id=\"view-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-lg overflow-hidden transform transition-all\">\n <div class=\"bg-slate-100 text-slate-800 p-5 border-b border-slate-200 flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"file-text\" class=\"w-5 h-5 text-brand-green\"><\/i>\n <h3 class=\"font-bold text-md text-slate-800\">Detail Sesi Sidang<\/h3>\n <\/div>\n <button onclick=\"closeViewModal()\" class=\"text-slate-500 hover:text-slate-800 transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n \n <div class=\"p-6 space-y-4\">\n <div class=\"grid grid-cols-3 gap-3 bg-slate-50 p-3 rounded-lg border border-slate-200 text-xs\">\n <div>\n <span class=\"block text-slate-400\">Tanggal<\/span>\n <span class=\"font-bold text-slate-700\" id=\"view-meta-date\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Ruangan<\/span>\n <span class=\"font-bold text-brand-green\" id=\"view-meta-room\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Waktu \/ Sesi<\/span>\n <span class=\"font-bold text-brand-green\" id=\"view-meta-session\">–<\/span>\n <\/div>\n <\/div>\n\n <div class=\"space-y-3.5 text-sm\">\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Jenis Sidang<\/span>\n <span class=\"col-span-2 font-bold\" id=\"view-jenis-sidang-badge\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Mahasiswa<\/span>\n <span class=\"col-span-2 text-slate-800 font-bold\" id=\"view-student\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">NIM & Prodi<\/span>\n <span class=\"col-span-2 text-slate-800\" id=\"view-nim-prodi\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\" id=\"label-view-title\">Judul Skripsi<\/span>\n <span class=\"col-span-2 text-slate-800 italic\" id=\"view-title\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Pembimbing<\/span>\n <span class=\"col-span-2 text-slate-800 font-semibold\" id=\"view-advisor\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Sekretaris<\/span>\n <span class=\"col-span-2 text-slate-800\" id=\"view-secretary\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Penguji I<\/span>\n <span class=\"col-span-2 text-slate-800 font-medium\" id=\"view-examiner1\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 pb-1\">\n <span class=\"text-slate-500 font-medium\">Penguji II<\/span>\n <span class=\"col-span-2 text-slate-800 font-medium\" id=\"view-examiner2\">–<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"protective-lock-box\" class=\"rounded-lg p-3 flex gap-2.5 items-start text-xs hidden\">\n <i id=\"protective-lock-icon\" data-lucide=\"lock\" class=\"w-4 h-4 shrink-0 mt-0.5\"><\/i>\n <span id=\"protective-lock-text\"><\/span>\n <\/div>\n\n <div class=\"flex items-center justify-between gap-2 pt-4 border-t border-slate-100\">\n <div class=\"flex items-center gap-2\">\n <button onclick=\"triggerPrintFromView()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 font-semibold px-4 py-2 rounded-lg text-sm transition flex items-center gap-1.5\">\n <i data-lucide=\"printer\" class=\"w-4 h-4\"><\/i>\n Cetak Slip\n <\/button>\n \n \n <button id=\"btn-owner-edit\" onclick=\"triggerOwnerEdit()\" class=\"bg-brand-orange hover:bg-brand-orangeHover text-white font-bold px-4 py-2 rounded-lg text-sm transition flex items-center gap-1.5 hidden\">\n <i data-lucide=\"edit-3\" class=\"w-4 h-4\"><\/i>\n Ubah Jadwal\n <\/button>\n <\/div>\n <button onclick=\"closeViewModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 font-semibold px-4 py-2 rounded-lg text-sm transition\">\n Tutup\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"confirm-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-md overflow-hidden transform transition-all animate-fadeIn\">\n <div class=\"bg-rose-700 text-white p-5 flex items-center gap-3\">\n <div class=\"bg-rose-800 p-2 rounded-lg text-white\">\n <i data-lucide=\"alert-triangle\" class=\"w-6 h-6\"><\/i>\n <\/div>\n <div>\n <h3 class=\"font-bold text-lg\">Konfirmasi Tindakan<\/h3>\n <\/div>\n <\/div>\n <div class=\"p-6\">\n <p class=\"text-sm text-slate-600 leading-relaxed\" id=\"confirm-modal-text\">Apakah Anda yakin ingin membebaskan\/mengosongkan jadwal pada sesi ini?<\/p>\n \n <div class=\"flex items-center justify-end gap-3 mt-6\">\n <button onclick=\"closeConfirmModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 font-semibold px-4 py-2 rounded-lg text-sm transition\">\n Batal\n <\/button>\n <button id=\"btn-confirm-execute\" class=\"bg-rose-600 hover:bg-rose-700 text-white font-bold px-5 py-2 rounded-lg text-sm transition\">\n Ya, Kosongkan Sesi\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n\n \n <script>\n \/\/ ==========================================\n \/\/ KONFIGURASI DATABASE (GOOGLE SPREADSHEET)\n \/\/ ==========================================\n const GOOGLE_SCRIPT_URL = \"https:\/\/script.google.com\/macros\/s\/AKfycbzUisESHmKYEJbLrKyNQUjNVDExqTgWZNWrDtN7p5PywBB2CM859xZvmISVQtmunYZUWw\/exec\"; \n\n \/\/ 1. DATA STRUCTURES & DEFINITIONS\n const sessions = [\n { id: 1, label: \"Sesi 1\", time: \"08:00 - 09:20\" }, \n { id: 2, label: \"Sesi 2\", time: \"09:30 - 10:50\" }, \n { id: 3, label: \"Sesi 3\", time: \"11:00 - 12:20\" }, \n { id: 4, label: \"Sesi 4\", time: \"13:00 - 14:20\" }, \n { id: 5, label: \"Sesi 5\", time: \"14:30 - 16:00\" } \n ];\n\n const authorizedUsers = {\n \"kaprodi.kpi@uinsuka.ac.id\": { name: \"Saptoni, S.Ag, M.A.\", prodi: \"Komunikasi dan Penyiaran Islam (KPI)\", pass: \"kpi123\", nip: \"197302211999031002\" },\n \"kaprodi.bki@uinsuka.ac.id\": { name: \"Zaen Musyrifin, S.Sos.I, M.Pd.I\", prodi: \"Bimbingan dan Konseling Islam (BKI)\", pass: \"bki123\", nip: \"199004280000001301\" },\n \"kaprodi.pmi@uinsuka.ac.id\": { name: \"Siti Aminah, S.Sos.I., M.Si.\", prodi: \"Pengembangan Masyarakat Islam (PMI)\", pass: \"pmi123\", nip: \"198308112011012010\" },\n \"kaprodi.md@uinsuka.ac.id\": { name: \"Munif Solihan, S.Sos.l., MPA.\", prodi: \"Manajemen Dakwah (MD)\", pass: \"md123\", nip: \"198512092019031002\" },\n \"kaprodi.iks@uinsuka.ac.id\": { name: \"Muhammad Izzul Haq, S.Sos., M.Sc. Ph.D.\", prodi: \"Ilmu Kesejahteraan Sosial (IKS)\", pass: \"iks123\", nip: \"198108232009011007\" },\n \"kaprodi.mbki@uinsuka.ac.id\": { name: \"Moh. Khoerul Anwar, S.Pd., M.Pd., Ph.D.\", prodi: \"Magister Bimbingan dan Konseling Islam (MBKI)\", pass: \"mbki123\", nip: \"199111010000001301\" },\n \"kaprodi.mpmi@uinsuka.ac.id\": { name: \"Prof. Dr. Hj. Sriharini, S.Ag., M.Si.\", prodi: \"Magister Pengembangan Masyarakat Islam (MPMI)\", pass: \"mpmi123\", nip: \"197105261997032001\" },\n \"kaprodi.mkpi@uinsuka.ac.id\": { name: \"Dr. Abdul Rozak, M.Pd.\", prodi: \"Magister Komunikasi dan Penyiaran Islam (MKPI)\", pass: \"mkpi123\", nip: \"196710061994031003\" },\n \"kaprodi.mks@uinsuka.ac.id\": { name: \"Muh. Ulil Absor, S.H.I., M.A., Ph.D.\", prodi: \"Magister Kesjahteraan Sosial (MKS)\", pass: \"mks123\", nip: \"198010182009011012\" }\n };\n\n \/\/ Database Dosen FDK UIN Sunan Kalijaga\n const lecturerDatabase = [\n \"Prof. Dr. Hj Nurjannah, M.Si.\",\n \"Prof. Dr. Hj Casmini, S.Ag, M.Si.\",\n \"Prof. Dr. Pajar Hatma Indra Jaya, S.Sos, M.Si.\",\n \"Prof. Dr. Hj. Sriharini, S.Ag., M.Si.\",\n \"Prof. Hj. Alimatul Qibtiyah, S.Ag., M.Si., M.A, Ph.D.\",\n \"Prof. Dr. Arif Maftuhin, M.Ag., M.A.I.S\",\n \"Prof. Dr. Abdur Rozaki, S.Ag., M.Si.\",\n \"Prof. Dr. Moch. Nur Ichwan, S.Ag., M.A.\",\n \"Prof. Siti Syamsiatun, M.A., Ph.D.\",\n \"Drs. H. Moh. Abu Suhud, M.Pd.\",\n \"Drs. Mokh. Nazili, M.Pd.\",\n \"Dr. H. Zainudin, M.Ag.\",\n \"Dr. H. Hamdan Daulay , M.Si., M.A.\",\n \"Dr. Abdul Rozak, M.Pd.\",\n \"Dr. Hikmah Endraswati, SE., M.Si\",\n \"Drs. Lathiful Khuluq, M.A., B.S.W., Ph.D.\",\n \"Dr. H. Andy Dermawan, M.Ag\",\n \"Drs. Muhammad Sahlan, M.Si.\",\n \"Dr. Irsyadunnas, M.Ag.\",\n \"Dr. H. Okrisal Eka Putra Lc., M.Ag\",\n \"Nailul Falah, S.Ag., M.Si.\",\n \"Ro'fah, M.A., Ph.D.\",\n \"Dr. Muhammad Zamroni, S.Sos.I, M.Si.\",\n \"Dr. Hj. Mikhriani, M.M.\",\n \"Drs. H. Noor Hamid, M.Pd.\",\n \"Dr. H. Rifa'i, M.A.\",\n \"Drs. H. Muhammad Hafiun, M.Pd.\",\n \"Dra. Hj. Evi Septiani Tavip Hayati M.Si.\",\n \"Dra. Hj. Anisah Indriati, M.Si.\",\n \"Drs. M. Rosyid Ridla, M.Si.\",\n \"M. Toriq Nurmadiansyah, S.Ag, M.Si.\",\n \"Dra. Siti Fatimah, M.Pd.\",\n \"Slamet, S.Ag. M.Si.\",\n \"Dr. Khadiq, S.Ag., M.Hum.\",\n \"Dr. H. Muhsin, S.Ag, M.A., M.Pd.\",\n \"Dr. Maryono, S.Ag., M.Pd.\",\n \"Dr. Aryan Torrido, S.E., M.Si.\",\n \"Dr. Asep Jahidin, M.Si\",\n \"Dra. Nurmahni, M.Ag.\",\n \"Hj. Early Maghfiroh Innayati, S.Ag., M.Si.\",\n \"A. Said Hasan Basri, S.Psi., M.Si.\",\n \"Aris Risdiana, S.Sos.I., M.M.\",\n \"Siti Solechah, Sos.I, M.Si.\",\n \"Siti Aminah, S.Sos.I., M.Si.\",\n \"Dr. Nanang Mizwar Hasyim, S.Sos., M.Si.\",\n \"Mochammad Sinung Restendy, M.Sos.\",\n \"Ahmad Izudin, S.Sos.I., M.Si\",\n \"Ferra Puspito Sari, M.Pd.\",\n \"Beti Nur Hayati, M.A.\",\n \"Anggi Jatmiko, M.A.\",\n \"Arya Fendha Ibnu Shina, M.Si\",\n \"Muhammad Lutfi Habibi, M.A.\",\n \"Achmad Muhammad, M.Ag.\",\n \"Andayani, SIP., MSW.\",\n \"Saptoni, S.Ag, M.A.\",\n \"Hj. Noorkamilah, S.Ag,M.Si.\",\n \"Muh. Ulil Absor, S.H.I., M.A., Ph.D.\",\n \"Muhammad Izzul Haq, S.Sos., M.Sc. Ph.D.\",\n \"Khotibul Umam, M.Si.\",\n \"Muhammad Irfa'i Muslim, M.Si.\",\n \"Munif Solihan, S.Sos.l., MPA.\",\n \"Citra Widyastuti, M.Psi.\",\n \"Taufik Rahman, M.Sos.\",\n \"Muhammad Diak Udin, M.Sos.\",\n \"Sudharno Dwi Yuwono, M.Pd.\",\n \"Dr. Muhamad Rudi Wijaya, M.Pd.I\",\n \"Nur Fitriyani Hardi, M.Psi.\",\n \"Seiren Ikhtiara, M.A.\",\n \"Moh. Khoerul Anwar, S.Pd., M.Pd., Ph.D.\",\n \"Shofi'unnafi, M.M.\",\n \"Idan Ramdani, M.A\",\n \"Rahadiyand Aditya, M.A.\",\n \"Nitra Galih Imansari M.Sos.\",\n \"Bayu Mitra Adyatama, M.A.P., M.Pol.Sc.\",\n \"Dr. Wulan Suci Rachmadani, S.E., M.Si.\",\n \"Dr. Festy Mahanani Mulyaningrum, Mph\",\n \"Widowati Maisarah, S.IP., MA\",\n \"Irawan Wibisono, M.I.Kom\",\n \"Arin Mamlakah Kalamika, M.A.\",\n \"Halimatus Sa'di ah, S.I.Kom, M.I.Kom.\",\n \"Dian Eka Permanasari, S.Ds., M.A.\",\n \"Nurul Fajriah Prahastuti, S.Psi., M.A.\",\n \"Muhamad Rashif Hilmi, S.Si., M.Sc.\",\n \"Zaen Musyrifin, S.Sos.I, M.Pd.I\",\n \"Hj. Abidah Muflihati, S.Th.I., M.Si.\",\n \"Suharto, M.A., Ph.D\"\n ];\n\n \/\/ App States\n let currentUser = null; \n let currentSchedules = []; \n let deletedSlots = []; \n\n let activeSelection = {\n date: \"\",\n room: 0,\n session: 0\n };\n\n \/\/ ==================== SMART & BULLETPROOF DATE NORMALIZATION ====================\n function normalizeDate(dateVal) {\n if (!dateVal) return \"\";\n let strVal = String(dateVal).trim();\n \n \/\/ 1. Jika ini format ISO penuh yang memiliki info waktu (ada 'T'), parse ke local time\n if (strVal.includes(\"T\")) {\n try {\n const dateObj = new Date(strVal);\n if (!isNaN(dateObj.getTime())) {\n const yyyy = dateObj.getFullYear();\n const mm = String(dateObj.getMonth() + 1).padStart(2, '0');\n const dd = String(dateObj.getDate()).padStart(2, '0');\n return `${yyyy}-${mm}-${dd}`;\n }\n } catch (e) {\n console.error(\"Gagal parse ISO Date:\", e);\n }\n }\n \n \/\/ 2. Jika format murni YYYY-MM-DD atau YYYY\/MM\/DD (tanpa waktu)\n if (\/^\\d{4}[-\/]\\d{1,2}[-\/]\\d{1,2}$\/.test(strVal)) {\n const parts = strVal.split(\/[-\/]\/);\n let y = parts[0];\n let m = parts[1].padStart(2, '0');\n let d = parts[2].padStart(2, '0');\n return `${y}-${m}-${d}`;\n }\n \n \/\/ 3. Jika format murni DD-MM-YYYY atau DD\/MM\/YYYY\n if (\/^\\d{1,2}[-\/]\\d{1,2}[-\/]\\d{4}$\/.test(strVal)) {\n const parts = strVal.split(\/[-\/]\/);\n let d = parts[0].padStart(2, '0');\n let m = parts[1].padStart(2, '0');\n let y = parts[2];\n return `${y}-${m}-${d}`;\n }\n\n \/\/ 4. Cadangan fallback aman dari timezone shift\n try {\n const dateObj = new Date(strVal);\n if (!isNaN(dateObj.getTime())) {\n const yyyy = dateObj.getFullYear();\n const mm = String(dateObj.getMonth() + 1).padStart(2, '0');\n const dd = String(dateObj.getDate()).padStart(2, '0');\n return `${yyyy}-${mm}-${dd}`;\n }\n } catch (e) {}\n\n return strVal;\n }\n\n function isFriday(dateVal) {\n const normalized = normalizeDate(dateVal);\n if (!normalized) return false;\n const parts = normalized.split('-');\n const dateObj = new Date(parts[0], parts[1] - 1, parts[2]);\n return dateObj.getDay() === 5;\n }\n\n \/\/ ==================== GET READABLE INDONESIAN DATE ====================\n function getReadableDate(dateString) {\n const normalized = normalizeDate(dateString);\n if (!normalized) return \"\";\n const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };\n const dateObj = new Date(normalized);\n return dateObj.toLocaleDateString('id-ID', options);\n }\n\n \/\/ ==================== ALERT MESSAGE (TOAST SYSTEM) ====================\n function alertMessage(msg) {\n const toast = document.createElement(\"div\");\n toast.className = \"fixed bottom-5 right-5 bg-slate-900 text-white text-xs font-semibold px-4 py-3 rounded-lg z-50 flex items-center gap-2 border-l-4 border-brand-orange animate-fadeIn shadow-lg\";\n toast.innerHTML = `<i data-lucide=\"info\" class=\"w-4 h-4 text-brand-orange shrink-0\"><\/i> <span>${msg}<\/span>`;\n document.body.appendChild(toast);\n lucide.createIcons();\n setTimeout(() => {\n toast.remove();\n }, 4000);\n }\n\n \/\/ Helper function: Mapping Kaprodi Email to Prodi code\n function getProdiCodeByEmail(email) {\n if (!email) return \"KPI\";\n const emailLower = email.toLowerCase();\n if (emailLower.includes(\"kpi\") && emailLower.includes(\"kaprodi.m\")) return \"M-KPI\";\n if (emailLower.includes(\"kpi\")) return \"KPI\";\n \n if (emailLower.includes(\"bki\") && emailLower.includes(\"kaprodi.m\")) return \"M-BKI\";\n if (emailLower.includes(\"bki\")) return \"BKI\";\n \n if (emailLower.includes(\"pmi\") && emailLower.includes(\"kaprodi.m\")) return \"M-PMI\";\n if (emailLower.includes(\"pmi\")) return \"PMI\";\n \n if (emailLower.includes(\"md\")) return \"MD\";\n if (emailLower.includes(\"iks\") && !emailLower.includes(\"kaprodi.m\")) return \"IKS\";\n if (emailLower.includes(\"mks\") || (emailLower.includes(\"iks\") && emailLower.includes(\"kaprodi.m\"))) return \"M-KS\";\n \n return \"KPI\";\n }\n\n window.onload = function() {\n setToToday();\n \n const savedUser = localStorage.getItem(\"munakosah_user\");\n if (savedUser) {\n currentUser = JSON.parse(savedUser);\n updateAuthUI();\n }\n\n populateLecturerDropdowns();\n loadSchedules();\n lucide.createIcons();\n };\n\n document.addEventListener(\"click\", function(event) {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n prefixes.forEach(prefix => {\n const dropdownContainer = document.getElementById(`dropdown-${prefix}`);\n if (dropdownContainer && !dropdownContainer.contains(event.target)) {\n const menu = document.getElementById(`${prefix}-menu`);\n if (menu) menu.classList.add(\"hidden\");\n }\n });\n });\n\n function populateLecturerDropdowns() {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n \n prefixes.forEach(prefix => {\n const listContainer = document.getElementById(`${prefix}-list`);\n if (!listContainer) return;\n \n listContainer.innerHTML = \"\";\n \n const clearLi = document.createElement(\"li\");\n clearLi.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-slate-400 italic text-xs\";\n clearLi.innerText = \"-- Bersihkan Pilihan --\";\n clearLi.onclick = () => selectLecturerOption(prefix, \"\", \"-- Pilih Nama Dosen --\");\n listContainer.appendChild(clearLi);\n\n lecturerDatabase.forEach(dosen => {\n const li = document.createElement(\"li\");\n li.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-slate-700 text-xs font-medium transition duration-150\";\n li.innerText = dosen;\n li.onclick = () => selectLecturerOption(prefix, dosen, dosen);\n listContainer.appendChild(li);\n });\n\n const manualLi = document.createElement(\"li\");\n manualLi.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-brand-orange font-bold text-xs border-t border-slate-100 transition duration-150\";\n manualLi.innerText = \"\u270d\ufe0f Ketik Nama Manual...\";\n manualLi.onclick = () => selectLecturerOption(prefix, \"manual\", \"\u270d\ufe0f Ketik Nama Manual...\");\n listContainer.appendChild(manualLi);\n });\n }\n\n function toggleDropdown(prefix) {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n prefixes.forEach(p => {\n if (p !== prefix) {\n const menu = document.getElementById(`${p}-menu`);\n if (menu) menu.classList.add(\"hidden\");\n }\n });\n\n const menu = document.getElementById(`${prefix}-menu`);\n const isHidden = menu.classList.contains(\"hidden\");\n if (isHidden) {\n menu.classList.remove(\"hidden\");\n const searchInput = document.getElementById(`${prefix}-search`);\n searchInput.value = \"\";\n filterDropdown(prefix);\n setTimeout(() => searchInput.focus(), 50);\n } else {\n menu.classList.add(\"hidden\");\n }\n }\n\n function filterDropdown(prefix) {\n const query = document.getElementById(`${prefix}-search`).value.toLowerCase();\n const listItems = document.getElementById(`${prefix}-list`).getElementsByTagName(\"li\");\n \n for (let i = 0; i < listItems.length; i++) {\n const itemText = listItems[i].innerText.toLowerCase();\n if (listItems[i].classList.contains(\"italic\") || listItems[i].classList.contains(\"text-brand-orange\")) {\n listItems[i].style.display = \"\";\n } else {\n if (itemText.includes(query)) {\n listItems[i].style.display = \"\";\n } else {\n listItems[i].style.display = \"none\";\n }\n }\n }\n }\n\n function selectLecturerOption(prefix, value, displayText) {\n const hiddenInput = document.getElementById(`${prefix}-value`);\n const displaySpan = document.getElementById(`${prefix}-display`);\n const manualInput = document.getElementById(`${prefix}-manual`);\n \n hiddenInput.value = value;\n displaySpan.innerText = displayText;\n displaySpan.className = value === \"\" ? \"text-slate-400\" : \"text-slate-700 font-semibold\";\n\n if (value === \"manual\") {\n manualInput.classList.remove(\"hidden\");\n manualInput.required = true;\n setTimeout(() => manualInput.focus(), 50);\n } else {\n manualInput.classList.add(\"hidden\");\n manualInput.required = false;\n manualInput.value = \"\";\n }\n\n document.getElementById(`${prefix}-menu`).classList.add(\"hidden\");\n }\n\n function setToToday() {\n const today = new Date();\n const yyyy = today.getFullYear();\n let mm = today.getMonth() + 1;\n let dd = today.getDate();\n\n if (dd < 10) dd = '0' + dd;\n if (mm < 10) mm = '0' + mm;\n\n const formattedToday = yyyy + '-' + mm + '-' + dd;\n document.getElementById(\"selected-date\").value = formattedToday;\n loadSchedules();\n }\n\n function updateDbStatus(status) {\n const container = document.getElementById(\"db-connection-status\");\n if (!container) return;\n\n if (!GOOGLE_SCRIPT_URL) {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-300 bg-slate-100 text-xs font-semibold text-slate-500\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-slate-400\"><\/span>\n <\/span>\n <span>Lokal (Offline)<\/span>\n `;\n return;\n }\n\n if (status === 'connecting') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-brand-orange\/30 bg-brand-orangeLight text-xs font-semibold text-brand-orange\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-brand-orange opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-brand-orange\"><\/span>\n <\/span>\n <span class=\"flex items-center gap-1\">Menghubungkan Database... <i data-lucide=\"refresh-cw\" class=\"w-3.5 h-3.5 animate-spin\"><\/i><\/span>\n `;\n } else if (status === 'connected') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-emerald-300 bg-emerald-50 text-xs font-semibold text-emerald-700\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-emerald-500\"><\/span>\n <\/span>\n <span>Database Terhubung (Online)<\/span>\n `;\n } else if (status === 'offline') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-rose-300 bg-rose-50 text-xs font-semibold text-rose-700 cursor-pointer hover:bg-rose-100 transition\";\n container.setAttribute(\"onclick\", \"loadSchedules()\");\n container.setAttribute(\"title\", \"Klik untuk menyinkronkan ulang database\");\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-rose-500\"><\/span>\n <\/span>\n <span class=\"flex items-center gap-1\">Mode Lokal (Offline) <i data-lucide=\"refresh-cw\" class=\"w-3 h-3\"><\/i><\/span>\n `;\n }\n lucide.createIcons();\n }\n\n async function loadSchedules() {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n document.getElementById(\"display-date-string\").innerText = getReadableDate(selectedDate);\n\n const ketentuanText = document.getElementById(\"ketentuan-sesi-text\");\n if (isFriday(selectedDate)) {\n ketentuanText.innerHTML = `<span class=\"text-rose-600 font-bold\">Khusus Hari Jumat:<\/span> Sesi 3 (11:00-12:20) ditiadakan untuk Sholat Jumat. Kapasitas harian adalah 12 sesi.`;\n } else {\n ketentuanText.innerHTML = `Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: Kosong, Putih: Terisi.`;\n }\n\n loadLocalSchedules(selectedDate);\n renderScheduleGrid();\n updateStats();\n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n const res = await fetch(GOOGLE_SCRIPT_URL);\n const rawData = await res.json();\n \n const serverSchedules = rawData.filter(item => normalizeDate(item.tanggal) === selectedDate);\n let merged = [];\n \n serverSchedules.forEach(serverItem => {\n const slotKey = `${normalizeDate(serverItem.tanggal)}-${serverItem.ruang}-${serverItem.sesi}`;\n if (!deletedSlots.includes(slotKey)) {\n merged.push(serverItem);\n }\n });\n\n currentSchedules.forEach(localItem => {\n const existsInServer = merged.some(serverItem => \n parseInt(serverItem.sesi) === parseInt(localItem.sesi) && \n parseInt(serverItem.ruang) === parseInt(localItem.ruang) &&\n normalizeDate(serverItem.tanggal) === normalizeDate(localItem.tanggal)\n );\n if (!existsInServer) {\n merged.push(localItem);\n }\n });\n\n currentSchedules = merged;\n renderScheduleGrid();\n updateStats();\n updateDbStatus('connected');\n } catch (e) {\n console.error(\"Gagal sinkronisasi background dengan Google Sheets.\", e);\n updateDbStatus('offline');\n }\n } else {\n updateDbStatus('offline');\n }\n }\n\n function loadLocalSchedules(selectedDate) {\n const stored = localStorage.getItem(\"munakosah_schedules\");\n if (stored) {\n const allSchedules = JSON.parse(stored);\n currentSchedules = allSchedules.filter(item => normalizeDate(item.tanggal) === selectedDate);\n } else {\n currentSchedules = [];\n }\n }\n\n \/\/ ==================== HEADER SETTER ====================\n function updateModalHeaderByType() {\n const isProposal = document.getElementById(\"type-proposal\").checked;\n const modalTitle = document.getElementById(\"modal-title\");\n const labelTitle = document.getElementById(\"label-field-title\");\n const fieldTitle = document.getElementById(\"field-title\");\n\n if (isProposal) {\n modalTitle.innerText = \"Atur Sesi Sidang Proposal Baru\";\n labelTitle.innerText = \"Judul Proposal Skripsi \/ Tugas Akhir\";\n fieldTitle.placeholder = \"Masukkan judul proposal lengkap mahasiswa\";\n } else {\n modalTitle.innerText = \"Atur Sesi Sidang Munaqosah Baru\";\n labelTitle.innerText = \"Judul Skripsi \/ Tugas Akhir\";\n fieldTitle.placeholder = \"Masukkan judul skripsi lengkap mahasiswa\";\n }\n }\n\n function renderScheduleGrid() {\n const tbody = document.getElementById(\"schedule-grid-body\");\n tbody.innerHTML = \"\";\n\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n const isDayFriday = isFriday(selectedDate);\n\n sessions.forEach(sess => {\n const tr = document.createElement(\"tr\");\n tr.className = \"hover:bg-slate-50\/50 transition\";\n\n const isFridaySesi3 = isDayFriday && sess.id === 3;\n\n let tdTime = `\n <td class=\"py-4 px-4 text-center border-r border-slate-200 ${isFridaySesi3 ? 'bg-slate-100 text-slate-400' : 'bg-slate-50'}\">\n <span class=\"block font-bold text-sm ${isFridaySesi3 ? 'text-slate-400 line-through' : 'text-slate-800'}\">${sess.label}<\/span>\n <span class=\"block text-xs font-semibold mt-1 rounded-full py-0.5 border ${isFridaySesi3 ? 'bg-slate-200 border-slate-300 text-slate-500' : 'bg-brand-greenLight border-brand-green\/20 text-brand-green'}\">${sess.time}<\/span>\n <\/td>\n `;\n tr.innerHTML = tdTime;\n\n for (let room = 1; room <= 3; room++) {\n let tdRoom = \"\";\n\n if (isFridaySesi3) {\n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-middle text-center bg-slate-100 text-slate-400 font-medium\">\n <div class=\"flex flex-col items-center justify-center py-4 gap-1 opacity-70\">\n <i data-lucide=\"moon-star\" class=\"w-5 h-5 text-brand-orange\"><\/i>\n <span class=\"text-xs font-bold uppercase tracking-wider text-slate-500\">Sholat Jumat<\/span>\n <span class=\"text-[10px] text-slate-400\">Sesi Tidak Tersedia<\/span>\n <\/div>\n <\/td>\n `;\n } else {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === sess.id && parseInt(item.ruang) === room);\n \n if (allocation) {\n const isOwner = currentUser && allocation.createdByEmail === currentUser.email;\n const sidangType = allocation.jenisSidang || \"Sidang Munaqosah\";\n const isProposal = sidangType === \"Sidang Proposal\";\n \n const badgeColorClass = isProposal \n ? \"bg-amber-100 text-amber-900 border-amber-200\" \n : \"bg-brand-greenLight text-brand-greenDark border-brand-green\/20\";\n \n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-top transition-all\" id=\"cell-${room}-${sess.id}\">\n <div onclick=\"handleSlotClick(${room}, ${sess.id}, true)\" class=\"bg-white border border-slate-200 rounded-lg p-3 transition duration-200 cursor-pointer h-full flex flex-col justify-between relative group shadow-sm hover:shadow-md\">\n <div>\n <div class=\"flex justify-between items-start gap-1\">\n <span class=\"text-xs font-bold text-slate-800 block break-words flex-1 pr-2\">${allocation.mahasiswa}<\/span>\n <span class=\"text-[9px] bg-slate-100 text-slate-600 font-bold px-1.5 py-0.5 rounded uppercase shrink-0\">${allocation.nim}<\/span>\n <\/div>\n <div class=\"mt-1 flex items-center justify-between\">\n <span class=\"text-[9px] ${badgeColorClass} font-bold px-2 py-0.5 border rounded-md\">\n ${sidangType}\n <\/span>\n <span class=\"text-[10px] text-brand-orange font-semibold truncate block max-w-[100px]\">${allocation.prodi}<\/span>\n <\/div>\n <p class=\"text-[11px] text-slate-500 italic mt-2 line-clamp-2 leading-tight\">\"${allocation.judul}\"<\/p>\n <\/div>\n \n <div class=\"mt-3 pt-2 border-t border-slate-100 flex justify-between items-center text-[10px] text-slate-400\">\n <span class=\"flex items-center gap-1 truncate max-w-[120px]\">\n <i data-lucide=\"user-check\" class=\"w-3 h-3 text-brand-green\"><\/i>\n ${allocation.pembimbing ? allocation.pembimbing.split(',')[0] : '-'}\n <\/span>\n \n ${isOwner ? \n `<span class=\"text-[9px] bg-brand-orangeLight text-brand-orange px-1.5 py-0.5 rounded font-bold flex items-center gap-0.5 animate-pulse\">\n <i data-lucide=\"edit-3\" class=\"w-2.5 h-2.5\"><\/i> Edit\n <\/span>` : \n `<span class=\"text-[9px] bg-slate-50 text-slate-400 px-1.5 py-0.5 rounded flex items-center gap-0.5\">\n <i data-lucide=\"lock\" class=\"w-2.5 h-2.5\"><\/i> Detail\n <\/span>`\n }\n <\/div>\n <\/div>\n <\/td>\n `;\n } else {\n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-middle text-center transition-all bg-brand-greenLight\/20 hover:bg-brand-greenLight\/50 cursor-pointer\" onclick=\"handleSlotClick(${room}, ${sess.id}, false)\">\n <div class=\"flex flex-col items-center justify-center py-4 text-brand-green gap-1 opacity-70 hover:opacity-100 transition\">\n <i data-lucide=\"plus\" class=\"w-5 h-5\"><\/i>\n <span class=\"text-xs font-bold uppercase tracking-wider\">Tersedia<\/span>\n <span class=\"text-[10px] text-brand-green\/80 font-medium\">Klik untuk Atur<\/span>\n <\/div>\n <\/td>\n `;\n }\n }\n tr.innerHTML += tdRoom;\n }\n\n tbody.appendChild(tr);\n });\n\n lucide.createIcons();\n }\n\n function updateStats() {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n const isDayFriday = isFriday(selectedDate);\n const totalSlots = isDayFriday ? 12 : 15; \n \n const validFilledSlots = currentSchedules.filter(item => !(isDayFriday && parseInt(item.sesi) === 3));\n const filledCount = validFilledSlots.length;\n const emptyCount = Math.max(0, totalSlots - filledCount);\n\n document.getElementById(\"stats-terisi\").innerText = filledCount;\n document.getElementById(\"stats-terisi-denom\").innerText = `\/ ${totalSlots} Sesi`;\n document.getElementById(\"stats-tersedia\").innerText = emptyCount;\n }\n\n function handleSlotClick(room, sessionId, isFilled) {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n \n if (isFriday(selectedDate) && sessionId === 3) {\n alertMessage(\"Sesi ini ditiadakan karena pelaksanaan ibadah Sholat Jumat.\");\n return;\n }\n\n activeSelection = {\n date: selectedDate,\n room: room,\n session: sessionId\n };\n\n if (isFilled) {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === sessionId && parseInt(item.ruang) === room);\n openViewModal(allocation);\n } else {\n if (currentUser) {\n openBookingModal(null, false);\n } else {\n alertMessage(\"Harap login sebagai Petugas Kaprodi untuk meregistrasikan jadwal.\");\n openLoginModal();\n }\n }\n }\n\n function openLoginModal() {\n document.getElementById(\"login-error-msg\").classList.add(\"hidden\");\n document.getElementById(\"login-modal\").classList.remove(\"hidden\");\n }\n\n function closeLoginModal() {\n document.getElementById(\"login-modal\").classList.add(\"hidden\");\n }\n\n function handleLogin(e) {\n e.preventDefault();\n const email = document.getElementById(\"login-email\").value;\n const passInput = document.getElementById(\"login-password\");\n const pass = passInput.value;\n\n const matchedUser = authorizedUsers[email];\n if (matchedUser && matchedUser.pass === pass) {\n currentUser = {\n email: email,\n name: matchedUser.name,\n prodi: matchedUser.prodi,\n nip: matchedUser.nip\n };\n localStorage.setItem(\"munakosah_user\", JSON.stringify(currentUser));\n updateAuthUI();\n closeLoginModal();\n alertMessage(`Selamat Datang, ${currentUser.name}!`);\n } else {\n document.getElementById(\"login-error-msg\").classList.remove(\"hidden\");\n passInput.value = \"\";\n passInput.focus();\n }\n }\n\n function handleLogout() {\n currentUser = null;\n localStorage.removeItem(\"munakosah_user\");\n \n const passInput = document.getElementById(\"login-password\");\n if (passInput) passInput.value = \"\";\n \n updateAuthUI();\n alertMessage(\"Sesi Petugas Berakhir.\");\n }\n\n function updateAuthUI() {\n const container = document.getElementById(\"auth-section\");\n if (currentUser) {\n container.innerHTML = `\n <div class=\"flex items-center gap-3\">\n <div class=\"text-right hidden sm:block\">\n <span class=\"block text-xs font-bold text-slate-700\">${currentUser.name}<\/span>\n <span class=\"block text-[10px] text-brand-orange font-semibold\">${currentUser.prodi}<\/span>\n <\/div>\n <button onclick=\"handleLogout()\" class=\"bg-rose-700\/80 hover:bg-rose-800 text-white font-medium px-3 py-1.5 rounded-lg text-xs transition flex items-center gap-1 border border-rose-600\">\n <i data-lucide=\"log-out\" class=\"w-3.5 h-3.5\"><\/i>\n Keluar\n <\/button>\n <\/div>\n `;\n } else {\n container.innerHTML = `\n <button onclick=\"openLoginModal()\" class=\"flex items-center gap-2 bg-brand-orange hover:bg-brand-orangeHover text-white font-semibold px-4 py-2 rounded-lg transition text-sm shadow-md\">\n <i data-lucide=\"log-in\" class=\"w-4 h-4\"><\/i>\n Login Kaprodi\n <\/button>\n `;\n }\n lucide.createIcons();\n renderScheduleGrid();\n }\n\n \/\/ ==================== BOOKING CORE SERVICE ====================\n function openBookingModal(data, isEdit) {\n const modal = document.getElementById(\"booking-modal\");\n const sessDetails = sessions.find(s => s.id === activeSelection.session);\n\n document.getElementById(\"meta-date\").innerText = getReadableDate(activeSelection.date);\n document.getElementById(\"meta-room\").innerText = \"Ruang \" + activeSelection.room;\n document.getElementById(\"meta-session\").innerText = sessDetails.label + \" (\" + sessDetails.time + \")\";\n\n if (isEdit && data) {\n const currentType = data.jenisSidang || \"Sidang Munaqosah\";\n if (currentType === \"Sidang Proposal\") {\n document.getElementById(\"type-proposal\").checked = true;\n } else {\n document.getElementById(\"type-munaqosah\").checked = true;\n }\n\n updateModalHeaderByType();\n \n document.getElementById(\"field-student\").value = data.mahasiswa;\n document.getElementById(\"field-nim\").value = data.nim;\n document.getElementById(\"field-prodi\").value = data.prodi;\n document.getElementById(\"field-title\").value = data.judul;\n\n setLecturerFieldValue(\"field-advisor\", data.pembimbing);\n setLecturerFieldValue(\"field-secretary\", data.sekretaris);\n setLecturerFieldValue(\"field-examiner1\", data.penguji1);\n setLecturerFieldValue(\"field-examiner2\", data.penguji2);\n\n document.getElementById(\"btn-delete\").classList.remove(\"hidden\");\n document.getElementById(\"btn-print\").classList.remove(\"hidden\");\n document.getElementById(\"btn-save-submit\").innerHTML = `<i data-lucide=\"save\" class=\"w-4 h-4\"><\/i> Perbarui`;\n } else {\n document.getElementById(\"type-munaqosah\").checked = true;\n updateModalHeaderByType();\n\n document.getElementById(\"field-student\").value = \"\";\n document.getElementById(\"field-nim\").value = \"\";\n \n \/\/ SMART MATCHING: Set program studi sesuai prodi aktif Kaprodi yang login\n const prodiSelect = document.getElementById(\"field-prodi\");\n if (currentUser && currentUser.email) {\n prodiSelect.value = getProdiCodeByEmail(currentUser.email);\n } else {\n prodiSelect.value = \"KPI\";\n }\n\n document.getElementById(\"field-title\").value = \"\";\n\n resetLecturerField(\"field-advisor\");\n resetLecturerField(\"field-secretary\");\n resetLecturerField(\"field-examiner1\");\n resetLecturerField(\"field-examiner2\");\n\n document.getElementById(\"btn-delete\").classList.add(\"hidden\");\n document.getElementById(\"btn-print\").classList.add(\"hidden\");\n document.getElementById(\"btn-save-submit\").innerHTML = `<i data-lucide=\"save\" class=\"w-4 h-4\"><\/i> Simpan`;\n }\n\n modal.classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function setLecturerFieldValue(fieldPrefix, name) {\n const hiddenInput = document.getElementById(`${fieldPrefix}-value`);\n const displaySpan = document.getElementById(`${fieldPrefix}-display`);\n const manualInput = document.getElementById(`${fieldPrefix}-manual`);\n \n if (!name) {\n hiddenInput.value = \"\";\n displaySpan.innerText = \"-- Pilih Nama Dosen --\";\n displaySpan.className = \"text-slate-400\";\n manualInput.classList.add(\"hidden\");\n manualInput.value = \"\";\n manualInput.required = false;\n return;\n }\n\n if (lecturerDatabase.includes(name)) {\n hiddenInput.value = name;\n displaySpan.innerText = name;\n displaySpan.className = \"text-slate-700 font-semibold\";\n manualInput.classList.add(\"hidden\");\n manualInput.value = \"\";\n manualInput.required = false;\n } else {\n hiddenInput.value = \"manual\";\n displaySpan.innerText = \"\u270d\ufe0f Ketik Nama Manual...\";\n displaySpan.className = \"text-slate-700 font-semibold\";\n manualInput.classList.remove(\"hidden\");\n manualInput.value = name;\n manualInput.required = true;\n }\n }\n\n function getLecturerFieldValue(fieldPrefix) {\n const val = document.getElementById(`${fieldPrefix}-value`).value;\n if (val === \"manual\") {\n return document.getElementById(`${fieldPrefix}-manual`).value.trim();\n }\n return val;\n }\n\n \/\/ ==================== RESET LECTURER FIELDS ====================\n function resetLecturerField(fieldPrefix) {\n const hiddenInput = document.getElementById(`${fieldPrefix}-value`);\n const displaySpan = document.getElementById(`${fieldPrefix}-display`);\n const manual = document.getElementById(`${fieldPrefix}-manual`);\n \n hiddenInput.value = \"\";\n displaySpan.innerText = \"-- Pilih Nama Dosen --\";\n displaySpan.className = \"text-slate-400\";\n manual.classList.add(\"hidden\");\n manual.value = \"\";\n manual.required = false;\n }\n\n function closeBookingModal() {\n document.getElementById(\"booking-modal\").classList.add(\"hidden\");\n }\n\n async function handleSaveBooking(e) {\n e.preventDefault();\n\n if (!currentUser) {\n alertMessage(\"Anda harus masuk kembali.\");\n return;\n }\n\n const pembimbing = getLecturerFieldValue(\"field-advisor\");\n const sekretaris = getLecturerFieldValue(\"field-secretary\");\n const penguji1 = getLecturerFieldValue(\"field-examiner1\");\n const penguji2 = getLecturerFieldValue(\"field-examiner2\");\n\n if (!pembimbing || !sekretaris || !penguji1 || !penguji2) {\n alertMessage(\"Harap tentukan Dosen Pembimbing, Sekretaris, dan Penguji!\");\n return;\n }\n\n const activeType = document.querySelector('input[name=\"field-type\"]:checked').value;\n\n const payload = {\n id: \"MUN-\" + Date.now().toString().slice(-6),\n tanggal: normalizeDate(activeSelection.date),\n ruang: activeSelection.room,\n sesi: activeSelection.session,\n jenisSidang: activeType,\n mahasiswa: document.getElementById(\"field-student\").value,\n nim: document.getElementById(\"field-nim\").value,\n prodi: document.getElementById(\"field-prodi\").value,\n judul: document.getElementById(\"field-title\").value,\n pembimbing: pembimbing,\n sekretaris: sekretaris,\n penguji1: penguji1,\n penguji2: penguji2,\n createdBy: currentUser.name,\n createdByEmail: currentUser.email,\n createdByNip: currentUser.nip || \"\" \n };\n\n const slotKey = `${normalizeDate(payload.tanggal)}-${payload.ruang}-${payload.sesi}`;\n deletedSlots = deletedSlots.filter(key => key !== slotKey);\n\n updateLocalState(payload, \"save\");\n closeBookingModal();\n loadSchedules(); \n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n await fetch(GOOGLE_SCRIPT_URL, {\n method: \"POST\",\n mode: \"no-cors\", \n headers: {\n \"Content-Type\": \"application\/json\"\n },\n body: JSON.stringify({\n action: \"save\",\n data: payload\n })\n });\n \n alertMessage(\"Jadwal sukses disinkronkan ke Google Spreadsheet.\");\n updateDbStatus('connected');\n } catch (error) {\n console.error(\"Gagal mengirim ke Google Sheets, data tetap aman di memori lokal.\", error);\n updateDbStatus('offline');\n }\n } else {\n alertMessage(\"Jadwal sukses disimpan ke Database Lokal.\");\n }\n }\n\n \/\/ ==================== CUSTOM MODAL CONFIRMATION SERVICE ====================\n function triggerDeleteConfirmation() {\n const target = currentSchedules.find(item => \n normalizeDate(item.tanggal) === normalizeDate(activeSelection.date) && \n parseInt(item.ruang) === parseInt(activeSelection.room) && \n parseInt(item.sesi) === parseInt(activeSelection.session)\n );\n \n if (!target || !currentUser || target.createdByEmail !== currentUser.email) {\n alertMessage(\"Proteksi Keamanan: Hanya pembuat awal sesi ini yang diijinkan menghapus.\");\n return;\n }\n\n document.getElementById(\"confirm-modal-text\").innerHTML = `Apakah Anda yakin ingin membebaskan\/mengosongkan jadwal sidang atas nama mahasiswa <strong>${target.mahasiswa}<\/strong> (NIM: ${target.nim})? Tindakan ini akan segera disinkronkan ke database.`;\n \n const execBtn = document.getElementById(\"btn-confirm-execute\");\n execBtn.onclick = function() {\n closeConfirmModal();\n executeDeletion();\n };\n\n document.getElementById(\"confirm-modal\").classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function closeConfirmModal() {\n document.getElementById(\"confirm-modal\").classList.add(\"hidden\");\n }\n\n async function executeDeletion() {\n const payload = {\n tanggal: normalizeDate(activeSelection.date),\n ruang: activeSelection.room,\n sesi: activeSelection.session\n };\n\n const slotKey = `${normalizeDate(payload.tanggal)}-${payload.ruang}-${payload.sesi}`;\n if (!deletedSlots.includes(slotKey)) {\n deletedSlots.push(slotKey);\n }\n\n updateLocalState(payload, \"delete\");\n closeBookingModal();\n loadSchedules(); \n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n await fetch(GOOGLE_SCRIPT_URL, {\n method: \"POST\",\n mode: \"no-cors\",\n headers: {\n \"Content-Type\": \"application\/json\"\n },\n body: JSON.stringify({\n action: \"delete\",\n data: payload\n })\n });\n alertMessage(\"Sesi dikosongkan dari Google Spreadsheet.\");\n updateDbStatus('connected');\n } catch (e) {\n console.error(\"Gagal menghapus di Sheets background:\", e);\n updateDbStatus('offline');\n }\n } else {\n alertMessage(\"Sesi berhasil dikosongkan.\");\n }\n }\n\n function updateLocalState(payload, action) {\n let allSchedules = [];\n const stored = localStorage.getItem(\"munakosah_schedules\");\n if (stored) {\n allSchedules = JSON.parse(stored);\n }\n\n allSchedules = allSchedules.filter(item => !(\n normalizeDate(item.tanggal) === normalizeDate(payload.tanggal) &&\n parseInt(item.ruang) === parseInt(payload.ruang) &&\n parseInt(item.sesi) === parseInt(payload.sesi)\n ));\n\n if (action === \"save\") {\n allSchedules.push(payload);\n }\n\n localStorage.setItem(\"munakosah_schedules\", JSON.stringify(allSchedules));\n }\n\n \/\/ ==================== VIEW SLOT SERVICE & DETAIL INFO ====================\n function openViewModal(data) {\n const modal = document.getElementById(\"view-modal\");\n const sessDetails = sessions.find(s => s.id === parseInt(data.sesi));\n\n const isProposal = (data.jenisSidang === \"Sidang Proposal\");\n\n document.getElementById(\"view-meta-date\").innerText = getReadableDate(data.tanggal);\n document.getElementById(\"view-meta-room\").innerText = \"Ruang \" + data.ruang;\n document.getElementById(\"view-meta-session\").innerText = sessDetails.label + \" (\" + sessDetails.time + \")\";\n\n const badgeElement = document.getElementById(\"view-jenis-sidang-badge\");\n badgeElement.innerText = data.jenisSidang || \"Sidang Munaqosah\";\n if (isProposal) {\n badgeElement.className = \"col-span-2 inline-block max-w-max font-bold text-xs px-2.5 py-1 bg-amber-100 text-amber-900 rounded border border-amber-200 shadow-sm\";\n document.getElementById(\"label-view-title\").innerText = \"Judul Proposal\";\n } else {\n badgeElement.className = \"col-span-2 inline-block max-w-max font-bold text-xs px-2.5 py-1 bg-brand-greenLight text-brand-greenDark rounded border border-brand-green\/20 shadow-sm\";\n document.getElementById(\"label-view-title\").innerText = \"Judul Skripsi\";\n }\n\n document.getElementById(\"view-student\").innerText = data.mahasiswa;\n document.getElementById(\"view-nim-prodi\").innerText = data.nim + \" \/ \" + data.prodi;\n document.getElementById(\"view-title\").innerText = `\"${data.judul}\"`;\n document.getElementById(\"view-advisor\").innerText = data.pembimbing || \"-\";\n document.getElementById(\"view-secretary\").innerText = data.sekretaris || \"-\";\n document.getElementById(\"view-examiner1\").innerText = data.penguji1 || \"-\";\n document.getElementById(\"view-examiner2\").innerText = data.penguji2 || \"-\";\n\n activeSelection = {\n date: normalizeDate(data.tanggal),\n room: data.ruang,\n session: data.sesi\n };\n\n const lockBox = document.getElementById(\"protective-lock-box\");\n const lockIcon = document.getElementById(\"protective-lock-icon\");\n const lockText = document.getElementById(\"protective-lock-text\");\n const ownerEditBtn = document.getElementById(\"btn-owner-edit\");\n\n if (currentUser) {\n if (data.createdByEmail === currentUser.email) {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-brand-greenLight border border-brand-green\/20 text-brand-greenDark\";\n lockText.innerText = `Otoritas Terbuka: Jadwal ini dibuat oleh Anda (${data.createdBy}). Anda dapat mengubah atau mengosongkan jadwal ini.`;\n lockIcon.setAttribute(\"data-lucide\", \"unlock\");\n ownerEditBtn.classList.remove(\"hidden\");\n } else {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-rose-50 border border-rose-200 text-rose-800\";\n lockText.innerText = `Sesi ini dikunci oleh ${data.createdBy} (${data.prodi}). Hanya akun yang bersangkutan yang diijinkan untuk melakukan perubahan.`;\n lockIcon.setAttribute(\"data-lucide\", \"lock\");\n ownerEditBtn.classList.add(\"hidden\");\n }\n lockBox.classList.remove(\"hidden\");\n } else {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-brand-orangeLight border border-brand-orange\/20 text-slate-800\";\n lockText.innerText = `Sidang ini diverifikasi oleh ${data.createdBy}. Harap masuk dengan akun Kaprodi Anda jika ini milik Anda.`;\n lockIcon.setAttribute(\"data-lucide\", \"lock\");\n lockBox.classList.remove(\"hidden\");\n ownerEditBtn.classList.add(\"hidden\");\n }\n\n modal.classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function triggerOwnerEdit() {\n closeViewModal();\n const data = currentSchedules.find(item => \n normalizeDate(item.tanggal) === normalizeDate(activeSelection.date) && \n parseInt(item.ruang) === parseInt(activeSelection.room) && \n parseInt(item.sesi) === parseInt(activeSelection.session)\n );\n if (data) {\n openBookingModal(data, true);\n }\n }\n\n function closeViewModal() {\n document.getElementById(\"view-modal\").classList.add(\"hidden\");\n }\n\n \/\/ ==================== PRINT ENGINE RESMI ====================\n function triggerPrintFromModal() {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === parseInt(activeSelection.session) && parseInt(item.ruang) === parseInt(activeSelection.room));\n if (allocation) {\n prepareAndPrintSlip(allocation);\n }\n }\n\n function triggerPrintFromView() {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === parseInt(activeSelection.session) && parseInt(item.ruang) === parseInt(activeSelection.room));\n if (allocation) {\n prepareAndPrintSlip(allocation);\n }\n }\n\n function prepareAndPrintSlip(allocation) {\n const sessDetails = sessions.find(s => s.id === parseInt(allocation.sesi));\n const activeType = allocation.jenisSidang || \"Sidang Munaqosah\";\n const isProposal = activeType === \"Sidang Proposal\";\n\n if (isProposal) {\n document.getElementById(\"print-document-title\").innerText = \"SURAT KETERANGAN JADWAL SIDANG PROPOSAL SKRIPSI\";\n } else {\n document.getElementById(\"print-document-title\").innerText = \"SURAT KETERANGAN JADWAL SIDANG MUNAQOSAH SKRIPSI\";\n }\n \n document.getElementById(\"print-slip-id\").innerText = \"No. Berkas: FDK\/MUN\/\" + String(allocation.id).split('-').pop().toUpperCase();\n \n document.getElementById(\"print-jenis-sidang\").innerText = activeType.toUpperCase();\n document.getElementById(\"print-mahasiswa\").innerText = allocation.mahasiswa;\n document.getElementById(\"print-nim-prodi\").innerText = allocation.nim + \" \/ \" + allocation.prodi;\n document.getElementById(\"print-tanggal\").innerText = getReadableDate(allocation.tanggal);\n document.getElementById(\"print-waktu\").innerText = sessDetails.label + \" (\" + sessDetails.time + \" WIB)\";\n document.getElementById(\"print-ruang\").innerText = \"RUANGAN \" + allocation.ruang + \" (Lantai 1 Gedung FDK UIN Sunan Kalijaga)\";\n document.getElementById(\"print-judul\").innerText = `\"${allocation.judul}\"`;\n document.getElementById(\"print-pembimbing\").innerText = allocation.pembimbing || '-';\n document.getElementById(\"print-sekretaris\").innerText = allocation.sekretaris || '-';\n document.getElementById(\"print-penguji1\").innerText = allocation.penguji1 || '-';\n document.getElementById(\"print-penguji2\").innerText = allocation.penguji2 || '-';\n\n const todayStr = new Date().toLocaleDateString('id-ID', { year: 'numeric', month: 'long', day: 'numeric' });\n document.getElementById(\"print-ttd-date\").innerText = \"Yogyakarta, \" + todayStr;\n \n const verifikatorName = allocation.createdBy;\n let foundNip = \"19750812 200312 1 002\"; \n let foundProdiCode = \"Kaprodi FDK\";\n\n for (const email in authorizedUsers) {\n if (authorizedUsers[email].name === verifikatorName) {\n foundNip = authorizedUsers[email].nip;\n foundProdiCode = \"Ketua Program Studi \" + authorizedUsers[email].prodi.split(' (')[0];\n break;\n }\n }\n\n document.getElementById(\"print-ttd-role\").innerHTML = \"a.n. Dekan,<br>\" + foundProdiCode;\n document.getElementById(\"print-ttd-officer\").innerText = verifikatorName;\n document.getElementById(\"print-ttd-nip\").innerText = \"NIP. \" + foundNip;\n\n setTimeout(() => {\n window.print();\n }, 150);\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Sistem Manajemen Ruang Sidang – FDK UIN Sunan Kalijaga Sistem Ruang Sidang FDK Fakultas Dakwah dan Komunikasi \u2022 UIN Sunan Kalijaga Memuat Status Koneksi… Login Kaprodi Tanggal Pelaksanaan Sidang Hari Ini Total Sesi Terisi 0 \/ 15 Sesi Tersedia (Hijau) 15 Sesi Ketentuan Sesi Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-14","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=14"}],"version-history":[{"count":1,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions"}],"predecessor-version":[{"id":15,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions\/15"}],"wp:attachment":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=14"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":14,"date":"2026-07-07T09:37:24","date_gmt":"2026-07-07T02:37:24","guid":{"rendered":"http:\/\/rasida.uin-suka.ac.id\/home\/?page_id=14"},"modified":"2026-07-07T09:37:24","modified_gmt":"2026-07-07T02:37:24","slug":"14-2","status":"publish","type":"page","link":"http:\/\/rasida.uin-suka.ac.id\/home\/?page_id=14","title":{"rendered":""},"content":{"rendered":"\n\n\n\n \n \n Sistem Manajemen Ruang Sidang – FDK UIN Sunan Kalijaga<\/title>\n \n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n \n <script>\n tailwind.config = {\n theme: {\n extend: {\n colors: {\n brand: {\n green: '#006368', \/* Brand Green Utama *\/\n greenHover: '#004d50', \/* Hover Green *\/\n greenLight: '#e6f2f3', \/* Background Green Ringan *\/\n greenDark: '#00373a', \/* Sangat Gelap untuk Teks\/Header *\/\n orange: '#F08619', \/* Brand Orange Utama *\/\n orangeHover: '#d5710f', \/* Hover Orange *\/\n orangeLight: '#fef3e8' \/* Background Orange Ringan *\/\n }\n }\n }\n }\n }\n <\/script>\n \n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n \n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght=300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n \n <style>\n body {\n font-family: 'Inter', sans-serif;\n }\n \n .hidden {\n display: none !important;\n }\n\n \/* Custom Scrollbar for better UX in Search Dropdowns *\/\n .custom-scrollbar::-webkit-scrollbar {\n width: 6px;\n }\n .custom-scrollbar::-webkit-scrollbar-track {\n background: #f1f5f9;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb {\n background: #cbd5e1;\n border-radius: 4px;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n background: #94a3b8;\n }\n\n \/* Rotation animation for sync button *\/\n @keyframes spin-slow {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n }\n .animate-spin-slow {\n animation: spin-slow 2s linear infinite;\n }\n\n \/* ==========================================\n OFFICIAL PRINT ENGINE REPAIR (A4 FORMAT)\n ========================================== *\/\n @media print {\n html, body {\n background: #ffffff !important;\n color: #000000 !important;\n -webkit-print-color-adjust: exact !important;\n print-color-adjust: exact !important;\n }\n \/* Sembunyikan seluruh UI web utama *\/\n body * {\n visibility: hidden !important;\n }\n \/* Tampilkan area print secara eksklusif *\/\n #print-area, #print-area * {\n visibility: visible !important;\n }\n #print-area {\n position: absolute !important;\n left: 0 !important;\n top: 0 !important;\n width: 100% !important;\n max-width: 100% !important;\n display: block !important;\n color: black !important;\n background: white !important;\n font-family: 'Times New Roman', Times, serif !important;\n line-height: 1.4 !important;\n }\n \/* Pengaturan Kertas A4 Portrait *\/\n @page {\n size: A4 portrait;\n margin: 1.5cm;\n }\n .no-print {\n display: none !important;\n }\n \/* Menjaga border tetap solid dan tajam saat cetak *\/\n table, th, td {\n border-color: #000000 !important;\n }\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-50 text-slate-800 min-h-screen flex flex-col justify-center py-6\">\n\n \n <main class=\"flex-grow container mx-auto px-4 max-w-7xl no-print\">\n \n \n <div class=\"flex flex-col md:flex-row justify-between items-center gap-4 mb-6 bg-white p-4 rounded-xl border border-slate-200\">\n <div class=\"flex items-center gap-3\">\n <div class=\"bg-brand-green text-white p-2.5 rounded-lg font-bold\">\n <i data-lucide=\"graduation-cap\" class=\"w-6 h-6\"><\/i>\n <\/div>\n <div>\n <h1 class=\"text-lg font-bold text-slate-800\">Sistem Ruang Sidang FDK<\/h1>\n <p class=\"text-xs text-slate-500\">Fakultas Dakwah dan Komunikasi \u2022 UIN Sunan Kalijaga<\/p>\n <\/div>\n <\/div>\n\n \n <div id=\"db-connection-status\" class=\"flex items-center gap-2 px-3 py-1.5 rounded-full border text-xs font-semibold transition-all duration-300\">\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-slate-400 opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-slate-500\"><\/span>\n <\/span>\n <span>Memuat Status Koneksi…<\/span>\n <\/div>\n \n <div class=\"flex items-center gap-3\">\n \n <div id=\"auth-section\">\n <button onclick=\"openLoginModal()\" class=\"flex items-center gap-2 bg-brand-orange hover:bg-brand-orangeHover text-white font-semibold px-4 py-2 rounded-lg transition text-sm\">\n <i data-lucide=\"log-in\" class=\"w-4 h-4\"><\/i>\n Login Kaprodi\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-4 mb-6\">\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 flex flex-col justify-between\">\n <label class=\"block text-xs font-semibold uppercase tracking-wider text-slate-500 mb-2\">Tanggal Pelaksanaan Sidang<\/label>\n <div class=\"flex gap-2\">\n <input type=\"date\" id=\"selected-date\" onchange=\"loadSchedules()\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green font-medium text-slate-700\">\n <button onclick=\"setToToday()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 px-3 py-2 rounded-lg text-sm font-semibold transition\" title=\"Hari Ini\">\n Hari Ini\n <\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 grid grid-cols-2 gap-4\">\n <div class=\"flex flex-col justify-between\">\n <span class=\"text-xs font-semibold uppercase tracking-wider text-slate-500\">Total Sesi Terisi<\/span>\n <div class=\"flex items-baseline gap-1 mt-1\">\n <span id=\"stats-terisi\" class=\"text-2xl font-bold text-slate-800\">0<\/span>\n <span id=\"stats-terisi-denom\" class=\"text-xs text-slate-400\">\/ 15 Sesi<\/span>\n <\/div>\n <\/div>\n <div class=\"flex flex-col justify-between border-l border-slate-100 pl-4\">\n <span class=\"text-xs font-semibold uppercase tracking-wider text-slate-500\">Tersedia (Hijau)<\/span>\n <div class=\"flex items-baseline gap-1 mt-1\">\n <span id=\"stats-tersedia\" class=\"text-2xl font-bold text-brand-green\">15<\/span>\n <span class=\"text-xs text-brand-green font-medium\">Sesi<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white p-4 rounded-xl border border-slate-200 flex items-center justify-between\">\n <div class=\"flex items-start gap-3\">\n <div class=\"p-2 bg-brand-greenLight text-brand-green rounded-lg mt-0.5\">\n <i data-lucide=\"info\" class=\"w-5 h-5\"><\/i>\n <\/div>\n <div>\n <h3 class=\"text-xs font-bold uppercase tracking-wider text-slate-600\">Ketentuan Sesi<\/h3>\n <p class=\"text-xs text-slate-500 mt-1\" id=\"ketentuan-sesi-text\">Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: Kosong, Putih: Terisi.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-white rounded-xl border border-slate-200 overflow-hidden mb-8\">\n <div class=\"p-4 bg-slate-50 border-b border-slate-200 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-2\">\n <div>\n <h2 class=\"font-bold text-slate-800 flex items-center gap-2\">\n <i data-lucide=\"calendar\" class=\"w-5 h-5 text-brand-green\"><\/i>\n Jadwal Penggunaan Ruang Sidang (Munaqosah \/ Proposal)\n <\/h2>\n <p class=\"text-xs text-slate-500 mt-0.5\" id=\"display-date-string\">Memuat tanggal…<\/p>\n <\/div>\n \n <div class=\"flex flex-wrap items-center gap-3 text-xs\">\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-brand-greenLight border border-brand-green\/30 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Kosong \/ Tersedia<\/span>\n <\/div>\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-white border border-slate-300 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Terisi \/ Terjadwal<\/span>\n <\/div>\n <div class=\"flex items-center gap-1.5\">\n <span class=\"w-3.5 h-3.5 rounded bg-slate-100 border border-slate-200 inline-block\"><\/span>\n <span class=\"text-slate-600 font-medium\">Sesi Sholat Jumat<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"overflow-x-auto\">\n <table class=\"w-full min-w-[800px] border-collapse\">\n <thead>\n <tr class=\"bg-slate-100 text-slate-700 text-xs font-bold uppercase tracking-wider text-center border-b border-slate-200\">\n <th class=\"py-3 px-4 w-48 border-r border-slate-200\">Waktu & Sesi<\/th>\n <th class=\"py-3 px-4 border-r border-slate-200\">RUANG 1<\/th>\n <th class=\"py-3 px-4 border-r border-slate-200\">RUANG 2<\/th>\n <th class=\"py-3 px-4\">RUANG 3<\/th>\n <\/tr>\n <\/thead>\n <tbody class=\"divide-y divide-slate-200\" id=\"schedule-grid-body\">\n \n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <\/main>\n\n \n <div id=\"print-area\" class=\"hidden p-0 max-w-4xl mx-auto bg-white text-black text-[12px] font-serif leading-relaxed\">\n \n \n <div class=\"grid grid-cols-[90px_1fr] items-center border-b-[4px] border-double border-[#006368] pb-3 mb-5\">\n \n <div class=\"w-[85px] h-[85px] flex items-center justify-center\">\n \n <img decoding=\"async\" id=\"print-logo-png\" src=\"https:\/\/lpm.uin-suka.ac.id\/images\/logo.png\" alt=\"Logo UIN Sunan Kalijaga\" class=\"w-full h-auto max-h-[85px] object-contain\" onerror=\"this.onerror=null; this.src='https:\/\/placehold.co\/150x150\/006368\/ffffff?text=Logo+UIN';\">\n <\/div>\n \n \n <div class=\"text-center font-serif ml-2\">\n <h2 class=\"text-[14px] font-bold tracking-wider uppercase leading-tight text-slate-900\">Kementerian Agama Republik Indonesia<\/h2>\n <h1 class=\"text-[17px] font-extrabold uppercase leading-snug tracking-normal text-[#006368]\">Universitas Islam Negeri Sunan Kalijaga Yogyakarta<\/h1>\n <h3 class=\"text-[15px] font-bold uppercase tracking-wide leading-tight text-[#F08619]\">Fakultas Dakwah dan Komunikasi<\/h3>\n <p class=\"text-[9.5px] font-normal italic mt-1 leading-normal text-slate-700\">\n Alamat: Jl. Marsda Adisucipto, Yogyakarta 55281 | Telp: (0274) 515856, Fax: (0274) 552230<br>\n Email: fdk@uin-suka.ac.id | Website: http:\/\/fdk.uin-suka.ac.id\n <\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"text-center mb-5\">\n <h4 class=\"text-[14px] font-bold uppercase tracking-wider underline leading-normal text-slate-900\" id=\"print-document-title\">KARTU JADWAL PELAKSANAAN SIDANG<\/h4>\n <p class=\"text-[10px] font-mono tracking-wide mt-1 text-slate-600\" id=\"print-slip-id\">No. Berkas: FDK-MUN-0000<\/p>\n <\/div>\n\n <p class=\"mb-4 text-[11.5px] leading-relaxed text-slate-800\">\n Berdasarkan Keputusan Dekan Fakultas Dakwah dan Komunikasi UIN Sunan Kalijaga, diberitahukan kepada mahasiswa yang bersangkutan bahwa pelaksanaan agenda ujian\/sidang akademik akan diselenggarakan secara luring sesuai dengan ketentuan di bawah ini:\n <\/p>\n\n \n <table class=\"w-full border-collapse border border-slate-900 text-[11.5px] my-5 font-serif\">\n <tbody>\n <tr>\n <td class=\"border border-slate-900 p-2 w-[30%] bg-slate-50 font-bold\">Jenis Kegiatan Ujian\/Sidang<\/td>\n <td class=\"border border-slate-900 p-2 w-[70%] font-bold text-[#006368] tracking-wide uppercase\" id=\"print-jenis-sidang\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Nama Mahasiswa<\/td>\n <td class=\"border border-slate-900 p-2 font-semibold text-slate-800\" id=\"print-mahasiswa\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">NIM \/ Program Studi<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-nim-prodi\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Hari, Tanggal Pelaksanaan<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-tanggal\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Waktu & Sesi<\/td>\n <td class=\"border border-slate-900 p-2 font-semibold text-teal-900\" id=\"print-waktu\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Tempat \/ Ruangan<\/td>\n <td class=\"border border-slate-900 p-2 font-bold text-slate-900\" id=\"print-ruang\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Judul Naskah Akademik<\/td>\n <td class=\"border border-slate-900 p-2 italic leading-relaxed text-slate-800\" id=\"print-judul\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Pembimbing<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-pembimbing\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Sekretaris Sidang<\/td>\n <td class=\"border border-slate-900 p-2\" id=\"print-sekretaris\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Penguji I (Utama)<\/td>\n <td class=\"border border-slate-900 p-2 font-medium\" id=\"print-penguji1\">–<\/td>\n <\/tr>\n <tr>\n <td class=\"border border-slate-900 p-2 bg-slate-50 font-bold\">Dosen Penguji II (Pendamping)<\/td>\n <td class=\"border border-slate-900 p-2 font-medium\" id=\"print-penguji2\">–<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n \n <div class=\"mb-8 p-3 border border-dashed border-[#006368]\/50 bg-slate-50 rounded\">\n <p class=\"font-bold underline text-[10.5px] mb-1.5 uppercase tracking-wider text-[#006368]\">Instruksi & Tata Tertib Sidang Akademik:<\/p>\n <ol class=\"list-decimal list-inside text-[10px] text-slate-600 space-y-1\">\n <li>Mahasiswa diwajibkan hadir di lokasi ruang sidang sekurang-kurangnya 15 menit sebelum sesi dimulai.<\/li>\n <li>Wajib mengenakan seragam pakaian formal (Kemeja Putih, Celana\/Rok Hitam) lengkap dengan Jas<\/li>\n <li>Membawa draf dokumen akademik tercetak (hardcopy) sebanyak 3 rangkap untuk diserahkan kepada Dewan Penguji.<\/li>\n <li>Keterlambatan tanpa konfirmasi resmi dapat mengakibatkan pembatalan sesi atau penundaan jadwal sidang.<\/li>\n <\/ol>\n <\/div>\n\n \n <div class=\"flex justify-between items-start text-[11px] mt-8\">\n <div class=\"w-[45%] text-slate-400 italic\">\n <p class=\"text-[9px] mt-8 text-slate-500 font-mono\">\n Sistem Manajemen Ruang Sidang FDK<br>\n Dokumen ini sah dikeluarkan melalui portal digital Kaprodi FDK UIN Sunan Kalijaga Yogyakarta.\n <\/p>\n <\/div>\n \n <div class=\"text-center w-[45%] font-serif\">\n <p id=\"print-ttd-date\" class=\"mb-1\">Yogyakarta, 23 Juni 2026<\/p>\n <p class=\"font-semibold text-slate-800\" id=\"print-ttd-role\">a.n. Dekan,<br>Ketua Program Studi<\/p>\n \n \n <div class=\"h-[75px] flex items-center justify-center relative\">\n <span class=\"text-[9px] text-[#006368] border border-[#006368]\/30 rounded px-2.5 py-0.5 font-mono tracking-widest bg-emerald-50\/50 uppercase z-10 font-bold\">TERVALIDASI SISTEM<\/span>\n <div class=\"absolute opacity-[0.12] w-[60px] h-[60px]\">\n <svg viewBox=\"0 0 100 100\" class=\"w-full h-full\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <polygon points=\"50,3 83,17 97,50 83,83 50,97 17,83 3,50 17,17\" fill=\"#006368\"\/>\n <\/svg>\n <\/div>\n <\/div>\n \n <p class=\"font-bold underline text-slate-900 text-[11.5px]\" id=\"print-ttd-officer\">Dr. KPI Ahmad, M.S.I.<\/p>\n <p class=\"text-[10px] text-slate-700 font-medium\" id=\"print-ttd-nip\">NIP. “197508122003121002”<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n\n \n\n \n <div id=\"login-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-md overflow-hidden transform transition-all\">\n <div class=\"bg-brand-green text-white p-5 border-b-4 border-brand-orange flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"shield-check\" class=\"w-6 h-6 text-brand-orange\"><\/i>\n <h3 class=\"font-bold text-lg\">Login Petugas Prodi<\/h3>\n <\/div>\n <button onclick=\"closeLoginModal()\" class=\"text-teal-100 hover:text-white transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n <form id=\"login-form\" onsubmit=\"handleLogin(event)\" class=\"p-6 space-y-4\">\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Program Studi (Akun Terdaftar)<\/label>\n <select id=\"login-email\" name=\"username\" autocomplete=\"username\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green font-medium\" required>\n <option value=\"kaprodi.kpi@uinsuka.ac.id\">Komunikasi dan Penyiaran Islam (KPI)<\/option>\n <option value=\"kaprodi.bki@uinsuka.ac.id\">Bimbingan dan Konseling Islam (BKI)<\/option>\n <option value=\"kaprodi.pmi@uinsuka.ac.id\">Pengembangan Masyarakat Islam (PMI)<\/option>\n <option value=\"kaprodi.md@uinsuka.ac.id\">Manajemen Dakwah (MD)<\/option>\n <option value=\"kaprodi.iks@uinsuka.ac.id\">Ilmu Kesejahteraan Sosial (IKS)<\/option>\n <option value=\"kaprodi.mkpi@uinsuka.ac.id\">Magister Komunikasi dan Penyiaran Islam (MKPI)<\/option>\n <option value=\"kaprodi.mbki@uinsuka.ac.id\">Magister Bimbingan dan Konseling Islam (MBKI)<\/option>\n <option value=\"kaprodi.mpmi@uinsuka.ac.id\">Magister Pengembangan Masyarakat Islam (MPMI)<\/option>\n <option value=\"kaprodi.mks@uinsuka.ac.id\">Magister Kesjahteraan Sosial (MKS)<\/option>\n <\/select>\n <\/div>\n <div>\n <div class=\"flex justify-between items-center mb-1.5\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider\">Kata Sandi<\/label>\n <\/div>\n <input type=\"password\" id=\"login-password\" name=\"password\" autocomplete=\"current-password\" placeholder=\"Masukkan kata sandi Kaprodi\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <div id=\"login-error-msg\" class=\"text-xs text-rose-600 bg-rose-50 border border-rose-200 p-2.5 rounded-lg hidden flex items-center gap-1.5\">\n <i data-lucide=\"alert-circle\" class=\"w-4 h-4 shrink-0\"><\/i>\n Sandi salah! Silakan hubungi Administrator.\n <\/div>\n <button type=\"submit\" class=\"w-full bg-brand-green hover:bg-brand-greenHover text-white font-bold py-2.5 rounded-lg transition mt-2 flex items-center justify-center gap-2\">\n <i data-lucide=\"unlock\" class=\"w-4 h-4\"><\/i>\n Verifikasi Masuk\n <\/button>\n <\/form>\n <\/div>\n <\/div>\n\n \n <div id=\"booking-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-xl overflow-hidden transform transition-all max-h-[90vh] flex flex-col animate-fadeIn\">\n <div class=\"bg-brand-green text-white p-5 border-b-4 border-brand-orange flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"edit-3\" class=\"w-6 h-6 text-brand-orange\" id=\"modal-title-icon\"><\/i>\n <h3 class=\"font-bold text-lg\" id=\"modal-title\">Atur Sesi Sidang Baru<\/h3>\n <\/div>\n <button onclick=\"closeBookingModal()\" class=\"text-teal-100 hover:text-white transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n \n <form onsubmit=\"handleSaveBooking(event)\" class=\"p-6 space-y-4 overflow-y-auto flex-grow custom-scrollbar\">\n \n <div class=\"grid grid-cols-3 gap-3 bg-slate-50 p-3 rounded-lg border border-slate-200 text-xs\">\n <div>\n <span class=\"block text-slate-400\">Tanggal<\/span>\n <span class=\"font-bold text-slate-700\" id=\"meta-date\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Ruangan<\/span>\n <span class=\"font-bold text-brand-green\" id=\"meta-room\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Waktu & Sesi<\/span>\n <span class=\"font-bold text-brand-green\" id=\"meta-session\">–<\/span>\n <\/div>\n <\/div>\n\n \n <div class=\"bg-brand-orangeLight\/60 p-3.5 rounded-xl border border-brand-orange\/20\">\n <label class=\"block text-xs font-bold text-slate-700 uppercase tracking-wider mb-2\">Jenis Kegiatan Sidang<\/label>\n <div class=\"grid grid-cols-2 gap-3\">\n <label class=\"flex items-center gap-2 bg-white px-3 py-2 rounded-lg border border-slate-300 cursor-pointer hover:border-brand-green transition\">\n <input type=\"radio\" name=\"field-type\" id=\"type-munaqosah\" value=\"Sidang Munaqosah\" checked onchange=\"updateModalHeaderByType()\" class=\"text-brand-green focus:ring-brand-green h-4 w-4\">\n <span class=\"text-xs font-semibold text-slate-800\">Sidang Munaqosah<\/span>\n <\/label>\n <label class=\"flex items-center gap-2 bg-white px-3 py-2 rounded-lg border border-slate-300 cursor-pointer hover:border-brand-green transition\">\n <input type=\"radio\" name=\"field-type\" id=\"type-proposal\" value=\"Sidang Proposal\" onchange=\"updateModalHeaderByType()\" class=\"text-brand-green focus:ring-brand-green h-4 w-4\">\n <span class=\"text-xs font-semibold text-slate-800\">Sidang Proposal<\/span>\n <\/label>\n <\/div>\n <\/div>\n\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Nama Mahasiswa<\/label>\n <input type=\"text\" id=\"field-student\" placeholder=\"Nama Lengkap\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">NIM Mahasiswa<\/label>\n <input type=\"text\" id=\"field-nim\" placeholder=\"Masukkan NIM\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <\/div>\n <\/div>\n\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Program Studi<\/label>\n <select id=\"field-prodi\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required>\n <option value=\"KPI\">KPI – Komunikasi dan Penyiaran Islam<\/option>\n <option value=\"BKI\">BKI – Bimbingan dan Konseling Islam<\/option>\n <option value=\"PMI\">PMI – Pengembangan Masyarakat Islam<\/option>\n <option value=\"MD\">MD – Manajemen Dakwah<\/option>\n <option value=\"IKS\">IKS – Ilmu Kesejahteraan Sosial<\/option>\n <option value=\"M-KPI\">M-KPI – Magister Komunikasi dan Penyiaran Islam<\/option>\n <option value=\"M-BKI\">M-BKI – Magister Bimbingan dan Konseling Islam<\/option>\n <option value=\"M-PMI\">M-PMI – Magister Pengembangan Masyarakat Islam<\/option>\n <option value=\"M-KS\">M-KS – Magister Kesjahteraan Sosial<\/option>\n <\/select>\n <\/div>\n\n <div>\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\" id=\"label-field-title\">Judul Skripsi \/ Tugas Akhir<\/label>\n <textarea id=\"field-title\" rows=\"2\" placeholder=\"Masukkan judul akademik lengkap mahasiswa\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-brand-green\" required><\/textarea>\n <\/div>\n\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n \n <div class=\"relative\" id=\"dropdown-field-advisor\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Pembimbing<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-advisor')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-advisor-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-advisor-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-advisor')\" id=\"field-advisor-search\" placeholder=\"Cari nama pembimbing...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-advisor-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-advisor-value\" value=\"\">\n <input type=\"text\" id=\"field-advisor-manual\" placeholder=\"Tulis Nama Pembimbing Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n \n \n <div class=\"relative\" id=\"dropdown-field-secretary\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Sekretaris Sidang<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-secretary')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-secretary-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-secretary-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-secretary')\" id=\"field-secretary-search\" placeholder=\"Cari nama sekretaris...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-secretary-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-secretary-value\" value=\"\">\n <input type=\"text\" id=\"field-secretary-manual\" placeholder=\"Tulis Nama Sekretaris Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n <\/div>\n\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n \n <div class=\"relative\" id=\"dropdown-field-examiner1\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Penguji I<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-examiner1')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-examiner1-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-examiner1-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-examiner1')\" id=\"field-examiner1-search\" placeholder=\"Cari nama penguji I...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-examiner1-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-examiner1-value\" value=\"\">\n <input type=\"text\" id=\"field-examiner1-manual\" placeholder=\"Tulis Nama Penguji I Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n \n \n <div class=\"relative\" id=\"dropdown-field-examiner2\">\n <label class=\"block text-xs font-semibold text-slate-500 uppercase tracking-wider mb-1.5\">Dosen Penguji II<\/label>\n <button type=\"button\" onclick=\"toggleDropdown('field-examiner2')\" class=\"w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-2 text-sm text-left flex justify-between items-center focus:outline-none focus:ring-2 focus:ring-brand-green\">\n <span id=\"field-examiner2-display\" class=\"text-slate-400\">— Pilih Nama Dosen —<\/span>\n <i data-lucide=\"chevron-down\" class=\"w-4 h-4 text-slate-400\"><\/i>\n <\/button>\n <div id=\"field-examiner2-menu\" class=\"absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg hidden flex flex-col max-h-60 overflow-hidden shadow-lg\">\n <div class=\"p-2 border-b border-slate-100 bg-slate-50\">\n <input type=\"text\" oninput=\"filterDropdown('field-examiner2')\" id=\"field-examiner2-search\" placeholder=\"Cari nama penguji II...\" class=\"w-full bg-white border border-slate-300 rounded-md px-2.5 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-brand-green\">\n <\/div>\n <ul id=\"field-examiner2-list\" class=\"overflow-y-auto flex-1 divide-y divide-slate-100 text-sm custom-scrollbar max-h-48\">\n \n <\/ul>\n <\/div>\n <input type=\"hidden\" id=\"field-examiner2-value\" value=\"\">\n <input type=\"text\" id=\"field-examiner2-manual\" placeholder=\"Tulis Nama Penguji II Manual...\" class=\"mt-1.5 w-full bg-slate-50 border border-slate-300 rounded-lg px-3 py-1.5 text-xs focus:outline-none focus:ring-2 focus:ring-brand-green hidden\">\n <\/div>\n <\/div>\n\n \n <div class=\"flex flex-wrap items-center justify-between gap-3 pt-4 border-t border-slate-100\">\n <div class=\"flex items-center gap-2\">\n <button type=\"button\" id=\"btn-delete\" onclick=\"triggerDeleteConfirmation()\" class=\"bg-rose-50 hover:bg-rose-100 text-rose-700 border border-rose-200 px-4 py-2 rounded-lg text-sm font-semibold transition hidden flex items-center gap-1.5\">\n <i data-lucide=\"trash-2\" class=\"w-4 h-4\"><\/i>\n Kosongkan Sesi\n <\/button>\n <button type=\"button\" id=\"btn-print\" onclick=\"triggerPrintFromModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 px-4 py-2 rounded-lg text-sm font-semibold transition hidden flex items-center gap-1.5\">\n <i data-lucide=\"printer\" class=\"w-4 h-4\"><\/i>\n Cetak Slip\n <\/button>\n <\/div>\n\n <div class=\"flex items-center gap-2 ml-auto\">\n <button type=\"button\" onclick=\"closeBookingModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-600 px-4 py-2 rounded-lg text-sm font-semibold transition\">\n Batal\n <\/button>\n <button type=\"submit\" id=\"btn-save-submit\" class=\"bg-brand-green hover:bg-brand-greenHover text-white font-bold px-5 py-2 rounded-lg transition flex items-center gap-1.5\">\n <i data-lucide=\"save\" class=\"w-4 h-4\"><\/i>\n Simpan Jadwal\n <\/button>\n <\/div>\n <\/div>\n <\/form>\n <\/div>\n <\/div>\n\n \n <div id=\"view-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-lg overflow-hidden transform transition-all\">\n <div class=\"bg-slate-100 text-slate-800 p-5 border-b border-slate-200 flex justify-between items-center\">\n <div class=\"flex items-center gap-2\">\n <i data-lucide=\"file-text\" class=\"w-5 h-5 text-brand-green\"><\/i>\n <h3 class=\"font-bold text-md text-slate-800\">Detail Sesi Sidang<\/h3>\n <\/div>\n <button onclick=\"closeViewModal()\" class=\"text-slate-500 hover:text-slate-800 transition\">\n <i data-lucide=\"x\" class=\"w-6 h-6\"><\/i>\n <\/button>\n <\/div>\n \n <div class=\"p-6 space-y-4\">\n <div class=\"grid grid-cols-3 gap-3 bg-slate-50 p-3 rounded-lg border border-slate-200 text-xs\">\n <div>\n <span class=\"block text-slate-400\">Tanggal<\/span>\n <span class=\"font-bold text-slate-700\" id=\"view-meta-date\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Ruangan<\/span>\n <span class=\"font-bold text-brand-green\" id=\"view-meta-room\">–<\/span>\n <\/div>\n <div>\n <span class=\"block text-slate-400\">Waktu \/ Sesi<\/span>\n <span class=\"font-bold text-brand-green\" id=\"view-meta-session\">–<\/span>\n <\/div>\n <\/div>\n\n <div class=\"space-y-3.5 text-sm\">\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Jenis Sidang<\/span>\n <span class=\"col-span-2 font-bold\" id=\"view-jenis-sidang-badge\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Mahasiswa<\/span>\n <span class=\"col-span-2 text-slate-800 font-bold\" id=\"view-student\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">NIM & Prodi<\/span>\n <span class=\"col-span-2 text-slate-800\" id=\"view-nim-prodi\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\" id=\"label-view-title\">Judul Skripsi<\/span>\n <span class=\"col-span-2 text-slate-800 italic\" id=\"view-title\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Pembimbing<\/span>\n <span class=\"col-span-2 text-slate-800 font-semibold\" id=\"view-advisor\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Sekretaris<\/span>\n <span class=\"col-span-2 text-slate-800\" id=\"view-secretary\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 border-b border-slate-100 pb-2\">\n <span class=\"text-slate-500 font-medium\">Penguji I<\/span>\n <span class=\"col-span-2 text-slate-800 font-medium\" id=\"view-examiner1\">–<\/span>\n <\/div>\n <div class=\"grid grid-cols-3 pb-1\">\n <span class=\"text-slate-500 font-medium\">Penguji II<\/span>\n <span class=\"col-span-2 text-slate-800 font-medium\" id=\"view-examiner2\">–<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"protective-lock-box\" class=\"rounded-lg p-3 flex gap-2.5 items-start text-xs hidden\">\n <i id=\"protective-lock-icon\" data-lucide=\"lock\" class=\"w-4 h-4 shrink-0 mt-0.5\"><\/i>\n <span id=\"protective-lock-text\"><\/span>\n <\/div>\n\n <div class=\"flex items-center justify-between gap-2 pt-4 border-t border-slate-100\">\n <div class=\"flex items-center gap-2\">\n <button onclick=\"triggerPrintFromView()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 font-semibold px-4 py-2 rounded-lg text-sm transition flex items-center gap-1.5\">\n <i data-lucide=\"printer\" class=\"w-4 h-4\"><\/i>\n Cetak Slip\n <\/button>\n \n \n <button id=\"btn-owner-edit\" onclick=\"triggerOwnerEdit()\" class=\"bg-brand-orange hover:bg-brand-orangeHover text-white font-bold px-4 py-2 rounded-lg text-sm transition flex items-center gap-1.5 hidden\">\n <i data-lucide=\"edit-3\" class=\"w-4 h-4\"><\/i>\n Ubah Jadwal\n <\/button>\n <\/div>\n <button onclick=\"closeViewModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 font-semibold px-4 py-2 rounded-lg text-sm transition\">\n Tutup\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"confirm-modal\" class=\"fixed inset-0 bg-slate-900\/60 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden no-print\">\n <div class=\"bg-white rounded-2xl border border-slate-200 w-full max-w-md overflow-hidden transform transition-all animate-fadeIn\">\n <div class=\"bg-rose-700 text-white p-5 flex items-center gap-3\">\n <div class=\"bg-rose-800 p-2 rounded-lg text-white\">\n <i data-lucide=\"alert-triangle\" class=\"w-6 h-6\"><\/i>\n <\/div>\n <div>\n <h3 class=\"font-bold text-lg\">Konfirmasi Tindakan<\/h3>\n <\/div>\n <\/div>\n <div class=\"p-6\">\n <p class=\"text-sm text-slate-600 leading-relaxed\" id=\"confirm-modal-text\">Apakah Anda yakin ingin membebaskan\/mengosongkan jadwal pada sesi ini?<\/p>\n \n <div class=\"flex items-center justify-end gap-3 mt-6\">\n <button onclick=\"closeConfirmModal()\" class=\"bg-slate-100 hover:bg-slate-200 text-slate-700 font-semibold px-4 py-2 rounded-lg text-sm transition\">\n Batal\n <\/button>\n <button id=\"btn-confirm-execute\" class=\"bg-rose-600 hover:bg-rose-700 text-white font-bold px-5 py-2 rounded-lg text-sm transition\">\n Ya, Kosongkan Sesi\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n\n \n <script>\n \/\/ ==========================================\n \/\/ KONFIGURASI DATABASE (GOOGLE SPREADSHEET)\n \/\/ ==========================================\n const GOOGLE_SCRIPT_URL = \"https:\/\/script.google.com\/macros\/s\/AKfycbzUisESHmKYEJbLrKyNQUjNVDExqTgWZNWrDtN7p5PywBB2CM859xZvmISVQtmunYZUWw\/exec\"; \n\n \/\/ 1. DATA STRUCTURES & DEFINITIONS\n const sessions = [\n { id: 1, label: \"Sesi 1\", time: \"08:00 - 09:20\" }, \n { id: 2, label: \"Sesi 2\", time: \"09:30 - 10:50\" }, \n { id: 3, label: \"Sesi 3\", time: \"11:00 - 12:20\" }, \n { id: 4, label: \"Sesi 4\", time: \"13:00 - 14:20\" }, \n { id: 5, label: \"Sesi 5\", time: \"14:30 - 16:00\" } \n ];\n\n const authorizedUsers = {\n \"kaprodi.kpi@uinsuka.ac.id\": { name: \"Saptoni, S.Ag, M.A.\", prodi: \"Komunikasi dan Penyiaran Islam (KPI)\", pass: \"kpi123\", nip: \"197302211999031002\" },\n \"kaprodi.bki@uinsuka.ac.id\": { name: \"Zaen Musyrifin, S.Sos.I, M.Pd.I\", prodi: \"Bimbingan dan Konseling Islam (BKI)\", pass: \"bki123\", nip: \"199004280000001301\" },\n \"kaprodi.pmi@uinsuka.ac.id\": { name: \"Siti Aminah, S.Sos.I., M.Si.\", prodi: \"Pengembangan Masyarakat Islam (PMI)\", pass: \"pmi123\", nip: \"198308112011012010\" },\n \"kaprodi.md@uinsuka.ac.id\": { name: \"Munif Solihan, S.Sos.l., MPA.\", prodi: \"Manajemen Dakwah (MD)\", pass: \"md123\", nip: \"198512092019031002\" },\n \"kaprodi.iks@uinsuka.ac.id\": { name: \"Muhammad Izzul Haq, S.Sos., M.Sc. Ph.D.\", prodi: \"Ilmu Kesejahteraan Sosial (IKS)\", pass: \"iks123\", nip: \"198108232009011007\" },\n \"kaprodi.mbki@uinsuka.ac.id\": { name: \"Moh. Khoerul Anwar, S.Pd., M.Pd., Ph.D.\", prodi: \"Magister Bimbingan dan Konseling Islam (MBKI)\", pass: \"mbki123\", nip: \"199111010000001301\" },\n \"kaprodi.mpmi@uinsuka.ac.id\": { name: \"Prof. Dr. Hj. Sriharini, S.Ag., M.Si.\", prodi: \"Magister Pengembangan Masyarakat Islam (MPMI)\", pass: \"mpmi123\", nip: \"197105261997032001\" },\n \"kaprodi.mkpi@uinsuka.ac.id\": { name: \"Dr. Abdul Rozak, M.Pd.\", prodi: \"Magister Komunikasi dan Penyiaran Islam (MKPI)\", pass: \"mkpi123\", nip: \"196710061994031003\" },\n \"kaprodi.mks@uinsuka.ac.id\": { name: \"Muh. Ulil Absor, S.H.I., M.A., Ph.D.\", prodi: \"Magister Kesjahteraan Sosial (MKS)\", pass: \"mks123\", nip: \"198010182009011012\" }\n };\n\n \/\/ Database Dosen FDK UIN Sunan Kalijaga\n const lecturerDatabase = [\n \"Prof. Dr. Hj Nurjannah, M.Si.\",\n \"Prof. Dr. Hj Casmini, S.Ag, M.Si.\",\n \"Prof. Dr. Pajar Hatma Indra Jaya, S.Sos, M.Si.\",\n \"Prof. Dr. Hj. Sriharini, S.Ag., M.Si.\",\n \"Prof. Hj. Alimatul Qibtiyah, S.Ag., M.Si., M.A, Ph.D.\",\n \"Prof. Dr. Arif Maftuhin, M.Ag., M.A.I.S\",\n \"Prof. Dr. Abdur Rozaki, S.Ag., M.Si.\",\n \"Prof. Dr. Moch. Nur Ichwan, S.Ag., M.A.\",\n \"Prof. Siti Syamsiatun, M.A., Ph.D.\",\n \"Drs. H. Moh. Abu Suhud, M.Pd.\",\n \"Drs. Mokh. Nazili, M.Pd.\",\n \"Dr. H. Zainudin, M.Ag.\",\n \"Dr. H. Hamdan Daulay , M.Si., M.A.\",\n \"Dr. Abdul Rozak, M.Pd.\",\n \"Dr. Hikmah Endraswati, SE., M.Si\",\n \"Drs. Lathiful Khuluq, M.A., B.S.W., Ph.D.\",\n \"Dr. H. Andy Dermawan, M.Ag\",\n \"Drs. Muhammad Sahlan, M.Si.\",\n \"Dr. Irsyadunnas, M.Ag.\",\n \"Dr. H. Okrisal Eka Putra Lc., M.Ag\",\n \"Nailul Falah, S.Ag., M.Si.\",\n \"Ro'fah, M.A., Ph.D.\",\n \"Dr. Muhammad Zamroni, S.Sos.I, M.Si.\",\n \"Dr. Hj. Mikhriani, M.M.\",\n \"Drs. H. Noor Hamid, M.Pd.\",\n \"Dr. H. Rifa'i, M.A.\",\n \"Drs. H. Muhammad Hafiun, M.Pd.\",\n \"Dra. Hj. Evi Septiani Tavip Hayati M.Si.\",\n \"Dra. Hj. Anisah Indriati, M.Si.\",\n \"Drs. M. Rosyid Ridla, M.Si.\",\n \"M. Toriq Nurmadiansyah, S.Ag, M.Si.\",\n \"Dra. Siti Fatimah, M.Pd.\",\n \"Slamet, S.Ag. M.Si.\",\n \"Dr. Khadiq, S.Ag., M.Hum.\",\n \"Dr. H. Muhsin, S.Ag, M.A., M.Pd.\",\n \"Dr. Maryono, S.Ag., M.Pd.\",\n \"Dr. Aryan Torrido, S.E., M.Si.\",\n \"Dr. Asep Jahidin, M.Si\",\n \"Dra. Nurmahni, M.Ag.\",\n \"Hj. Early Maghfiroh Innayati, S.Ag., M.Si.\",\n \"A. Said Hasan Basri, S.Psi., M.Si.\",\n \"Aris Risdiana, S.Sos.I., M.M.\",\n \"Siti Solechah, Sos.I, M.Si.\",\n \"Siti Aminah, S.Sos.I., M.Si.\",\n \"Dr. Nanang Mizwar Hasyim, S.Sos., M.Si.\",\n \"Mochammad Sinung Restendy, M.Sos.\",\n \"Ahmad Izudin, S.Sos.I., M.Si\",\n \"Ferra Puspito Sari, M.Pd.\",\n \"Beti Nur Hayati, M.A.\",\n \"Anggi Jatmiko, M.A.\",\n \"Arya Fendha Ibnu Shina, M.Si\",\n \"Muhammad Lutfi Habibi, M.A.\",\n \"Achmad Muhammad, M.Ag.\",\n \"Andayani, SIP., MSW.\",\n \"Saptoni, S.Ag, M.A.\",\n \"Hj. Noorkamilah, S.Ag,M.Si.\",\n \"Muh. Ulil Absor, S.H.I., M.A., Ph.D.\",\n \"Muhammad Izzul Haq, S.Sos., M.Sc. Ph.D.\",\n \"Khotibul Umam, M.Si.\",\n \"Muhammad Irfa'i Muslim, M.Si.\",\n \"Munif Solihan, S.Sos.l., MPA.\",\n \"Citra Widyastuti, M.Psi.\",\n \"Taufik Rahman, M.Sos.\",\n \"Muhammad Diak Udin, M.Sos.\",\n \"Sudharno Dwi Yuwono, M.Pd.\",\n \"Dr. Muhamad Rudi Wijaya, M.Pd.I\",\n \"Nur Fitriyani Hardi, M.Psi.\",\n \"Seiren Ikhtiara, M.A.\",\n \"Moh. Khoerul Anwar, S.Pd., M.Pd., Ph.D.\",\n \"Shofi'unnafi, M.M.\",\n \"Idan Ramdani, M.A\",\n \"Rahadiyand Aditya, M.A.\",\n \"Nitra Galih Imansari M.Sos.\",\n \"Bayu Mitra Adyatama, M.A.P., M.Pol.Sc.\",\n \"Dr. Wulan Suci Rachmadani, S.E., M.Si.\",\n \"Dr. Festy Mahanani Mulyaningrum, Mph\",\n \"Widowati Maisarah, S.IP., MA\",\n \"Irawan Wibisono, M.I.Kom\",\n \"Arin Mamlakah Kalamika, M.A.\",\n \"Halimatus Sa'di ah, S.I.Kom, M.I.Kom.\",\n \"Dian Eka Permanasari, S.Ds., M.A.\",\n \"Nurul Fajriah Prahastuti, S.Psi., M.A.\",\n \"Muhamad Rashif Hilmi, S.Si., M.Sc.\",\n \"Zaen Musyrifin, S.Sos.I, M.Pd.I\",\n \"Hj. Abidah Muflihati, S.Th.I., M.Si.\",\n \"Suharto, M.A., Ph.D\"\n ];\n\n \/\/ App States\n let currentUser = null; \n let currentSchedules = []; \n let deletedSlots = []; \n\n let activeSelection = {\n date: \"\",\n room: 0,\n session: 0\n };\n\n \/\/ ==================== SMART & BULLETPROOF DATE NORMALIZATION ====================\n function normalizeDate(dateVal) {\n if (!dateVal) return \"\";\n let strVal = String(dateVal).trim();\n \n \/\/ 1. Jika ini format ISO penuh yang memiliki info waktu (ada 'T'), parse ke local time\n if (strVal.includes(\"T\")) {\n try {\n const dateObj = new Date(strVal);\n if (!isNaN(dateObj.getTime())) {\n const yyyy = dateObj.getFullYear();\n const mm = String(dateObj.getMonth() + 1).padStart(2, '0');\n const dd = String(dateObj.getDate()).padStart(2, '0');\n return `${yyyy}-${mm}-${dd}`;\n }\n } catch (e) {\n console.error(\"Gagal parse ISO Date:\", e);\n }\n }\n \n \/\/ 2. Jika format murni YYYY-MM-DD atau YYYY\/MM\/DD (tanpa waktu)\n if (\/^\\d{4}[-\/]\\d{1,2}[-\/]\\d{1,2}$\/.test(strVal)) {\n const parts = strVal.split(\/[-\/]\/);\n let y = parts[0];\n let m = parts[1].padStart(2, '0');\n let d = parts[2].padStart(2, '0');\n return `${y}-${m}-${d}`;\n }\n \n \/\/ 3. Jika format murni DD-MM-YYYY atau DD\/MM\/YYYY\n if (\/^\\d{1,2}[-\/]\\d{1,2}[-\/]\\d{4}$\/.test(strVal)) {\n const parts = strVal.split(\/[-\/]\/);\n let d = parts[0].padStart(2, '0');\n let m = parts[1].padStart(2, '0');\n let y = parts[2];\n return `${y}-${m}-${d}`;\n }\n\n \/\/ 4. Cadangan fallback aman dari timezone shift\n try {\n const dateObj = new Date(strVal);\n if (!isNaN(dateObj.getTime())) {\n const yyyy = dateObj.getFullYear();\n const mm = String(dateObj.getMonth() + 1).padStart(2, '0');\n const dd = String(dateObj.getDate()).padStart(2, '0');\n return `${yyyy}-${mm}-${dd}`;\n }\n } catch (e) {}\n\n return strVal;\n }\n\n function isFriday(dateVal) {\n const normalized = normalizeDate(dateVal);\n if (!normalized) return false;\n const parts = normalized.split('-');\n const dateObj = new Date(parts[0], parts[1] - 1, parts[2]);\n return dateObj.getDay() === 5;\n }\n\n \/\/ ==================== GET READABLE INDONESIAN DATE ====================\n function getReadableDate(dateString) {\n const normalized = normalizeDate(dateString);\n if (!normalized) return \"\";\n const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };\n const dateObj = new Date(normalized);\n return dateObj.toLocaleDateString('id-ID', options);\n }\n\n \/\/ ==================== ALERT MESSAGE (TOAST SYSTEM) ====================\n function alertMessage(msg) {\n const toast = document.createElement(\"div\");\n toast.className = \"fixed bottom-5 right-5 bg-slate-900 text-white text-xs font-semibold px-4 py-3 rounded-lg z-50 flex items-center gap-2 border-l-4 border-brand-orange animate-fadeIn shadow-lg\";\n toast.innerHTML = `<i data-lucide=\"info\" class=\"w-4 h-4 text-brand-orange shrink-0\"><\/i> <span>${msg}<\/span>`;\n document.body.appendChild(toast);\n lucide.createIcons();\n setTimeout(() => {\n toast.remove();\n }, 4000);\n }\n\n \/\/ Helper function: Mapping Kaprodi Email to Prodi code\n function getProdiCodeByEmail(email) {\n if (!email) return \"KPI\";\n const emailLower = email.toLowerCase();\n if (emailLower.includes(\"kpi\") && emailLower.includes(\"kaprodi.m\")) return \"M-KPI\";\n if (emailLower.includes(\"kpi\")) return \"KPI\";\n \n if (emailLower.includes(\"bki\") && emailLower.includes(\"kaprodi.m\")) return \"M-BKI\";\n if (emailLower.includes(\"bki\")) return \"BKI\";\n \n if (emailLower.includes(\"pmi\") && emailLower.includes(\"kaprodi.m\")) return \"M-PMI\";\n if (emailLower.includes(\"pmi\")) return \"PMI\";\n \n if (emailLower.includes(\"md\")) return \"MD\";\n if (emailLower.includes(\"iks\") && !emailLower.includes(\"kaprodi.m\")) return \"IKS\";\n if (emailLower.includes(\"mks\") || (emailLower.includes(\"iks\") && emailLower.includes(\"kaprodi.m\"))) return \"M-KS\";\n \n return \"KPI\";\n }\n\n window.onload = function() {\n setToToday();\n \n const savedUser = localStorage.getItem(\"munakosah_user\");\n if (savedUser) {\n currentUser = JSON.parse(savedUser);\n updateAuthUI();\n }\n\n populateLecturerDropdowns();\n loadSchedules();\n lucide.createIcons();\n };\n\n document.addEventListener(\"click\", function(event) {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n prefixes.forEach(prefix => {\n const dropdownContainer = document.getElementById(`dropdown-${prefix}`);\n if (dropdownContainer && !dropdownContainer.contains(event.target)) {\n const menu = document.getElementById(`${prefix}-menu`);\n if (menu) menu.classList.add(\"hidden\");\n }\n });\n });\n\n function populateLecturerDropdowns() {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n \n prefixes.forEach(prefix => {\n const listContainer = document.getElementById(`${prefix}-list`);\n if (!listContainer) return;\n \n listContainer.innerHTML = \"\";\n \n const clearLi = document.createElement(\"li\");\n clearLi.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-slate-400 italic text-xs\";\n clearLi.innerText = \"-- Bersihkan Pilihan --\";\n clearLi.onclick = () => selectLecturerOption(prefix, \"\", \"-- Pilih Nama Dosen --\");\n listContainer.appendChild(clearLi);\n\n lecturerDatabase.forEach(dosen => {\n const li = document.createElement(\"li\");\n li.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-slate-700 text-xs font-medium transition duration-150\";\n li.innerText = dosen;\n li.onclick = () => selectLecturerOption(prefix, dosen, dosen);\n listContainer.appendChild(li);\n });\n\n const manualLi = document.createElement(\"li\");\n manualLi.className = \"px-3 py-2 hover:bg-slate-100 cursor-pointer text-brand-orange font-bold text-xs border-t border-slate-100 transition duration-150\";\n manualLi.innerText = \"\u270d\ufe0f Ketik Nama Manual...\";\n manualLi.onclick = () => selectLecturerOption(prefix, \"manual\", \"\u270d\ufe0f Ketik Nama Manual...\");\n listContainer.appendChild(manualLi);\n });\n }\n\n function toggleDropdown(prefix) {\n const prefixes = [\"field-advisor\", \"field-secretary\", \"field-examiner1\", \"field-examiner2\"];\n prefixes.forEach(p => {\n if (p !== prefix) {\n const menu = document.getElementById(`${p}-menu`);\n if (menu) menu.classList.add(\"hidden\");\n }\n });\n\n const menu = document.getElementById(`${prefix}-menu`);\n const isHidden = menu.classList.contains(\"hidden\");\n if (isHidden) {\n menu.classList.remove(\"hidden\");\n const searchInput = document.getElementById(`${prefix}-search`);\n searchInput.value = \"\";\n filterDropdown(prefix);\n setTimeout(() => searchInput.focus(), 50);\n } else {\n menu.classList.add(\"hidden\");\n }\n }\n\n function filterDropdown(prefix) {\n const query = document.getElementById(`${prefix}-search`).value.toLowerCase();\n const listItems = document.getElementById(`${prefix}-list`).getElementsByTagName(\"li\");\n \n for (let i = 0; i < listItems.length; i++) {\n const itemText = listItems[i].innerText.toLowerCase();\n if (listItems[i].classList.contains(\"italic\") || listItems[i].classList.contains(\"text-brand-orange\")) {\n listItems[i].style.display = \"\";\n } else {\n if (itemText.includes(query)) {\n listItems[i].style.display = \"\";\n } else {\n listItems[i].style.display = \"none\";\n }\n }\n }\n }\n\n function selectLecturerOption(prefix, value, displayText) {\n const hiddenInput = document.getElementById(`${prefix}-value`);\n const displaySpan = document.getElementById(`${prefix}-display`);\n const manualInput = document.getElementById(`${prefix}-manual`);\n \n hiddenInput.value = value;\n displaySpan.innerText = displayText;\n displaySpan.className = value === \"\" ? \"text-slate-400\" : \"text-slate-700 font-semibold\";\n\n if (value === \"manual\") {\n manualInput.classList.remove(\"hidden\");\n manualInput.required = true;\n setTimeout(() => manualInput.focus(), 50);\n } else {\n manualInput.classList.add(\"hidden\");\n manualInput.required = false;\n manualInput.value = \"\";\n }\n\n document.getElementById(`${prefix}-menu`).classList.add(\"hidden\");\n }\n\n function setToToday() {\n const today = new Date();\n const yyyy = today.getFullYear();\n let mm = today.getMonth() + 1;\n let dd = today.getDate();\n\n if (dd < 10) dd = '0' + dd;\n if (mm < 10) mm = '0' + mm;\n\n const formattedToday = yyyy + '-' + mm + '-' + dd;\n document.getElementById(\"selected-date\").value = formattedToday;\n loadSchedules();\n }\n\n function updateDbStatus(status) {\n const container = document.getElementById(\"db-connection-status\");\n if (!container) return;\n\n if (!GOOGLE_SCRIPT_URL) {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-300 bg-slate-100 text-xs font-semibold text-slate-500\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-slate-400\"><\/span>\n <\/span>\n <span>Lokal (Offline)<\/span>\n `;\n return;\n }\n\n if (status === 'connecting') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-brand-orange\/30 bg-brand-orangeLight text-xs font-semibold text-brand-orange\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-brand-orange opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-brand-orange\"><\/span>\n <\/span>\n <span class=\"flex items-center gap-1\">Menghubungkan Database... <i data-lucide=\"refresh-cw\" class=\"w-3.5 h-3.5 animate-spin\"><\/i><\/span>\n `;\n } else if (status === 'connected') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-emerald-300 bg-emerald-50 text-xs font-semibold text-emerald-700\";\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75\"><\/span>\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-emerald-500\"><\/span>\n <\/span>\n <span>Database Terhubung (Online)<\/span>\n `;\n } else if (status === 'offline') {\n container.className = \"flex items-center gap-2 px-3 py-1.5 rounded-full border border-rose-300 bg-rose-50 text-xs font-semibold text-rose-700 cursor-pointer hover:bg-rose-100 transition\";\n container.setAttribute(\"onclick\", \"loadSchedules()\");\n container.setAttribute(\"title\", \"Klik untuk menyinkronkan ulang database\");\n container.innerHTML = `\n <span class=\"relative flex h-2 w-2\">\n <span class=\"relative inline-flex rounded-full h-2 w-2 bg-rose-500\"><\/span>\n <\/span>\n <span class=\"flex items-center gap-1\">Mode Lokal (Offline) <i data-lucide=\"refresh-cw\" class=\"w-3 h-3\"><\/i><\/span>\n `;\n }\n lucide.createIcons();\n }\n\n async function loadSchedules() {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n document.getElementById(\"display-date-string\").innerText = getReadableDate(selectedDate);\n\n const ketentuanText = document.getElementById(\"ketentuan-sesi-text\");\n if (isFriday(selectedDate)) {\n ketentuanText.innerHTML = `<span class=\"text-rose-600 font-bold\">Khusus Hari Jumat:<\/span> Sesi 3 (11:00-12:20) ditiadakan untuk Sholat Jumat. Kapasitas harian adalah 12 sesi.`;\n } else {\n ketentuanText.innerHTML = `Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: Kosong, Putih: Terisi.`;\n }\n\n loadLocalSchedules(selectedDate);\n renderScheduleGrid();\n updateStats();\n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n const res = await fetch(GOOGLE_SCRIPT_URL);\n const rawData = await res.json();\n \n const serverSchedules = rawData.filter(item => normalizeDate(item.tanggal) === selectedDate);\n let merged = [];\n \n serverSchedules.forEach(serverItem => {\n const slotKey = `${normalizeDate(serverItem.tanggal)}-${serverItem.ruang}-${serverItem.sesi}`;\n if (!deletedSlots.includes(slotKey)) {\n merged.push(serverItem);\n }\n });\n\n currentSchedules.forEach(localItem => {\n const existsInServer = merged.some(serverItem => \n parseInt(serverItem.sesi) === parseInt(localItem.sesi) && \n parseInt(serverItem.ruang) === parseInt(localItem.ruang) &&\n normalizeDate(serverItem.tanggal) === normalizeDate(localItem.tanggal)\n );\n if (!existsInServer) {\n merged.push(localItem);\n }\n });\n\n currentSchedules = merged;\n renderScheduleGrid();\n updateStats();\n updateDbStatus('connected');\n } catch (e) {\n console.error(\"Gagal sinkronisasi background dengan Google Sheets.\", e);\n updateDbStatus('offline');\n }\n } else {\n updateDbStatus('offline');\n }\n }\n\n function loadLocalSchedules(selectedDate) {\n const stored = localStorage.getItem(\"munakosah_schedules\");\n if (stored) {\n const allSchedules = JSON.parse(stored);\n currentSchedules = allSchedules.filter(item => normalizeDate(item.tanggal) === selectedDate);\n } else {\n currentSchedules = [];\n }\n }\n\n \/\/ ==================== HEADER SETTER ====================\n function updateModalHeaderByType() {\n const isProposal = document.getElementById(\"type-proposal\").checked;\n const modalTitle = document.getElementById(\"modal-title\");\n const labelTitle = document.getElementById(\"label-field-title\");\n const fieldTitle = document.getElementById(\"field-title\");\n\n if (isProposal) {\n modalTitle.innerText = \"Atur Sesi Sidang Proposal Baru\";\n labelTitle.innerText = \"Judul Proposal Skripsi \/ Tugas Akhir\";\n fieldTitle.placeholder = \"Masukkan judul proposal lengkap mahasiswa\";\n } else {\n modalTitle.innerText = \"Atur Sesi Sidang Munaqosah Baru\";\n labelTitle.innerText = \"Judul Skripsi \/ Tugas Akhir\";\n fieldTitle.placeholder = \"Masukkan judul skripsi lengkap mahasiswa\";\n }\n }\n\n function renderScheduleGrid() {\n const tbody = document.getElementById(\"schedule-grid-body\");\n tbody.innerHTML = \"\";\n\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n const isDayFriday = isFriday(selectedDate);\n\n sessions.forEach(sess => {\n const tr = document.createElement(\"tr\");\n tr.className = \"hover:bg-slate-50\/50 transition\";\n\n const isFridaySesi3 = isDayFriday && sess.id === 3;\n\n let tdTime = `\n <td class=\"py-4 px-4 text-center border-r border-slate-200 ${isFridaySesi3 ? 'bg-slate-100 text-slate-400' : 'bg-slate-50'}\">\n <span class=\"block font-bold text-sm ${isFridaySesi3 ? 'text-slate-400 line-through' : 'text-slate-800'}\">${sess.label}<\/span>\n <span class=\"block text-xs font-semibold mt-1 rounded-full py-0.5 border ${isFridaySesi3 ? 'bg-slate-200 border-slate-300 text-slate-500' : 'bg-brand-greenLight border-brand-green\/20 text-brand-green'}\">${sess.time}<\/span>\n <\/td>\n `;\n tr.innerHTML = tdTime;\n\n for (let room = 1; room <= 3; room++) {\n let tdRoom = \"\";\n\n if (isFridaySesi3) {\n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-middle text-center bg-slate-100 text-slate-400 font-medium\">\n <div class=\"flex flex-col items-center justify-center py-4 gap-1 opacity-70\">\n <i data-lucide=\"moon-star\" class=\"w-5 h-5 text-brand-orange\"><\/i>\n <span class=\"text-xs font-bold uppercase tracking-wider text-slate-500\">Sholat Jumat<\/span>\n <span class=\"text-[10px] text-slate-400\">Sesi Tidak Tersedia<\/span>\n <\/div>\n <\/td>\n `;\n } else {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === sess.id && parseInt(item.ruang) === room);\n \n if (allocation) {\n const isOwner = currentUser && allocation.createdByEmail === currentUser.email;\n const sidangType = allocation.jenisSidang || \"Sidang Munaqosah\";\n const isProposal = sidangType === \"Sidang Proposal\";\n \n const badgeColorClass = isProposal \n ? \"bg-amber-100 text-amber-900 border-amber-200\" \n : \"bg-brand-greenLight text-brand-greenDark border-brand-green\/20\";\n \n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-top transition-all\" id=\"cell-${room}-${sess.id}\">\n <div onclick=\"handleSlotClick(${room}, ${sess.id}, true)\" class=\"bg-white border border-slate-200 rounded-lg p-3 transition duration-200 cursor-pointer h-full flex flex-col justify-between relative group shadow-sm hover:shadow-md\">\n <div>\n <div class=\"flex justify-between items-start gap-1\">\n <span class=\"text-xs font-bold text-slate-800 block break-words flex-1 pr-2\">${allocation.mahasiswa}<\/span>\n <span class=\"text-[9px] bg-slate-100 text-slate-600 font-bold px-1.5 py-0.5 rounded uppercase shrink-0\">${allocation.nim}<\/span>\n <\/div>\n <div class=\"mt-1 flex items-center justify-between\">\n <span class=\"text-[9px] ${badgeColorClass} font-bold px-2 py-0.5 border rounded-md\">\n ${sidangType}\n <\/span>\n <span class=\"text-[10px] text-brand-orange font-semibold truncate block max-w-[100px]\">${allocation.prodi}<\/span>\n <\/div>\n <p class=\"text-[11px] text-slate-500 italic mt-2 line-clamp-2 leading-tight\">\"${allocation.judul}\"<\/p>\n <\/div>\n \n <div class=\"mt-3 pt-2 border-t border-slate-100 flex justify-between items-center text-[10px] text-slate-400\">\n <span class=\"flex items-center gap-1 truncate max-w-[120px]\">\n <i data-lucide=\"user-check\" class=\"w-3 h-3 text-brand-green\"><\/i>\n ${allocation.pembimbing ? allocation.pembimbing.split(',')[0] : '-'}\n <\/span>\n \n ${isOwner ? \n `<span class=\"text-[9px] bg-brand-orangeLight text-brand-orange px-1.5 py-0.5 rounded font-bold flex items-center gap-0.5 animate-pulse\">\n <i data-lucide=\"edit-3\" class=\"w-2.5 h-2.5\"><\/i> Edit\n <\/span>` : \n `<span class=\"text-[9px] bg-slate-50 text-slate-400 px-1.5 py-0.5 rounded flex items-center gap-0.5\">\n <i data-lucide=\"lock\" class=\"w-2.5 h-2.5\"><\/i> Detail\n <\/span>`\n }\n <\/div>\n <\/div>\n <\/td>\n `;\n } else {\n tdRoom = `\n <td class=\"p-3 border-r border-slate-200 align-middle text-center transition-all bg-brand-greenLight\/20 hover:bg-brand-greenLight\/50 cursor-pointer\" onclick=\"handleSlotClick(${room}, ${sess.id}, false)\">\n <div class=\"flex flex-col items-center justify-center py-4 text-brand-green gap-1 opacity-70 hover:opacity-100 transition\">\n <i data-lucide=\"plus\" class=\"w-5 h-5\"><\/i>\n <span class=\"text-xs font-bold uppercase tracking-wider\">Tersedia<\/span>\n <span class=\"text-[10px] text-brand-green\/80 font-medium\">Klik untuk Atur<\/span>\n <\/div>\n <\/td>\n `;\n }\n }\n tr.innerHTML += tdRoom;\n }\n\n tbody.appendChild(tr);\n });\n\n lucide.createIcons();\n }\n\n function updateStats() {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n const isDayFriday = isFriday(selectedDate);\n const totalSlots = isDayFriday ? 12 : 15; \n \n const validFilledSlots = currentSchedules.filter(item => !(isDayFriday && parseInt(item.sesi) === 3));\n const filledCount = validFilledSlots.length;\n const emptyCount = Math.max(0, totalSlots - filledCount);\n\n document.getElementById(\"stats-terisi\").innerText = filledCount;\n document.getElementById(\"stats-terisi-denom\").innerText = `\/ ${totalSlots} Sesi`;\n document.getElementById(\"stats-tersedia\").innerText = emptyCount;\n }\n\n function handleSlotClick(room, sessionId, isFilled) {\n const selectedDate = normalizeDate(document.getElementById(\"selected-date\").value);\n \n if (isFriday(selectedDate) && sessionId === 3) {\n alertMessage(\"Sesi ini ditiadakan karena pelaksanaan ibadah Sholat Jumat.\");\n return;\n }\n\n activeSelection = {\n date: selectedDate,\n room: room,\n session: sessionId\n };\n\n if (isFilled) {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === sessionId && parseInt(item.ruang) === room);\n openViewModal(allocation);\n } else {\n if (currentUser) {\n openBookingModal(null, false);\n } else {\n alertMessage(\"Harap login sebagai Petugas Kaprodi untuk meregistrasikan jadwal.\");\n openLoginModal();\n }\n }\n }\n\n function openLoginModal() {\n document.getElementById(\"login-error-msg\").classList.add(\"hidden\");\n document.getElementById(\"login-modal\").classList.remove(\"hidden\");\n }\n\n function closeLoginModal() {\n document.getElementById(\"login-modal\").classList.add(\"hidden\");\n }\n\n function handleLogin(e) {\n e.preventDefault();\n const email = document.getElementById(\"login-email\").value;\n const passInput = document.getElementById(\"login-password\");\n const pass = passInput.value;\n\n const matchedUser = authorizedUsers[email];\n if (matchedUser && matchedUser.pass === pass) {\n currentUser = {\n email: email,\n name: matchedUser.name,\n prodi: matchedUser.prodi,\n nip: matchedUser.nip\n };\n localStorage.setItem(\"munakosah_user\", JSON.stringify(currentUser));\n updateAuthUI();\n closeLoginModal();\n alertMessage(`Selamat Datang, ${currentUser.name}!`);\n } else {\n document.getElementById(\"login-error-msg\").classList.remove(\"hidden\");\n passInput.value = \"\";\n passInput.focus();\n }\n }\n\n function handleLogout() {\n currentUser = null;\n localStorage.removeItem(\"munakosah_user\");\n \n const passInput = document.getElementById(\"login-password\");\n if (passInput) passInput.value = \"\";\n \n updateAuthUI();\n alertMessage(\"Sesi Petugas Berakhir.\");\n }\n\n function updateAuthUI() {\n const container = document.getElementById(\"auth-section\");\n if (currentUser) {\n container.innerHTML = `\n <div class=\"flex items-center gap-3\">\n <div class=\"text-right hidden sm:block\">\n <span class=\"block text-xs font-bold text-slate-700\">${currentUser.name}<\/span>\n <span class=\"block text-[10px] text-brand-orange font-semibold\">${currentUser.prodi}<\/span>\n <\/div>\n <button onclick=\"handleLogout()\" class=\"bg-rose-700\/80 hover:bg-rose-800 text-white font-medium px-3 py-1.5 rounded-lg text-xs transition flex items-center gap-1 border border-rose-600\">\n <i data-lucide=\"log-out\" class=\"w-3.5 h-3.5\"><\/i>\n Keluar\n <\/button>\n <\/div>\n `;\n } else {\n container.innerHTML = `\n <button onclick=\"openLoginModal()\" class=\"flex items-center gap-2 bg-brand-orange hover:bg-brand-orangeHover text-white font-semibold px-4 py-2 rounded-lg transition text-sm shadow-md\">\n <i data-lucide=\"log-in\" class=\"w-4 h-4\"><\/i>\n Login Kaprodi\n <\/button>\n `;\n }\n lucide.createIcons();\n renderScheduleGrid();\n }\n\n \/\/ ==================== BOOKING CORE SERVICE ====================\n function openBookingModal(data, isEdit) {\n const modal = document.getElementById(\"booking-modal\");\n const sessDetails = sessions.find(s => s.id === activeSelection.session);\n\n document.getElementById(\"meta-date\").innerText = getReadableDate(activeSelection.date);\n document.getElementById(\"meta-room\").innerText = \"Ruang \" + activeSelection.room;\n document.getElementById(\"meta-session\").innerText = sessDetails.label + \" (\" + sessDetails.time + \")\";\n\n if (isEdit && data) {\n const currentType = data.jenisSidang || \"Sidang Munaqosah\";\n if (currentType === \"Sidang Proposal\") {\n document.getElementById(\"type-proposal\").checked = true;\n } else {\n document.getElementById(\"type-munaqosah\").checked = true;\n }\n\n updateModalHeaderByType();\n \n document.getElementById(\"field-student\").value = data.mahasiswa;\n document.getElementById(\"field-nim\").value = data.nim;\n document.getElementById(\"field-prodi\").value = data.prodi;\n document.getElementById(\"field-title\").value = data.judul;\n\n setLecturerFieldValue(\"field-advisor\", data.pembimbing);\n setLecturerFieldValue(\"field-secretary\", data.sekretaris);\n setLecturerFieldValue(\"field-examiner1\", data.penguji1);\n setLecturerFieldValue(\"field-examiner2\", data.penguji2);\n\n document.getElementById(\"btn-delete\").classList.remove(\"hidden\");\n document.getElementById(\"btn-print\").classList.remove(\"hidden\");\n document.getElementById(\"btn-save-submit\").innerHTML = `<i data-lucide=\"save\" class=\"w-4 h-4\"><\/i> Perbarui`;\n } else {\n document.getElementById(\"type-munaqosah\").checked = true;\n updateModalHeaderByType();\n\n document.getElementById(\"field-student\").value = \"\";\n document.getElementById(\"field-nim\").value = \"\";\n \n \/\/ SMART MATCHING: Set program studi sesuai prodi aktif Kaprodi yang login\n const prodiSelect = document.getElementById(\"field-prodi\");\n if (currentUser && currentUser.email) {\n prodiSelect.value = getProdiCodeByEmail(currentUser.email);\n } else {\n prodiSelect.value = \"KPI\";\n }\n\n document.getElementById(\"field-title\").value = \"\";\n\n resetLecturerField(\"field-advisor\");\n resetLecturerField(\"field-secretary\");\n resetLecturerField(\"field-examiner1\");\n resetLecturerField(\"field-examiner2\");\n\n document.getElementById(\"btn-delete\").classList.add(\"hidden\");\n document.getElementById(\"btn-print\").classList.add(\"hidden\");\n document.getElementById(\"btn-save-submit\").innerHTML = `<i data-lucide=\"save\" class=\"w-4 h-4\"><\/i> Simpan`;\n }\n\n modal.classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function setLecturerFieldValue(fieldPrefix, name) {\n const hiddenInput = document.getElementById(`${fieldPrefix}-value`);\n const displaySpan = document.getElementById(`${fieldPrefix}-display`);\n const manualInput = document.getElementById(`${fieldPrefix}-manual`);\n \n if (!name) {\n hiddenInput.value = \"\";\n displaySpan.innerText = \"-- Pilih Nama Dosen --\";\n displaySpan.className = \"text-slate-400\";\n manualInput.classList.add(\"hidden\");\n manualInput.value = \"\";\n manualInput.required = false;\n return;\n }\n\n if (lecturerDatabase.includes(name)) {\n hiddenInput.value = name;\n displaySpan.innerText = name;\n displaySpan.className = \"text-slate-700 font-semibold\";\n manualInput.classList.add(\"hidden\");\n manualInput.value = \"\";\n manualInput.required = false;\n } else {\n hiddenInput.value = \"manual\";\n displaySpan.innerText = \"\u270d\ufe0f Ketik Nama Manual...\";\n displaySpan.className = \"text-slate-700 font-semibold\";\n manualInput.classList.remove(\"hidden\");\n manualInput.value = name;\n manualInput.required = true;\n }\n }\n\n function getLecturerFieldValue(fieldPrefix) {\n const val = document.getElementById(`${fieldPrefix}-value`).value;\n if (val === \"manual\") {\n return document.getElementById(`${fieldPrefix}-manual`).value.trim();\n }\n return val;\n }\n\n \/\/ ==================== RESET LECTURER FIELDS ====================\n function resetLecturerField(fieldPrefix) {\n const hiddenInput = document.getElementById(`${fieldPrefix}-value`);\n const displaySpan = document.getElementById(`${fieldPrefix}-display`);\n const manual = document.getElementById(`${fieldPrefix}-manual`);\n \n hiddenInput.value = \"\";\n displaySpan.innerText = \"-- Pilih Nama Dosen --\";\n displaySpan.className = \"text-slate-400\";\n manual.classList.add(\"hidden\");\n manual.value = \"\";\n manual.required = false;\n }\n\n function closeBookingModal() {\n document.getElementById(\"booking-modal\").classList.add(\"hidden\");\n }\n\n async function handleSaveBooking(e) {\n e.preventDefault();\n\n if (!currentUser) {\n alertMessage(\"Anda harus masuk kembali.\");\n return;\n }\n\n const pembimbing = getLecturerFieldValue(\"field-advisor\");\n const sekretaris = getLecturerFieldValue(\"field-secretary\");\n const penguji1 = getLecturerFieldValue(\"field-examiner1\");\n const penguji2 = getLecturerFieldValue(\"field-examiner2\");\n\n if (!pembimbing || !sekretaris || !penguji1 || !penguji2) {\n alertMessage(\"Harap tentukan Dosen Pembimbing, Sekretaris, dan Penguji!\");\n return;\n }\n\n const activeType = document.querySelector('input[name=\"field-type\"]:checked').value;\n\n const payload = {\n id: \"MUN-\" + Date.now().toString().slice(-6),\n tanggal: normalizeDate(activeSelection.date),\n ruang: activeSelection.room,\n sesi: activeSelection.session,\n jenisSidang: activeType,\n mahasiswa: document.getElementById(\"field-student\").value,\n nim: document.getElementById(\"field-nim\").value,\n prodi: document.getElementById(\"field-prodi\").value,\n judul: document.getElementById(\"field-title\").value,\n pembimbing: pembimbing,\n sekretaris: sekretaris,\n penguji1: penguji1,\n penguji2: penguji2,\n createdBy: currentUser.name,\n createdByEmail: currentUser.email,\n createdByNip: currentUser.nip || \"\" \n };\n\n const slotKey = `${normalizeDate(payload.tanggal)}-${payload.ruang}-${payload.sesi}`;\n deletedSlots = deletedSlots.filter(key => key !== slotKey);\n\n updateLocalState(payload, \"save\");\n closeBookingModal();\n loadSchedules(); \n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n await fetch(GOOGLE_SCRIPT_URL, {\n method: \"POST\",\n mode: \"no-cors\", \n headers: {\n \"Content-Type\": \"application\/json\"\n },\n body: JSON.stringify({\n action: \"save\",\n data: payload\n })\n });\n \n alertMessage(\"Jadwal sukses disinkronkan ke Google Spreadsheet.\");\n updateDbStatus('connected');\n } catch (error) {\n console.error(\"Gagal mengirim ke Google Sheets, data tetap aman di memori lokal.\", error);\n updateDbStatus('offline');\n }\n } else {\n alertMessage(\"Jadwal sukses disimpan ke Database Lokal.\");\n }\n }\n\n \/\/ ==================== CUSTOM MODAL CONFIRMATION SERVICE ====================\n function triggerDeleteConfirmation() {\n const target = currentSchedules.find(item => \n normalizeDate(item.tanggal) === normalizeDate(activeSelection.date) && \n parseInt(item.ruang) === parseInt(activeSelection.room) && \n parseInt(item.sesi) === parseInt(activeSelection.session)\n );\n \n if (!target || !currentUser || target.createdByEmail !== currentUser.email) {\n alertMessage(\"Proteksi Keamanan: Hanya pembuat awal sesi ini yang diijinkan menghapus.\");\n return;\n }\n\n document.getElementById(\"confirm-modal-text\").innerHTML = `Apakah Anda yakin ingin membebaskan\/mengosongkan jadwal sidang atas nama mahasiswa <strong>${target.mahasiswa}<\/strong> (NIM: ${target.nim})? Tindakan ini akan segera disinkronkan ke database.`;\n \n const execBtn = document.getElementById(\"btn-confirm-execute\");\n execBtn.onclick = function() {\n closeConfirmModal();\n executeDeletion();\n };\n\n document.getElementById(\"confirm-modal\").classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function closeConfirmModal() {\n document.getElementById(\"confirm-modal\").classList.add(\"hidden\");\n }\n\n async function executeDeletion() {\n const payload = {\n tanggal: normalizeDate(activeSelection.date),\n ruang: activeSelection.room,\n sesi: activeSelection.session\n };\n\n const slotKey = `${normalizeDate(payload.tanggal)}-${payload.ruang}-${payload.sesi}`;\n if (!deletedSlots.includes(slotKey)) {\n deletedSlots.push(slotKey);\n }\n\n updateLocalState(payload, \"delete\");\n closeBookingModal();\n loadSchedules(); \n\n if (GOOGLE_SCRIPT_URL) {\n updateDbStatus('connecting');\n try {\n await fetch(GOOGLE_SCRIPT_URL, {\n method: \"POST\",\n mode: \"no-cors\",\n headers: {\n \"Content-Type\": \"application\/json\"\n },\n body: JSON.stringify({\n action: \"delete\",\n data: payload\n })\n });\n alertMessage(\"Sesi dikosongkan dari Google Spreadsheet.\");\n updateDbStatus('connected');\n } catch (e) {\n console.error(\"Gagal menghapus di Sheets background:\", e);\n updateDbStatus('offline');\n }\n } else {\n alertMessage(\"Sesi berhasil dikosongkan.\");\n }\n }\n\n function updateLocalState(payload, action) {\n let allSchedules = [];\n const stored = localStorage.getItem(\"munakosah_schedules\");\n if (stored) {\n allSchedules = JSON.parse(stored);\n }\n\n allSchedules = allSchedules.filter(item => !(\n normalizeDate(item.tanggal) === normalizeDate(payload.tanggal) &&\n parseInt(item.ruang) === parseInt(payload.ruang) &&\n parseInt(item.sesi) === parseInt(payload.sesi)\n ));\n\n if (action === \"save\") {\n allSchedules.push(payload);\n }\n\n localStorage.setItem(\"munakosah_schedules\", JSON.stringify(allSchedules));\n }\n\n \/\/ ==================== VIEW SLOT SERVICE & DETAIL INFO ====================\n function openViewModal(data) {\n const modal = document.getElementById(\"view-modal\");\n const sessDetails = sessions.find(s => s.id === parseInt(data.sesi));\n\n const isProposal = (data.jenisSidang === \"Sidang Proposal\");\n\n document.getElementById(\"view-meta-date\").innerText = getReadableDate(data.tanggal);\n document.getElementById(\"view-meta-room\").innerText = \"Ruang \" + data.ruang;\n document.getElementById(\"view-meta-session\").innerText = sessDetails.label + \" (\" + sessDetails.time + \")\";\n\n const badgeElement = document.getElementById(\"view-jenis-sidang-badge\");\n badgeElement.innerText = data.jenisSidang || \"Sidang Munaqosah\";\n if (isProposal) {\n badgeElement.className = \"col-span-2 inline-block max-w-max font-bold text-xs px-2.5 py-1 bg-amber-100 text-amber-900 rounded border border-amber-200 shadow-sm\";\n document.getElementById(\"label-view-title\").innerText = \"Judul Proposal\";\n } else {\n badgeElement.className = \"col-span-2 inline-block max-w-max font-bold text-xs px-2.5 py-1 bg-brand-greenLight text-brand-greenDark rounded border border-brand-green\/20 shadow-sm\";\n document.getElementById(\"label-view-title\").innerText = \"Judul Skripsi\";\n }\n\n document.getElementById(\"view-student\").innerText = data.mahasiswa;\n document.getElementById(\"view-nim-prodi\").innerText = data.nim + \" \/ \" + data.prodi;\n document.getElementById(\"view-title\").innerText = `\"${data.judul}\"`;\n document.getElementById(\"view-advisor\").innerText = data.pembimbing || \"-\";\n document.getElementById(\"view-secretary\").innerText = data.sekretaris || \"-\";\n document.getElementById(\"view-examiner1\").innerText = data.penguji1 || \"-\";\n document.getElementById(\"view-examiner2\").innerText = data.penguji2 || \"-\";\n\n activeSelection = {\n date: normalizeDate(data.tanggal),\n room: data.ruang,\n session: data.sesi\n };\n\n const lockBox = document.getElementById(\"protective-lock-box\");\n const lockIcon = document.getElementById(\"protective-lock-icon\");\n const lockText = document.getElementById(\"protective-lock-text\");\n const ownerEditBtn = document.getElementById(\"btn-owner-edit\");\n\n if (currentUser) {\n if (data.createdByEmail === currentUser.email) {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-brand-greenLight border border-brand-green\/20 text-brand-greenDark\";\n lockText.innerText = `Otoritas Terbuka: Jadwal ini dibuat oleh Anda (${data.createdBy}). Anda dapat mengubah atau mengosongkan jadwal ini.`;\n lockIcon.setAttribute(\"data-lucide\", \"unlock\");\n ownerEditBtn.classList.remove(\"hidden\");\n } else {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-rose-50 border border-rose-200 text-rose-800\";\n lockText.innerText = `Sesi ini dikunci oleh ${data.createdBy} (${data.prodi}). Hanya akun yang bersangkutan yang diijinkan untuk melakukan perubahan.`;\n lockIcon.setAttribute(\"data-lucide\", \"lock\");\n ownerEditBtn.classList.add(\"hidden\");\n }\n lockBox.classList.remove(\"hidden\");\n } else {\n lockBox.className = \"rounded-lg p-3 flex gap-2.5 items-start text-xs bg-brand-orangeLight border border-brand-orange\/20 text-slate-800\";\n lockText.innerText = `Sidang ini diverifikasi oleh ${data.createdBy}. Harap masuk dengan akun Kaprodi Anda jika ini milik Anda.`;\n lockIcon.setAttribute(\"data-lucide\", \"lock\");\n lockBox.classList.remove(\"hidden\");\n ownerEditBtn.classList.add(\"hidden\");\n }\n\n modal.classList.remove(\"hidden\");\n lucide.createIcons();\n }\n\n function triggerOwnerEdit() {\n closeViewModal();\n const data = currentSchedules.find(item => \n normalizeDate(item.tanggal) === normalizeDate(activeSelection.date) && \n parseInt(item.ruang) === parseInt(activeSelection.room) && \n parseInt(item.sesi) === parseInt(activeSelection.session)\n );\n if (data) {\n openBookingModal(data, true);\n }\n }\n\n function closeViewModal() {\n document.getElementById(\"view-modal\").classList.add(\"hidden\");\n }\n\n \/\/ ==================== PRINT ENGINE RESMI ====================\n function triggerPrintFromModal() {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === parseInt(activeSelection.session) && parseInt(item.ruang) === parseInt(activeSelection.room));\n if (allocation) {\n prepareAndPrintSlip(allocation);\n }\n }\n\n function triggerPrintFromView() {\n const allocation = currentSchedules.find(item => parseInt(item.sesi) === parseInt(activeSelection.session) && parseInt(item.ruang) === parseInt(activeSelection.room));\n if (allocation) {\n prepareAndPrintSlip(allocation);\n }\n }\n\n function prepareAndPrintSlip(allocation) {\n const sessDetails = sessions.find(s => s.id === parseInt(allocation.sesi));\n const activeType = allocation.jenisSidang || \"Sidang Munaqosah\";\n const isProposal = activeType === \"Sidang Proposal\";\n\n if (isProposal) {\n document.getElementById(\"print-document-title\").innerText = \"SURAT KETERANGAN JADWAL SIDANG PROPOSAL SKRIPSI\";\n } else {\n document.getElementById(\"print-document-title\").innerText = \"SURAT KETERANGAN JADWAL SIDANG MUNAQOSAH SKRIPSI\";\n }\n \n document.getElementById(\"print-slip-id\").innerText = \"No. Berkas: FDK\/MUN\/\" + String(allocation.id).split('-').pop().toUpperCase();\n \n document.getElementById(\"print-jenis-sidang\").innerText = activeType.toUpperCase();\n document.getElementById(\"print-mahasiswa\").innerText = allocation.mahasiswa;\n document.getElementById(\"print-nim-prodi\").innerText = allocation.nim + \" \/ \" + allocation.prodi;\n document.getElementById(\"print-tanggal\").innerText = getReadableDate(allocation.tanggal);\n document.getElementById(\"print-waktu\").innerText = sessDetails.label + \" (\" + sessDetails.time + \" WIB)\";\n document.getElementById(\"print-ruang\").innerText = \"RUANGAN \" + allocation.ruang + \" (Lantai 1 Gedung FDK UIN Sunan Kalijaga)\";\n document.getElementById(\"print-judul\").innerText = `\"${allocation.judul}\"`;\n document.getElementById(\"print-pembimbing\").innerText = allocation.pembimbing || '-';\n document.getElementById(\"print-sekretaris\").innerText = allocation.sekretaris || '-';\n document.getElementById(\"print-penguji1\").innerText = allocation.penguji1 || '-';\n document.getElementById(\"print-penguji2\").innerText = allocation.penguji2 || '-';\n\n const todayStr = new Date().toLocaleDateString('id-ID', { year: 'numeric', month: 'long', day: 'numeric' });\n document.getElementById(\"print-ttd-date\").innerText = \"Yogyakarta, \" + todayStr;\n \n const verifikatorName = allocation.createdBy;\n let foundNip = \"19750812 200312 1 002\"; \n let foundProdiCode = \"Kaprodi FDK\";\n\n for (const email in authorizedUsers) {\n if (authorizedUsers[email].name === verifikatorName) {\n foundNip = authorizedUsers[email].nip;\n foundProdiCode = \"Ketua Program Studi \" + authorizedUsers[email].prodi.split(' (')[0];\n break;\n }\n }\n\n document.getElementById(\"print-ttd-role\").innerHTML = \"a.n. Dekan,<br>\" + foundProdiCode;\n document.getElementById(\"print-ttd-officer\").innerText = verifikatorName;\n document.getElementById(\"print-ttd-nip\").innerText = \"NIP. \" + foundNip;\n\n setTimeout(() => {\n window.print();\n }, 150);\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Sistem Manajemen Ruang Sidang – FDK UIN Sunan Kalijaga Sistem Ruang Sidang FDK Fakultas Dakwah dan Komunikasi \u2022 UIN Sunan Kalijaga Memuat Status Koneksi… Login Kaprodi Tanggal Pelaksanaan Sidang Hari Ini Total Sesi Terisi 0 \/ 15 Sesi Tersedia (Hijau) 15 Sesi Ketentuan Sesi Sesi: 80-90 Menit. Transisi: 10 Menit tanpa istirahat tengah hari. Hijau: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-14","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=14"}],"version-history":[{"count":1,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions"}],"predecessor-version":[{"id":15,"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions\/15"}],"wp:attachment":[{"href":"http:\/\/rasida.uin-suka.ac.id\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=14"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}