<div id="actionPasscodeOverlay" style="display:none;position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:99999;align-items:center;justify-content:center;">
  <div style="background:#fff;border-radius:18px;max-width:420px;width:92%;padding:24px;box-shadow:0 25px 60px rgba(0,0,0,.25);font-family:Poppins,Arial,sans-serif;">
    <h3 style="font-size:20px;font-weight:800;margin:0 0 8px;color:#0f172a;">Konfirmasi Passcode</h3>
    <p style="font-size:14px;color:#64748b;margin:0 0 16px;">Masukkan passcode pribadi untuk melanjutkan aksi edit/hapus.</p>
    <input id="actionPasscodeInput" type="password" inputmode="numeric" style="width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:12px;font-size:16px;" placeholder="Passcode pribadi">
    <div id="actionPasscodeError" style="display:none;color:#dc2626;font-size:13px;margin-top:8px;">Passcode salah.</div>
    <div style="display:flex;gap:10px;justify-content:flex-end;margin-top:18px;">
      <button type="button" id="actionPasscodeCancel" style="padding:10px 14px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;">Batal</button>
      <button type="button" id="actionPasscodeConfirm" style="padding:10px 16px;border-radius:10px;border:0;background:#2563eb;color:#fff;font-weight:700;">Lanjutkan</button>
    </div>
  </div>
</div>
<script>
(function(){
  let pendingTarget=null;
  const overlay=document.getElementById('actionPasscodeOverlay');
  const input=document.getElementById('actionPasscodeInput');
  const err=document.getElementById('actionPasscodeError');
  function needsPasscode(el){
    if(!el) return false;
    if(el.closest('[data-no-passcode="1"]')) return false;
    if(el.matches('[data-passcode-required="1"]')) return true;
    const txt=(el.innerText||el.value||el.getAttribute('title')||'').toLowerCase();
    const href=(el.getAttribute && (el.getAttribute('href')||'')) || '';
    const onclick=(el.getAttribute && (el.getAttribute('onclick')||'')) || '';
    return /hapus|delete|remove|edit|ubah|update|batal|cancel/.test(txt+' '+href+' '+onclick);
  }
  document.addEventListener('click', function(e){
    const el=e.target.closest('a,button,input[type="submit"]');
    if(!needsPasscode(el)) return;
    if(el.dataset.passcodeOk==='1'){ el.dataset.passcodeOk=''; return; }
    e.preventDefault(); e.stopPropagation(); pendingTarget=el; err.style.display='none'; input.value=''; overlay.style.display='flex'; setTimeout(()=>input.focus(),50);
  }, true);
  document.getElementById('actionPasscodeCancel').onclick=function(){ overlay.style.display='none'; pendingTarget=null; };
  document.getElementById('actionPasscodeConfirm').onclick=async function(){
    const fd=new FormData(); fd.append('passcode', input.value || '');
    try{
      const r=await fetch('passcode_verify.php',{method:'POST',body:fd,credentials:'same-origin'});
      const j=await r.json();
      if(j.ok && pendingTarget){
        overlay.style.display='none'; pendingTarget.dataset.passcodeOk='1';
        if(pendingTarget.tagName==='A') window.location.href=pendingTarget.href;
        else pendingTarget.click();
      } else { err.style.display='block'; }
    }catch(ex){ err.textContent='Gagal verifikasi passcode.'; err.style.display='block'; }
  };
})();
</script>