/* Popup kata laluan seragam untuk semua modul Portal KiSTARP */
:root{--auth-navy:#0b2e63;--auth-blue:#1d4f91;--auth-line:#d7e0ea;--auth-muted:#66758d;--auth-danger:#a51d22}
.warga-login-card,.alumni-login-card,.student-login-card,.admin-login,.exam-login,.system-login-form,.login-card,.box{
  width:min(390px,calc(100% - 32px))!important;margin:auto!important;padding:26px!important;background:#fff!important;
  border:1px solid var(--auth-line)!important;border-top:5px solid #ffd100!important;border-radius:4px!important;
  box-shadow:0 24px 80px rgba(7,30,65,.30)!important;box-sizing:border-box!important
}
body:has(.warga-login-card),body:has(.alumni-login-card),body:has(.student-login-card),body:has(.admin-login),body:has(.exam-login),body:has(.system-login-form){overflow-x:hidden}
body:has(.warga-login-card)::before,body:has(.alumni-login-card)::before,body:has(.student-login-card)::before,body:has(.admin-login)::before,body:has(.exam-login)::before,body:has(.system-login-form)::before{
 content:"";position:fixed;inset:0;background:rgba(7,30,65,.60);backdrop-filter:blur(5px);z-index:4000
}
body:has(.warga-login-card) .warga-login-card,body:has(.alumni-login-card) .alumni-login-card,body:has(.student-login-card) .student-login-card,body:has(.admin-login) .admin-login,body:has(.exam-login) .exam-login,body:has(.system-login-form) .system-login-form{
 position:fixed!important;z-index:4001!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;margin:0!important
}
.warga-login-card label,.alumni-login-card label,.student-login-card label,.admin-login label,.exam-login label,.system-login-form label,.login-card label,.box label{
 display:block!important;margin:0 0 7px!important;color:#47566d!important;font-size:.78rem!important;font-weight:700!important
}
.warga-login-card input[type=password],.alumni-login-card input[type=password],.student-login-card input[type=password],.admin-login input[type=password],.exam-login input[type=password],.system-login-form input[type=password],.login-card input[type=password],.box input[type=password]{
 width:100%!important;height:46px!important;padding:0 13px!important;background:#fff!important;color:#17284a!important;border:1px solid #aebdcc!important;border-radius:3px!important;font:inherit!important;font-size:.95rem!important;letter-spacing:.18em!important;outline:none!important;box-sizing:border-box!important
}
.warga-login-card input[type=password]:focus,.alumni-login-card input[type=password]:focus,.student-login-card input[type=password]:focus,.admin-login input[type=password]:focus,.exam-login input[type=password]:focus,.system-login-form input[type=password]:focus,.login-card input[type=password]:focus,.box input[type=password]:focus{border-color:var(--auth-blue)!important;box-shadow:0 0 0 4px rgba(29,79,145,.13)!important}
.warga-login-card button,.alumni-login-card button,.student-login-card button,.admin-login button,.exam-login button,.system-login-form button,.login-card button,.box button{
 width:100%!important;min-height:46px!important;margin-top:11px!important;padding:10px 15px!important;color:#fff!important;background:var(--auth-navy)!important;border:0!important;border-radius:3px!important;font:inherit!important;font-size:.82rem!important;font-weight:800!important;cursor:pointer!important
}
.warga-login-card button:hover,.alumni-login-card button:hover,.student-login-card button:hover,.admin-login button:hover,.exam-login button:hover,.system-login-form button:hover,.login-card button:hover,.box button:hover{background:#071f45!important}
.login-error,.alumni-login-error,.error{border-radius:3px!important}
@media(max-width:520px){.warga-login-card,.alumni-login-card,.student-login-card,.admin-login,.exam-login,.system-login-form,.login-card,.box{padding:21px!important}}
.system-login-form,.admin-login,.exam-login,.student-login-card,.warga-login-card,.alumni-login-card{display:block!important}
.system-login-form h2,.system-login-form p{margin-left:0!important;margin-right:0!important}
.system-login-form h2{margin-top:0!important;margin-bottom:7px!important;font-size:1.35rem!important;color:#17284a!important}
.system-login-form p{margin-top:0!important;margin-bottom:18px!important;font-size:.84rem!important;color:#66758d!important}

/* Login Galeri menggunakan popup petak yang sama */
.gallery-login-page{min-height:100vh!important;background:linear-gradient(135deg,#eef3f8,#dfe9f5)!important;font-family:'Poppins',sans-serif!important;overflow:hidden}
.gallery-login-page::before{content:"";position:fixed;inset:0;background:rgba(7,30,65,.60);backdrop-filter:blur(5px);z-index:4000}
.gallery-login-page .box{position:fixed!important;z-index:4001!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;margin:0!important;border-radius:4px!important}
.gallery-login-page .box h1{margin:0 0 7px!important;color:#17284a!important;font-size:1.35rem!important}
.gallery-login-page .box .sub{margin:0 0 18px!important;color:#66758d!important;font-size:.84rem!important;line-height:1.65!important}
.gallery-login-page .box .back{display:block;margin-top:15px;text-align:center;color:#0b2e63!important;font-size:.78rem!important;font-weight:700;text-decoration:none}

/* =========================================================
   STANDARD POPUP LOGIN KiSTARP
   Rujukan rasmi: popup Akses Warga + butang Batal
   ========================================================= */
:root{
  --kistarp-auth-navy:#0b3470;
  --kistarp-auth-navy-hover:#082858;
  --kistarp-auth-yellow:#ffd20a;
  --kistarp-auth-border:#d7dee8;
  --kistarp-auth-text:#123467;
  --kistarp-auth-muted:#52627a;
}

/* Lapisan kabur di atas halaman semasa */
body.warga-locked::before,
body.alumni-locked::before,
body:has(.student-login-card)::before,
body:has(.system-login-form)::before,
body:has(.exam-login)::before,
body:has(.admin-login)::before,
body.gallery-login-page::before{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  z-index:8998!important;
  background:rgba(21,48,83,.56)!important;
  -webkit-backdrop-filter:blur(5px)!important;
  backdrop-filter:blur(5px)!important;
}

/* Kad popup standard */
.warga-login-card,
.alumni-login-card,
.student-login-card,
.system-login-form,
.exam-login,
.admin-login,
.gallery-login-page .box{
  position:fixed!important;
  z-index:8999!important;
  top:50%!important;
  left:50%!important;
  transform:translate(-50%,-50%)!important;
  display:block!important;
  width:min(488px,calc(100vw - 34px))!important;
  margin:0!important;
  padding:34px 32px 32px!important;
  overflow:hidden!important;
  color:var(--kistarp-auth-text)!important;
  background:#fff!important;
  border:1px solid var(--kistarp-auth-border)!important;
  border-top:6px solid var(--kistarp-auth-yellow)!important;
  border-radius:5px!important;
  box-shadow:0 24px 65px rgba(6,29,63,.30)!important;
  box-sizing:border-box!important;
}

/* Sembunyikan logo/eyebrow/copy lama supaya semua popup sama */
.warga-login-card .warga-login-logo,
.warga-login-card .login-eyebrow,
.warga-login-card .login-copy,
.warga-login-card .back-home,
.alumni-login-card>img,
.alumni-login-card .section-label,
.alumni-login-card>div>p:not(.alumni-login-error),
.student-login-stage>.student-login-banner,
.gallery-login-page .box .sub,
.gallery-login-page .box .back{
  display:none!important;
}

.warga-login-card h1,
.alumni-login-card h2,
.student-login-card h1,
.system-login-form h2,
.exam-login h3,
.admin-login h3,
.gallery-login-page .box h1{
  display:block!important;
  margin:0 0 24px!important;
  color:var(--kistarp-auth-text)!important;
  font-family:'Poppins',sans-serif!important;
  font-size:1.42rem!important;
  line-height:1.25!important;
  font-weight:800!important;
  letter-spacing:-.02em!important;
}

.student-login-card h1.visually-hidden{
  position:static!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  margin:0 0 24px!important;
  overflow:visible!important;
  clip:auto!important;
  white-space:normal!important;
}

.warga-login-card label,
.alumni-login-card label,
.student-login-card label,
.system-login-form label,
.exam-login label,
.admin-login label,
.gallery-login-page .box label{
  display:block!important;
  margin:0 0 9px!important;
  color:#4b5970!important;
  font-family:'Poppins',sans-serif!important;
  font-size:.88rem!important;
  font-weight:700!important;
}

.system-login-form input[type=password],
.warga-login-card input[type=password],
.alumni-login-card input[type=password],
.student-login-card input[type=password],
.exam-login input[type=password],
.admin-login input[type=password],
.gallery-login-page .box input[type=password]{
  display:block!important;
  width:100%!important;
  height:60px!important;
  margin:0!important;
  padding:0 16px!important;
  color:#17284a!important;
  background:#fff!important;
  border:2px solid #aeb9c8!important;
  border-radius:4px!important;
  outline:0!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
  font-family:'Poppins',sans-serif!important;
  font-size:1.05rem!important;
  letter-spacing:.18em!important;
}

.system-login-form input[type=password]:focus,
.warga-login-card input[type=password]:focus,
.alumni-login-card input[type=password]:focus,
.student-login-card input[type=password]:focus,
.exam-login input[type=password]:focus,
.admin-login input[type=password]:focus,
.gallery-login-page .box input[type=password]:focus{
  border-color:#2c6ab0!important;
  box-shadow:0 0 0 5px rgba(44,106,176,.16)!important;
}

/* Susunan butang Batal + Masuk */
.auth-login-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  margin-top:14px!important;
}

.auth-login-actions .auth-cancel,
.auth-login-actions button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:58px!important;
  margin:0!important;
  padding:12px 16px!important;
  border-radius:4px!important;
  box-sizing:border-box!important;
  font-family:'Poppins',sans-serif!important;
  font-size:.98rem!important;
  font-weight:800!important;
  line-height:1!important;
  text-decoration:none!important;
  cursor:pointer!important;
}

.auth-login-actions .auth-cancel{
  color:var(--kistarp-auth-text)!important;
  background:#e7edf6!important;
  border:1px solid #e0e7f0!important;
}
.auth-login-actions .auth-cancel:hover{background:#dbe5f1!important}

.auth-login-actions button{
  color:#fff!important;
  background:var(--kistarp-auth-navy)!important;
  border:1px solid var(--kistarp-auth-navy)!important;
}
.auth-login-actions button:hover{background:var(--kistarp-auth-navy-hover)!important}

/* Struktur baris lama dinormalkan */
.alumni-password-row,
.exam-login-row,
.student-password-row{
  display:block!important;
}

.login-error,
.alumni-login-error,
.exam-message.error,
.admin-message.error,
.gallery-login-page .error,
.system-flash.error{
  margin:0 0 16px!important;
  padding:10px 12px!important;
  border:1px solid #f0bcbc!important;
  border-radius:4px!important;
  color:#9c1d22!important;
  background:#fff1f1!important;
  font-size:.82rem!important;
}

@media(max-width:560px){
  .warga-login-card,.alumni-login-card,.student-login-card,.system-login-form,.exam-login,.admin-login,.gallery-login-page .box{
    width:calc(100vw - 26px)!important;
    padding:28px 22px 24px!important;
  }
  .auth-login-actions{grid-template-columns:1fr!important}
  .auth-login-actions .auth-cancel{order:2}
  .auth-login-actions button{order:1}
}