/* SBA USER Auth (Reference Style) - Layout FIX (Theme Proof) */
.sbau-auth-page, .sbau-auth-page *{box-sizing:border-box!important;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif!important}
.sbau-auth-page a{text-decoration:none!important}
.sbau-auth-page{
  width:100%!important;
  padding:40px 16px!important;
  background: radial-gradient(900px 520px at 20% 20%, rgba(22,151,230,.16), transparent 62%),
              radial-gradient(820px 520px at 90% 30%, rgba(99,102,241,.12), transparent 60%),
              linear-gradient(180deg,#f5f7fb,#eef2f7)!important;
  min-height: 72vh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Force our container to ignore theme widths */
.sbau-auth-page .sbau-auth-shell{
  width:100%!important;
  max-width: 1120px!important;
  margin: 0 auto!important;
  display:flex!important;
  flex-direction:row!important;
  gap: 28px!important;
  align-items:center!important;
  justify-content:space-between!important;
}
.sbau-auth-left{
  flex: 0 1 520px!important;
  background: rgba(255,255,255,.78)!important;
  border: 1px solid rgba(15,40,70,.10)!important;
  border-radius: 22px!important;
  padding: 30px 30px 22px!important;
  box-shadow: 0 16px 60px rgba(2,24,48,.10)!important;
  backdrop-filter: blur(10px)!important;
}
.sbau-auth-right{
  flex: 1 1 520px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Title like reference */
.sbau-auth-title2{
  font-size: 44px!important;
  font-weight: 800!important;
  color:#1b2b3a!important;
  margin:0 0 6px!important;
  letter-spacing:.2px!important;
}
.sbau-auth-sub2{
  font-size: 12px!important;
  font-weight: 900!important;
  letter-spacing: 1.1px!important;
  text-transform: uppercase!important;
  color: rgba(27,43,58,.55)!important;
  margin-bottom: 18px!important;
}

/* Tabs */
.sbau-tabbar{
  display:flex!important;
  gap:10px!important;
  margin-bottom: 18px!important;
  flex-wrap:wrap!important;
}
.sbau-tabbtn{
  border:1px solid rgba(15,40,70,.12)!important;
  background: rgba(255,255,255,.9)!important;
  color:#1b2b3a!important;
  font-weight:800!important;
  padding:10px 14px!important;
  border-radius: 14px!important;
  cursor:pointer!important;
}
.sbau-tabbtn.is-active{
  background: linear-gradient(135deg,#1697E6,#0B6FB4 60%,#635bff)!important;
  color:#fff!important;
  border-color: rgba(255,255,255,.28)!important;
  box-shadow: 0 12px 28px rgba(22,151,230,.18)!important;
}

/* Form */
.sbau-form-clean{padding: 0!important;}
.sbau-field{margin:0 0 14px!important;}
.sbau-field label{
  display:block!important;
  font-weight:700!important;
  color: rgba(27,43,58,.75)!important;
  font-size: 13px!important;
  margin:0 0 8px!important;
}
.sbau-input{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  background: rgba(255,255,255,.95)!important;
  border: 1px solid rgba(15,40,70,.12)!important;
  border-radius: 999px!important;
  padding: 12px 14px!important;
  height: 54px!important;
}
.sbau-ico{width:22px!important;height:22px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;color: rgba(27,43,58,.55)!important;}
.sbau-input input{
  border:0!important;
  outline:none!important;
  background: transparent!important;
  width:100%!important;
  height: 100%!important;
  padding:0!important;
  font-size: 15px!important;
}
.sbau-input:focus-within{
  border-color:#1697E6!important;
  box-shadow: 0 0 0 6px rgba(22,151,230,.12)!important;
}
.sbau-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin: 4px 0 18px!important;
}
.sbau-check{font-weight:700!important;color:rgba(27,43,58,.7)!important;font-size:13px!important;display:flex!important;align-items:center!important;gap:8px!important}
.sbau-link{color:#0B6FB4!important;font-weight:800!important}
.sbau-link:hover{text-decoration:underline!important}

/* Button long */
.sbau-auth-btn-wide{
  height: 56px!important;
  border-radius: 999px!important;
  width: 100%!important;
  border:0!important;
  cursor:pointer!important;
  font-weight:900!important;
  color:#fff!important;
  background: linear-gradient(135deg,#1697E6,#0B6FB4 60%,#635bff)!important;
  box-shadow: 0 18px 40px rgba(22,151,230,.20)!important;
}
.sbau-auth-btn-wide:hover{filter:brightness(.98)!important; transform: translateY(-1px)!important}
.sbau-auth-btn-wide:active{transform: translateY(0)!important}

.sbau-msg{margin-top:12px!important;font-size:13px!important;font-weight:800!important}
.sbau-msg.is-ok{color:#0f9d58!important}
.sbau-msg.is-err{color:#d93025!important}

.sbau-auth-foot2{margin-top: 16px!important;font-weight: 700!important;color: rgba(27,43,58,.65)!important;}

/* Illustration */
.sbau-illus-card{width:100%!important;max-width: 520px!important;}
.sbau-illus{width:100%!important;height:auto!important;display:block!important;filter: drop-shadow(0 18px 40px rgba(2,24,48,.12))!important;}

/* Only active panel visible */
.sbau-paneltab{display:none!important}
.sbau-paneltab.is-active{display:block!important}

/* Responsive: stack nicely but keep centered */
@media (max-width: 980px){
  .sbau-auth-page .sbau-auth-shell{
    flex-direction:column!important;
    align-items:center!important;
  }
  .sbau-auth-right{order:2!important; width:100%!important;}
  .sbau-auth-left{order:1!important; width:100%!important; max-width: 560px!important;}
  .sbau-illus-card{max-width: 560px!important;}
  .sbau-auth-title2{font-size:36px!important}
}
@media (max-width: 560px){
  .sbau-auth-left{padding:22px 18px 18px!important;border-radius:18px!important}
  .sbau-auth-title2{font-size:32px!important}
  .sbau-tabbtn{padding:9px 12px!important;border-radius:12px!important}
}

/* Smooth panel animation */
.sbau-paneltab{opacity:0; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease;}
.sbau-paneltab.is-active{opacity:1; transform: translateY(0);}

/* Eye button */
.sbau-input{position:relative!important;}
.sbau-eye{
  border:0!important;
  background:transparent!important;
  cursor:pointer!important;
  font-size:16px!important;
  line-height:1!important;
  padding:6px!important;
  border-radius:10px!important;
  color: rgba(27,43,58,.60)!important;
  position:absolute!important;
  right:10px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.sbau-eye:hover{background: rgba(15,40,70,.06)!important;}
.sbau-input input.sbau-pass{padding-right:40px!important;}

/* Spinner */
.sbau-auth-btn-wide.is-loading{opacity:.86!important; pointer-events:none!important;}
.sbau-auth-btn-wide .sbau-spin{
  width:18px!important;height:18px!important;border-radius:50%!important;
  border:3px solid rgba(255,255,255,.45)!important;
  border-top-color: rgba(255,255,255,.95)!important;
  display:inline-block!important;vertical-align:middle!important;margin-right:10px!important;
  animation: sbauSpin .8s linear infinite!important;
}
@keyframes sbauSpin{to{transform:rotate(360deg);}}

/* Social buttons */
.sbau-social{display:flex!important; flex-direction:column!important; gap:10px!important; margin: 0 0 14px!important;}
.sbau-social-btn{
  display:flex!important; align-items:center!important; justify-content:center!important; gap:10px!important;
  height:52px!important; border-radius:999px!important;
  border:1px solid rgba(15,40,70,.14)!important;
  background: rgba(255,255,255,.92)!important;
  font-weight:900!important; color: rgba(27,43,58,.90)!important;
  box-shadow: 0 10px 26px rgba(2,24,48,.08)!important;
}
.sbau-social-btn:hover{transform: translateY(-1px)!important; box-shadow: 0 14px 30px rgba(2,24,48,.10)!important;}
.sbau-social-ico{width:26px!important;height:26px!important;border-radius:50%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;color:#fff!important;font-weight:900!important;}
.sbau-google .sbau-social-ico{background:#ea4335!important;}
.sbau-facebook .sbau-social-ico{background:#1877f2!important;font-family:Arial,sans-serif!important;}
.sbau-orline{display:flex!important;align-items:center!important;gap:10px!important;margin: 6px 0 18px!important;color: rgba(27,43,58,.55)!important;font-weight:900!important;}
.sbau-orline:before,.sbau-orline:after{content:""!important;flex:1!important;height:1px!important;background: rgba(15,40,70,.12)!important;}
.sbau-orline span{font-size:12px!important;text-transform:uppercase!important;letter-spacing:.8px!important;}