/* =====================================================================
   PSAU Code Campus LMS · Login Banner UX v2.8.2
   ===================================================================== */

.public-shell.premium-public-shell{
  width:100%!important;
  min-height:100svh!important;
  display:grid!important;
  place-items:center!important;
  padding:28px!important;
}

.login-shell-v282{
  position:relative!important;
  width:min(1500px,100%)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.55fr) minmax(370px,.68fr)!important;
  gap:22px!important;
  align-items:center!important;
}

.login-banner-v282{
  position:relative!important;
  min-width:0!important;
  overflow:hidden!important;
  border:1px solid rgba(139,169,204,.14)!important;
  border-radius:24px!important;
  background:#071223!important;
  box-shadow:0 28px 80px rgba(0,0,0,.28)!important;
  isolation:isolate!important;
}

.login-banner-v282::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  border-radius:inherit!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important;
}

.login-banner-v282 picture,
.login-banner-v282 img{
  display:block!important;
  width:100%!important;
}

.login-banner-v282 img{
  height:auto!important;
  aspect-ratio:1716/917!important;
  object-fit:contain!important;
  background:#071223!important;
}

.login-banner-glow-v282{
  position:absolute!important;
  z-index:-1!important;
  width:48%!important;
  aspect-ratio:1!important;
  right:-8%!important;
  bottom:-34%!important;
  border-radius:50%!important;
  background:rgba(76,81,255,.18)!important;
  filter:blur(70px)!important;
}

.login-panel-wrap-v282{
  min-width:0!important;
}

.auth-panel.login-panel-v282{
  position:relative!important;
  width:100%!important;
  max-width:470px!important;
  margin-inline:auto!important;
  padding:28px!important;
  overflow:hidden!important;
  border:1px solid rgba(139,169,204,.17)!important;
  border-radius:22px!important;
  background:linear-gradient(155deg,rgba(17,34,56,.94),rgba(9,24,41,.96))!important;
  box-shadow:0 30px 80px rgba(0,0,0,.30)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}

.auth-panel.login-panel-v282::before{
  content:""!important;
  position:absolute!important;
  width:190px!important;
  height:190px!important;
  right:-90px!important;
  top:-90px!important;
  margin:0!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(72,116,255,.16),transparent 68%)!important;
  pointer-events:none!important;
}

.login-brand-v282{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  padding-bottom:19px!important;
  border-bottom:1px solid rgba(143,172,205,.09)!important;
}

.login-brand-v282 img{
  width:42px!important;
  height:42px!important;
  object-fit:contain!important;
}

.login-brand-v282 b,
.login-brand-v282 small{
  display:block!important;
}

.login-brand-v282 b{
  color:#edf6ff!important;
  font-size:.93rem!important;
  letter-spacing:-.015em!important;
}

.login-brand-v282 small{
  margin-top:2px!important;
  color:#6f849c!important;
  font-size:.66rem!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
}

.login-copy-v282{
  position:relative!important;
  z-index:1!important;
  margin:24px 0 20px!important;
}

.auth-panel.login-panel-v282 .login-copy-v282 .eyebrow{
  display:inline-flex!important;
  color:#62daf0!important;
}

.login-copy-v282 h1{
  margin:6px 0 7px!important;
  color:#f2f7fc!important;
  font-size:clamp(1.65rem,2vw,2.05rem)!important;
  line-height:1.12!important;
  letter-spacing:-.045em!important;
}

.login-copy-v282 p{
  margin:0!important;
  color:#8195aa!important;
  font-size:.78rem!important;
  line-height:1.55!important;
}

.login-form-v282{
  position:relative!important;
  z-index:1!important;
  gap:13px!important;
}

.login-form-v282>label>span{
  display:block!important;
  margin-bottom:6px!important;
  color:#a1b2c5!important;
  font-size:.69rem!important;
  font-weight:760!important;
}

.login-input-v282{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  overflow:hidden!important;
  border:1px solid #2a415a!important;
  border-radius:11px!important;
  background:#0c1d31!important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}

.login-input-v282:focus-within{
  border-color:rgba(76,211,239,.60)!important;
  background:#102239!important;
  box-shadow:0 0 0 3px rgba(76,211,239,.07)!important;
}

.login-input-v282>.ui-icon{
  width:15px!important;
  height:15px!important;
  justify-self:center!important;
  color:#657e98!important;
}

.login-input-v282:focus-within>.ui-icon{
  color:#60d9ef!important;
}

.login-input-v282 input{
  width:100%!important;
  min-height:46px!important;
  margin:0!important;
  padding:0 12px 0 0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#edf6ff!important;
  box-shadow:none!important;
}

.login-input-v282 input::placeholder{
  color:#566d85!important;
}

.login-submit-v282{
  min-height:46px!important;
  margin-top:3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-radius:11px!important;
  font-weight:850!important;
  box-shadow:0 12px 30px rgba(52,105,255,.13)!important;
}

.login-submit-v282 .ui-icon{
  width:14px!important;
  height:14px!important;
}

.login-student-v282{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-top:18px!important;
  padding-top:17px!important;
  border-top:1px solid rgba(143,172,205,.09)!important;
}

.login-student-v282 b,
.login-student-v282 small{
  display:block!important;
}

.login-student-v282 b{
  color:#d9e5f0!important;
  font-size:.73rem!important;
}

.login-student-v282 small{
  max-width:210px!important;
  margin-top:3px!important;
  color:#6c8198!important;
  font-size:.61rem!important;
  line-height:1.4!important;
}

.login-student-v282 .btn{
  flex:0 0 auto!important;
  min-height:37px!important;
  padding:0 11px!important;
  white-space:nowrap!important;
}

.login-trust-v282{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin-top:17px!important;
}

.login-trust-v282 span{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  min-height:28px!important;
  padding:0 8px!important;
  border:1px solid rgba(143,172,205,.08)!important;
  border-radius:999px!important;
  background:rgba(143,172,205,.018)!important;
  color:#71869e!important;
  font-size:.56rem!important;
  font-weight:730!important;
}

.login-trust-v282 .ui-icon{
  width:11px!important;
  height:11px!important;
  color:#5ed9ad!important;
}

@media(max-width:1180px){
  .public-shell.premium-public-shell{padding:22px!important}
  .login-shell-v282{grid-template-columns:minmax(0,1.3fr) minmax(350px,.7fr)!important;gap:18px!important}
  .auth-panel.login-panel-v282{padding:24px!important}
  .login-student-v282{align-items:flex-start!important;flex-direction:column!important}
  .login-student-v282 .btn{width:100%!important;justify-content:center!important}
}

@media(max-width:900px){
  .public-shell.premium-public-shell{display:block!important;padding:18px!important}
  .login-shell-v282{width:min(760px,100%)!important;margin:0 auto!important;grid-template-columns:1fr!important;gap:14px!important}
  .login-banner-v282{order:1!important;border-radius:18px!important}
  .login-panel-wrap-v282{order:2!important}
  .auth-panel.login-panel-v282{max-width:none!important;border-radius:18px!important}
  .login-student-v282{align-items:center!important;flex-direction:row!important}
  .login-student-v282 .btn{width:auto!important}
}

@media(max-width:620px){
  .public-shell.premium-public-shell{padding:10px 10px 18px!important}
  .login-shell-v282{gap:10px!important}
  .login-banner-v282{border-radius:14px!important}
  .auth-panel.login-panel-v282{padding:19px 16px!important;border-radius:16px!important}
  .login-brand-v282{padding-bottom:15px!important}
  .login-brand-v282 img{width:37px!important;height:37px!important}
  .login-copy-v282{margin:18px 0 16px!important}
  .login-copy-v282 h1{font-size:1.55rem!important}
  .login-copy-v282 p{font-size:.72rem!important}
  .login-input-v282{grid-template-columns:36px minmax(0,1fr)!important}
  .login-input-v282 input{min-height:45px!important;font-size:16px!important}
  .login-student-v282{align-items:stretch!important;flex-direction:column!important}
  .login-student-v282 .btn{width:100%!important;justify-content:center!important}
  .login-trust-v282{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .login-trust-v282 span{justify-content:center!important;padding:0 5px!important;text-align:center!important}
}

@media(max-width:420px){
  .login-trust-v282{grid-template-columns:1fr!important}
  .login-trust-v282 span{justify-content:flex-start!important}
}

@media(max-height:720px) and (min-width:901px){
  .public-shell.premium-public-shell{padding-block:16px!important}
  .auth-panel.login-panel-v282{padding:22px!important}
  .login-copy-v282{margin:18px 0 15px!important}
  .login-trust-v282{margin-top:13px!important}
}

@media(prefers-reduced-motion:reduce){
  .login-input-v282{transition:none!important}
}
