/* Zavinix - Popup Login / Daftar (dipakai semua halaman) */
.za-o{position:fixed;inset:0;z-index:2147482000;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(3,4,8,.72);-webkit-overflow-scrolling:touch;overflow-y:auto}
.za-o.za-show{display:flex;animation:zaFade .2s ease}
@keyframes zaFade{from{opacity:0}to{opacity:1}}
@keyframes zaPop{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.za-box{position:relative;width:100%;max-width:400px;margin:auto;padding:30px 24px 24px;border-radius:20px;color:#f4f4f6;
background:linear-gradient(160deg,#0f1118 0%,#0a0c12 100%);border:1px solid rgba(245,192,101,.28);
box-shadow:0 20px 60px rgba(0,0,0,.6);font-family:'Plus Jakarta Sans','Inter','Segoe UI',Roboto,sans-serif;animation:zaPop .25s ease}
.za-box{text-align:left}
.za-box *{box-sizing:border-box;font-family:inherit;-webkit-tap-highlight-color:transparent}
.za-x{position:absolute;top:10px;right:10px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.06);color:rgba(255,255,255,.7);font-size:20px;line-height:1;cursor:pointer}
.za-x:hover{background:rgba(255,255,255,.12);color:#fff}
.za-logo{display:flex;align-items:center;justify-content:center;gap:12px}
.za-logo-img{height:48px;width:auto;object-fit:contain;pointer-events:none;user-select:none}
/* teks ZAVINIX: gradien emas-ungu + kilau menyapu, sama seperti navigasi atas */
.za-logo-text{font-size:1.5rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;display:inline-block;
background-image:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%),linear-gradient(135deg,#FFE8A3 0%,#F5C065 25%,#E0A93B 45%,#9D5BD2 75%,#6B21A8 100%);
background-size:200% 100%,100% 100%;background-position:250% 0,0 0;background-repeat:no-repeat;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
animation:zaShine 6s infinite linear;filter:drop-shadow(0 4px 18px rgba(224,169,59,.2))}
@keyframes zaShine{0%{background-position:250% 0,0 0}100%{background-position:-150% 0,0 0}}
.za-sub{text-align:center;color:rgba(255,255,255,.55);font-size:13px;margin:4px 0 20px}
.za-tabs{display:flex;background:rgba(255,255,255,.05);border-radius:12px;padding:4px;margin-bottom:18px}
.za-tab{flex:1;border:0;background:transparent;color:rgba(255,255,255,.55);font-size:14px;font-weight:700;padding:9px 0;border-radius:9px;cursor:pointer}
.za-tab.za-on{background:linear-gradient(135deg,#F5C065,#d9a441);color:#1a1204}
.za-err{display:none;margin-bottom:12px;padding:9px 12px;border-radius:10px;font-size:13px;color:#ffb4b4;background:rgba(255,80,80,.1);border:1px solid rgba(255,80,80,.25)}
.za-form{display:none}.za-form.za-on{display:block}
.za-g{margin-bottom:13px}
.za-g label{display:block;font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:5px}
.za-g label small{color:rgba(255,255,255,.38);font-weight:400}
.za-g input{width:100%;padding:12px 14px;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;font-size:14.5px;outline:none}
.za-g input:focus{border-color:rgba(245,192,101,.6)}
.za-g input::placeholder{color:rgba(255,255,255,.3)}
.za-pw{position:relative}.za-pw input{padding-right:44px}
.za-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;background:transparent;color:rgba(255,255,255,.5);cursor:pointer;display:flex;align-items:center;justify-content:center}
.za-eye:hover{color:#F5C065}.za-eye svg{width:19px;height:19px}
.za-ts{display:flex;justify-content:center;min-height:65px;margin:4px 0 8px}
.za-btn{width:100%;padding:13px 0;border:0;border-radius:12px;background:linear-gradient(135deg,#F5C065,#d9a441);color:#1a1204;font-size:15px;font-weight:800;cursor:pointer}
.za-btn:disabled{opacity:.6;cursor:default}
.za-or{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:rgba(255,255,255,.35);font-size:12px}
.za-or:before,.za-or:after{content:'';flex:1;height:1px;background:rgba(255,255,255,.12)}
.za-gs{display:flex;justify-content:center;min-height:42px}
body.za-lock{overflow:hidden!important}

/* ===== Perbaikan garis luar menu hamburger yang glitch (semua halaman) =====
   Border gradien beranimasi + backdrop-filter bikin garis kedip/patah di HP.
   Diganti border emas statis yang bersih dan lebih ringan. */
.mobile-menu-drawer,.drawer{
  animation:none !important;
  border:1.5px solid rgba(245,192,101,.55) !important;
  background:linear-gradient(135deg,rgba(8,16,38,.99) 0%,rgba(15,32,67,.99) 100%) !important;
  background-size:auto !important;background-clip:border-box !important;background-origin:padding-box !important;
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  backface-visibility:visible !important;-webkit-backface-visibility:visible !important;
  overscroll-behavior:contain;
}
/* di layar sentuh, efek hover jangan "nyangkut" di item yang terakhir diketuk */
@media (hover:none){
  .mobile-menu-drawer ul li a:hover{padding-left:16px !important;background:rgba(255,255,255,.03) !important;border-color:rgba(245,192,101,.18) !important;color:#e2e8f0 !important}
}