/* PKDWM - tema futuristik cerah (hijau): lapisan kaca putih, grid halus, aksen zamrud-teal-lime */
:root{--bg:#ecf9f1;--panel:rgba(255,255,255,.82);--field:#fff;--line:rgba(11,143,92,.22);--ink:#0b2a1f;--mute:#4f6b5d;--blue:#0b8f5c;--cyan:#00b39f;--violet:#6fcf2f;--link:#0a7a4c}
html,body{min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:'Manrope',sans-serif;
 background-image:radial-gradient(60rem 30rem at 85% -10%,rgba(111,207,47,.16),transparent 60%),radial-gradient(50rem 30rem at -10% 110%,rgba(0,179,159,.18),transparent 60%),linear-gradient(rgba(11,143,92,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(11,143,92,.07) 1px,transparent 1px);
 background-size:auto,auto,44px 44px,44px 44px;background-attachment:fixed}
h1,h2,h3,.brand{font-family:'Chakra Petch',sans-serif;letter-spacing:.02em}
a{color:var(--link);text-decoration:none}a:hover{color:#064d32}
.brand{font-weight:600;font-size:1.15rem;color:var(--ink);display:inline-flex;align-items:center;gap:.6rem}
.brand i{width:14px;height:14px;background:linear-gradient(135deg,var(--cyan),var(--violet));clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);display:inline-block}
.stage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1rem}
/* panel bersudut potong - elemen utama reka bentuk */
.panel{position:relative;background:var(--panel);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
 padding:2.25rem;border:1px solid var(--line);
 clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.panel::before{content:"";position:absolute;top:0;left:0;width:46%;height:3px;background:linear-gradient(90deg,var(--cyan),var(--violet),transparent)}
.panel-sm{width:100%;max-width:420px}.panel-md{width:100%;max-width:560px}.panel-lg{width:100%;max-width:1040px}
.panel h1{font-size:1.75rem;font-weight:600;margin:.9rem 0 .25rem}
.panel .sub{color:var(--mute);margin-bottom:1.6rem}
.form-label{color:var(--mute);font-size:.85rem;margin-bottom:.35rem}
.form-control,.form-select{background-color:var(--field);border:1px solid var(--line);border-radius:0;color:var(--ink);padding:.7rem .9rem}
.form-control::placeholder{color:#8fa89b}
.form-control:focus,.form-select:focus{background-color:#fff;color:var(--ink);border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,143,92,.16)}
.form-control[readonly]{background-color:#f1faf5}
.form-select option{background:#fff;color:var(--ink)}
.form-check-input{background-color:#fff;border-color:rgba(11,143,92,.4);border-radius:0}
.form-check-input:checked{background-color:var(--blue);border-color:var(--blue)}
.btn-neon{background:linear-gradient(90deg,#0a8a55,#0d9f73);border:0;border-radius:0;color:#fff;font-family:'Chakra Petch',sans-serif;font-weight:600;padding:.8rem 1.2rem;
 clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));transition:filter .2s}
.btn-neon:hover{color:#fff;filter:brightness(1.1) saturate(1.1)}
.btn-neon:focus-visible,a:focus-visible,.pautan:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.foot-note{text-align:center;color:var(--mute);margin:1.4rem 0 0;font-size:.92rem}
/* jadual */
.tbl{--bs-table-bg:transparent;--bs-table-color:var(--ink);--bs-table-hover-bg:rgba(11,143,92,.07);--bs-table-hover-color:var(--ink);margin:0}
.tbl th{color:var(--mute);font-weight:600;font-size:.85rem;border-bottom:1px solid var(--line);padding:.85rem .75rem}
.tbl td{border-color:rgba(11,143,92,.12);padding:.8rem .75rem;vertical-align:middle}
.avatar{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;font-family:'Chakra Petch',sans-serif;font-weight:600;color:var(--ink);
 background:linear-gradient(135deg,rgba(0,179,159,.22),rgba(111,207,47,.26));border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px))}
.tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:600;padding:.2rem .6rem;border:1px solid currentColor;background:rgba(255,255,255,.7)}
.tag::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor}
.tag.aktif{color:#0b8f63}.tag.tunggu{color:#a86400}.tag.tamat{color:#cf2f55}
.page-link{background:#fff;border:1px solid var(--line);color:var(--link);border-radius:0;margin-left:-1px}
.page-link:hover{background:rgba(11,143,92,.1);color:var(--blue)}
.page-item.active .page-link{background:var(--blue);border-color:var(--blue);color:#fff}
.page-item.disabled .page-link{background:#f1faf5;color:#9fb5a9}
@media (max-width:575px){.panel{padding:1.5rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* kelayakan cuti */
.info-strip{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:1.6rem}
.info-strip>div{flex:1 1 150px;background:rgba(255,255,255,.9);padding:.7rem 1rem}
.info-strip small{display:block;color:var(--mute);font-size:.8rem}
.info-strip strong{font-family:'Chakra Petch',sans-serif;font-weight:500}
.tbl input.hari{width:84px;text-align:center;padding:.45rem .4rem}
.tbl .jumlah{font-family:'Chakra Petch',sans-serif;font-size:1.1rem;color:var(--blue)}
.tbl .tempoh,.tempoh{color:var(--mute);font-size:.85rem}
.btn-ghost{background:#fff;border:1px solid var(--line);border-radius:0;color:var(--ink);padding:.8rem 1.2rem}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue);background:rgba(11,143,92,.06)}
/* laporan */
.bar{height:6px;background:rgba(11,143,92,.14);min-width:90px}
.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--violet))}
.tbl tfoot td{border-top:1px solid var(--line);font-family:'Chakra Petch',sans-serif;color:var(--blue)}
/* navigasi, notis, butang pautan */
.topnav{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.7rem 1.25rem;background:rgba(255,255,255,.86);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.topnav .links{display:flex;flex-wrap:wrap;gap:1.25rem}
.topnav .links a{font-weight:600}
.topnav .user{color:var(--mute);font-size:.9rem}
body.ada-nav .stage{min-height:calc(100vh - 54px)}
.notis{padding:.75rem 1rem;border:1px solid var(--line);margin-bottom:1rem;background:rgba(255,255,255,.95);font-size:.92rem}
.notis.sukses{color:#0b7a55;border-color:rgba(11,143,99,.5);background:#effbf6}
.notis.ralat{color:#b8264a;border-color:rgba(207,47,85,.5);background:#fff1f4}
.notis ul{margin:0;padding-left:1.1rem}
.toast-wrap{position:fixed;top:64px;left:50%;transform:translateX(-50%);z-index:30;width:min(92vw,520px)}
.toast-wrap .notis{animation:pudar .4s ease 6s forwards;box-shadow:0 6px 24px rgba(11,143,92,.15)}
@keyframes pudar{to{opacity:0;visibility:hidden}}
.pautan{background:none;border:0;padding:0;color:var(--link);font:inherit;cursor:pointer}
.pautan:hover{color:#064d32}
@media print{body{background:#fff!important;color:#000}.panel{clip-path:none;border:0;background:#fff;backdrop-filter:none}.panel::before{display:none}.no-print{display:none!important}.tbl{--bs-table-color:#000}.tbl th,.tbl td{color:#000!important}.panel h1,.brand{color:#000}}
/* halaman log masuk: banner PKM ADUN */
.panel-xl{width:100%;max-width:980px}
.login-grid .banner{display:flex;flex-direction:column;justify-content:center;gap:1.4rem;padding-right:2.25rem}
.login-grid .login-borang{padding-left:2.25rem;border-left:1px solid var(--line)}
.banner-kepala{display:flex;align-items:center;gap:1.1rem}
.jata{flex:0 0 auto;width:92px;height:92px;display:flex;align-items:center;justify-content:center}
.jata img{max-width:100%;max-height:100%;object-fit:contain}
.slot-kosong{width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.75rem;line-height:1.3;color:var(--mute);border:1px dashed var(--line);background:rgba(11,143,92,.05)}
.banner-tajuk{font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.08em;color:var(--mute)}
.banner-adun{font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:1.85rem;line-height:1.1;background:linear-gradient(90deg,#0a8a55,#00a08f);-webkit-background-clip:text;background-clip:text;color:transparent}
.khat{font-family:'Aref Ruqaa','Noto Naskh Arabic',serif;font-weight:700;font-size:2.2rem;line-height:1.7;color:var(--blue);text-align:center;padding:.4rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.adun{display:flex;align-items:center;gap:1.1rem;margin:0}
.foto-bingkai{flex:0 0 auto;width:132px;height:160px;padding:2px;background:linear-gradient(135deg,var(--cyan),var(--violet));
 clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}
.foto-bingkai img,.foto-bingkai .slot-kosong{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;background:#fff;
 clip-path:polygon(0 0,calc(100% - 17px) 0,100% 17px,100% 100%,17px 100%,0 calc(100% - 17px))}
.adun figcaption strong{display:block;font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:1.1rem;line-height:1.25}
.adun figcaption span{display:block;color:var(--mute);font-size:.9rem;margin-top:.3rem}
@media (max-width:991px){
  .login-grid .banner{padding-right:0;padding-bottom:1.4rem;border-bottom:1px solid var(--line)}
  .login-grid .login-borang{padding-left:0;border-left:0}
}
@media (max-width:480px){.banner-adun{font-size:1.4rem}.khat{font-size:1.7rem}.jata{width:68px;height:68px}.foto-bingkai{width:104px;height:128px}}
/* nama sistem pada halaman log masuk */
.nama-sistem{font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:1.35rem;line-height:1.25;margin-top:.9rem;color:var(--blue)}
.nama-sistem + h1{margin-top:.5rem!important;font-size:1.1rem!important;font-weight:500!important;color:var(--mute)}
