/* GKS BGFIX v2 - naya background (black grid + red glow) sab pages par ek jaisa, CSS se bana hai = kisi bhi screen par saaf (blur nahi).
   Photo ke hisaab se: 10 column, ~20 row ki patli safed grid, neeche se laal glow. */
:root{
  --gks-bg:
    linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px) 0 0/80px 80px,
    linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px) 0 0/80px 80px,
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/20px 20px,
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/20px 20px,
    radial-gradient(ellipse 90% 60% at 50% 50%,#1d1d1d 0%,#161616 55%,#0e0e0e 100%),
    #111;
}
html:root:not(#z):not(#y){background:#111!important;background-image:none!important;min-height:100%}
html:root:not(#z):not(#y) body{background:transparent!important;background-image:none!important;min-height:100%}
html:root:not(#z):not(#y)::before{
  content:""!important;position:fixed!important;left:0!important;top:0!important;right:0!important;
  bottom:0!important;width:auto!important;height:auto!important;
  z-index:-1!important;pointer-events:none!important;display:block!important;
  background:var(--gks-bg)!important;
}
html:root:not(#z):not(#y) body::before,html:root:not(#z):not(#y) body::after{background:none!important;display:none!important}
html.gks-custom-bg:root:not(#z):not(#y)::before{display:none!important}
/* containers / login / splash must not paint their own wallpaper */
html:root body #main-app,html:root body .page-content,html:root body #page-home,html:root body #page-dashboard,
html:root body #page-history,html:root body #page-referral,html:root body #page-profile,html:root body #page-add-money,
html:root body #page-support,html:root body #page-api,html:root body #page-pay-qr,html:root body #site-background-video,
html:root body #auth-screen,html:root body .apon-auth-page,html:root body main.wrap,html:root body #wrap,
html:root body #rk-splash,html:root body .splash,html:root body .loader,html:root body #loader{
  background:transparent!important;background-image:none!important;
}
html:root body #site-background-video{display:none!important}

/* ---------- HEADER + MENU BUTTON ---------- */
html:root body #gks-hdr .menuBtn,html:root body #menu-toggle{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:46px!important;height:46px!important;min-width:46px!important;padding:0!important;flex:0 0 46px!important;
  border-radius:14px!important;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
html:root body #menu-toggle .rk-burger{display:flex!important;flex-direction:column;justify-content:center;gap:5px;width:22px;height:18px}
html:root body #menu-toggle .rk-burger i{display:block!important;height:2.5px!important;width:100%!important;border-radius:3px;background:#f3d98b!important}

/* ---------- SIDE MENU (drawer) ---------- */
html:root body #gks-side-drawer#gks-side-drawer{
  position:fixed!important;top:0!important;bottom:0!important;height:100vh!important;height:100dvh!important;
  max-height:100dvh!important;width:min(86vw,330px)!important;overflow-y:auto!important;overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;box-sizing:border-box!important;
  padding-bottom:max(18px,env(safe-area-inset-bottom))!important;
}
html:root body #gks-side-drawer .gks-drawer-item{display:flex!important;align-items:center!important;gap:12px!important;min-height:52px!important;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
html:root body #gks-side-drawer .gks-drawer-item span{flex:1 1 auto;min-width:0;white-space:normal;line-height:1.25}
html:root body #gks-side-drawer .gks-drawer-close{display:grid!important;place-items:center;width:40px!important;height:40px!important;flex:0 0 40px!important;padding:0!important}

/* ---------- CHECKOUT POPUP ---------- */
html:root body #modal-checkout.modal-overlay{align-items:center!important;padding:12px!important;overflow-y:auto!important}
html:root body #modal-checkout .checkout-modal{
  width:min(94vw,400px)!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;box-sizing:border-box!important;margin:auto!important;
}
html:root body #modal-checkout .btn-purchase,html:root body #modal-checkout .checkout-actions .btn-purchase{
  display:flex!important;align-items:center;justify-content:center;width:100%!important;min-height:50px!important;position:relative;z-index:2;
}
/* error / success toast: upar dikhe, CONFIRM PAY button ko na dhake */
html:root body #toast-container{top:max(12px,env(safe-area-inset-top))!important;bottom:auto!important;z-index:2147483000!important}

/* ---------- ALL BUTTONS: touch friendly ---------- */
html body button,html body .btn,html body [role=button]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
html body .btn,html body button.btn{min-height:44px}
html body input,html body select,html body textarea{font-size:16px!important}

/* ---------- LOGIN: logo + naam ek jagah sthir (upar-niche hilna band) ---------- */
html body main.wrap{display:flex!important;flex-direction:column;align-items:center;width:100%;max-width:370px;margin:0 auto!important;padding-top:max(22px,env(safe-area-inset-top))!important}
html body .wrap .logo{
  animation:none!important;transform:none!important;position:relative!important;
  width:104px!important;height:104px!important;margin:34px auto 40px!important;flex:0 0 auto;
}
/* LOGO BOX: sone ka frame ab ghumta hai (logo/photo sthir rehta hai). Pehle yahan animation:none tha, isliye ruka hua tha. */
html body .wrap .logo::before{
  content:""!important;position:absolute!important;inset:-9px!important;border-radius:32px!important;border:0!important;padding:3px!important;
  box-shadow:none!important;pointer-events:none;
  background:conic-gradient(from 0deg,rgba(214,178,92,.12),rgba(214,178,92,.35) 35%,#fff0b8 58%,#e6c66d 68%,rgba(214,178,92,.14) 88%,rgba(214,178,92,.12))!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0)!important;-webkit-mask-composite:xor!important;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)!important;mask-composite:exclude!important;
  transform:none;animation:gksFrameSpin 5s linear infinite!important;will-change:transform}
html body .wrap .logo::after{animation:none!important;inset:-34px!important}
html body .wrap .logo .r2,html body .wrap .logo .shine,html body .wrap .logo .sp{display:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){html body .wrap .logo::before{animation-duration:14s!important}}
html body .wrap .logo img{width:100%!important;height:100%!important;border-radius:24px!important;animation:none!important;transform:none!important}
html body .wrap h1{
  animation:none!important;transform:none!important;margin:0 0 8px!important;width:100%;text-align:center;
  font-size:clamp(21px,6.6vw,27px)!important;line-height:1.15!important;white-space:nowrap;
}
html body .wrap .sub{animation:none!important;transform:none!important;margin:0 0 20px!important;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}
html body .wrap .card{animation:none!important;width:100%!important}
html body .wrap *{animation-iteration-count:1!important}
