/* SB Pay One sign-in / sign-up / forgot-password look (owner, Oct 14 2026).
   Same style as the PIN page: full-screen real photo, purple shade, frosted-glass form.
   Phones: photo fills the screen, the form is a glass card in front of it.
   Computers: photo on the left, the form on a dark-purple panel on the right. */

body.uz-auth{background:#070b1f!important;color:#fff;min-height:100vh;display:block!important;padding:0!important;margin:0!important;max-width:none!important;border:0!important;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
body.uz-auth #theme-fab{display:none!important}

/* photo layer */
.uzp{position:fixed;inset:0;z-index:0;background:#070b1f;pointer-events:none}
.uzp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%;opacity:0;transform:scale(1.04);transition:opacity 1.2s ease,transform 6s ease}
.uzp img.on{opacity:1;transform:scale(1)}
.uzp::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,11,31,.55) 0%,rgba(7,11,31,.06) 20%,rgba(7,11,31,.18) 34%,rgba(14,24,80,.80) 55%,#070b1f 80%)}

/* top bar */
.uz-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:max(18px,env(safe-area-inset-top)) 20px 0}
.uz-top .brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;color:#fff;text-decoration:none;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.uz-top .brand img{width:36px;height:36px;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.uz-top .brand b{color:#8EA2FF}
.uz-top .lock{font-size:12px;font-weight:700;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:6px 11px;border-radius:999px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* shells (login/signup use .auth-shell/.auth-body, forgot-password uses .auth-wrap/.auth-card) */
body.uz-auth .auth-shell,body.uz-auth .auth-wrap{position:relative;z-index:1;background:none!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;
  width:100%!important;max-width:none!important;min-height:0!important;display:block!important;padding:0 16px max(26px,env(safe-area-inset-bottom))!important;margin:0!important}
body.uz-auth .auth-body,body.uz-auth .auth-wrap .auth-card{position:relative;max-width:440px;width:100%;margin:30vh auto 0!important;padding:24px 20px 22px!important;
  background:rgba(10,16,48,.58)!important;-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.13)!important;border-radius:26px!important;box-shadow:0 24px 60px rgba(0,0,0,.42)!important;color:#fff;flex:none!important}
body.uz-auth .auth-body-handle{display:none!important}

/* headings */
body.uz-auth .auth-title,body.uz-auth .auth-logo h1{color:#fff!important;font-size:26px!important;font-weight:800!important;letter-spacing:-.02em;margin:0 0 4px!important}
body.uz-auth .auth-sub,body.uz-auth .auth-logo p{color:rgba(255,255,255,.72)!important;font-size:14px!important;margin:0!important}
body.uz-auth .auth-head{margin-bottom:20px!important}
body.uz-auth .auth-wrap .auth-logo{display:block!important;text-align:left!important;margin:0 0 20px!important}
body.uz-auth .auth-wrap .auth-logo>div:first-child{display:none!important}

/* fields */
body.uz-auth .flabel,body.uz-auth .form-group label{color:rgba(255,255,255,.78)!important;font-size:11.5px!important;font-weight:700!important;letter-spacing:.04em;text-transform:uppercase;margin-bottom:7px!important;display:block}
body.uz-auth .finput,body.uz-auth .form-control{width:100%;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;color:#fff!important;
  border-radius:14px!important;padding:14px 16px!important;font-size:15px!important;box-shadow:none!important;outline:none;transition:border-color .15s,background .15s}
body.uz-auth .finput::placeholder,body.uz-auth .form-control::placeholder{color:rgba(255,255,255,.42)!important}
body.uz-auth .finput:focus,body.uz-auth .form-control:focus{border-color:#8EA2FF!important;background:rgba(255,255,255,.12)!important;box-shadow:0 0 0 4px rgba(142,162,255,.16)!important}
body.uz-auth input:-webkit-autofill{-webkit-text-fill-color:#fff!important;-webkit-box-shadow:0 0 0 1000px #18245c inset!important;caret-color:#fff}
body.uz-auth .eye-btn{color:rgba(255,255,255,.7)!important}
body.uz-auth .fgroup,body.uz-auth .form-group{margin-bottom:15px!important}
body.uz-auth .opt{color:rgba(255,255,255,.5)!important}
body.uz-auth .pw-bar{background:rgba(255,255,255,.16)!important}
body.uz-auth .pw-strength{color:rgba(255,255,255,.65)!important}

/* links & buttons */
body.uz-auth .forgot-link a,body.uz-auth .auth-footer-link a,body.uz-auth .terms-note a,body.uz-auth .auth-wrap a{color:#B3C0FF!important}
body.uz-auth .auth-footer-link,body.uz-auth .terms-note{color:rgba(255,255,255,.7)!important}
body.uz-auth .btn-signin,body.uz-auth .btn-signup,body.uz-auth .btn-primary{display:block;width:100%;height:54px;padding:0 16px!important;border:0!important;border-radius:16px!important;color:#fff!important;
  background:linear-gradient(135deg,#5C7CFF,#3D5AFE)!important;font-size:16px!important;font-weight:800!important;box-shadow:0 12px 30px rgba(61,90,254,.45)!important;cursor:pointer;text-align:center;line-height:54px}
body.uz-auth .btn-signin:active,body.uz-auth .btn-signup:active,body.uz-auth .btn-primary:active{transform:scale(.98)}

/* alerts & trust row */
body.uz-auth .auth-alert,body.uz-auth .alert-error{background:rgba(239,68,68,.16)!important;border:1px solid rgba(239,68,68,.45)!important;color:#fecaca!important;border-radius:12px!important}
body.uz-auth .alert-success{background:rgba(16,185,129,.16)!important;border:1px solid rgba(16,185,129,.45)!important;color:#a7f3d0!important;border-radius:12px!important}
body.uz-auth .trust-row{border-top:1px solid rgba(255,255,255,.12)!important;margin-top:20px!important;padding-top:16px!important}
body.uz-auth .trust-item{color:rgba(255,255,255,.62)!important}
body.uz-auth .auth-wrap h2{color:#fff!important}
body.uz-auth .auth-wrap p[style*="6b7280"]{color:rgba(255,255,255,.7)!important}

@media(max-height:700px){body.uz-auth .auth-body,body.uz-auth .auth-wrap .auth-card{margin-top:22vh!important}}

/* computers: photo left, form right */
@media(min-width:900px) and (min-aspect-ratio:1/1){
  body.uz-auth{background:radial-gradient(1200px 700px at 85% 10%,#1b2a78 0%,#070b1f 60%) fixed!important}
  .uzp{right:auto;width:46vw}
  .uzp::after{background:linear-gradient(90deg,rgba(7,11,31,0) 60%,#070b1f 100%),linear-gradient(180deg,rgba(7,11,31,.45) 0%,rgba(7,11,31,0) 25%)}
  .uz-top{position:fixed;top:0;left:0;width:46vw;padding:30px 34px}
  .uz-top .lock{display:none}
  body.uz-auth .auth-shell,body.uz-auth .auth-wrap{margin-left:46vw!important;width:auto!important;min-height:100vh!important;display:flex!important;align-items:center;justify-content:center;padding:40px 5vw!important}
  body.uz-auth .auth-body,body.uz-auth .auth-wrap .auth-card{margin:0!important;max-width:420px;background:rgba(255,255,255,.04)!important;box-shadow:0 30px 80px rgba(0,0,0,.35)!important}
  body.uz-auth .auth-title,body.uz-auth .auth-logo h1{font-size:30px!important}
}

/* SB Pay One pages still carry the old banner block: hide it */
body.uz-auth .auth-hero{display:none!important}

/* service caption that changes with the photo */
.uzc{position:fixed;z-index:2;left:16px;right:16px;top:calc(max(18px,env(safe-area-inset-top)) + 58px);pointer-events:none}
.uzc-i{position:absolute;left:0;top:0;display:flex;align-items:center;gap:11px;max-width:330px;padding:10px 14px 10px 10px;border-radius:16px;
  background:rgba(8,14,40,.55);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;
  opacity:0;transform:translateY(8px);transition:opacity .6s ease,transform .6s ease;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.uzc-i.on{opacity:1;transform:none}
.uzc-ic{flex:0 0 36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#5C7CFF,#3D5AFE);display:flex;align-items:center;justify-content:center}
.uzc-ic svg{width:19px;height:19px}
.uzc-i b{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.01em}
.uzc-i small{display:block;font-size:12px;color:rgba(255,255,255,.78);margin-top:2px;line-height:1.35}
.uzc-dots{position:absolute;left:4px;top:76px;display:flex;gap:6px}
.uzc-dots i{width:6px;height:6px;border-radius:6px;background:rgba(255,255,255,.45);transition:all .3s}
.uzc-dots i.on{width:18px;background:#8EA2FF}
@media(min-width:900px) and (min-aspect-ratio:1/1){
  .uzc{top:auto;bottom:44px;left:34px;right:auto;width:calc(46vw - 68px);height:96px}
  .uzc-i{top:auto;bottom:18px;max-width:420px;padding:14px 18px 14px 14px}
  .uzc-ic{flex-basis:44px;height:44px}.uzc-i b{font-size:17px}.uzc-i small{font-size:13.5px}
  .uzc-dots{top:auto;bottom:0}
}