/* HTC_LOGIN_ACTIVE_WEB_DEFAULT_DESIGN_APPLY_PRESERVE_20260628_20260628_062602 */
/* HTC_LOGIN_ACTIVE_WEB_DEFAULT_DESIGN_APPLY_PRESERVE_20260628_20260628_062602 */
:root {
  --htc-login-navy:#2A3290;
  --htc-login-navy-deep:#1B2066;
  --htc-login-navy-tint:rgba(42,50,144,0.08);
  --htc-login-gold:#F2A93B;
  --htc-login-ink:#161B33;
  --htc-login-muted:#6E7390;
  --htc-login-bg:#EEF0F7;
  --htc-login-border:#E2E5F0;
}

body {
  background:var(--htc-login-bg) !important;
}

.login-container {
  min-height:calc(100vh - 170px);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  margin:0 !important;
  padding:38px 14px;
}

.login-container:after {
  content:"";
  position:fixed;
  right:-320px;
  bottom:-360px;
  width:1100px;
  height:1100px;
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(circle, transparent 0 35%, rgba(42,50,144,.045) 35.2% 35.5%, transparent 35.8% 43%),
    radial-gradient(circle, transparent 0 43%, rgba(42,50,144,.04) 43.2% 43.5%, transparent 43.8% 51%),
    radial-gradient(circle, transparent 0 51%, rgba(242,169,59,.05) 51.2% 51.5%, transparent 51.8%);
  z-index:0;
}

#cover-login {
  display:none !important;
}

#user-login {
  flex:0 0 auto !important;
  max-width:560px !important;
  width:100% !important;
  padding:0 !important;
  z-index:1;
}

.htc-login-redesign-card {
  border:2.5px solid var(--htc-login-navy);
  border-radius:30px;
  padding:6px;
  background:var(--htc-login-navy-tint);
  box-shadow:none !important;
}

.htc-login-real-inner {
  border:1.5px solid var(--htc-login-gold);
  border-radius:25px;
  background:#fff;
  overflow:hidden;
  box-shadow:0 24px 60px -30px rgba(20,26,80,0.30);
  padding:34px 48px 30px;
}

.htc-login-logo-row {
  display:flex;
  justify-content:center;
  align-items:center;
  margin-bottom:18px;
  overflow:hidden;
}

.htc-login-logo-row img {
  width:300px !important;
  max-width:84% !important;
  height:auto !important;
  max-height:130px !important;
  object-fit:contain !important;
  display:inline-block !important;
}

.htc-login-redesign-card .nav#myTab3 {
  position:relative;
  display:grid !important;
  grid-template-columns:repeat(3,1fr);
  border-bottom:1px solid var(--htc-login-border);
  margin:0 0 18px !important;
  padding:0 !important;
}

.htc-login-redesign-card ul#myTab3 li {
  width:auto !important;
  text-align:center;
  margin:0 !important;
}

.htc-login-redesign-card #myTab3 .nav-link {
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  min-height:64px;
  padding:4px 4px 10px !important;
  color:var(--htc-login-muted) !important;
  font-weight:600;
  font-size:11px;
  letter-spacing:1px;
  display:flex;
  flex-direction:column-reverse;
  align-items:center;
  justify-content:center;
  gap:6px;
  box-shadow:none !important;
}

.htc-login-redesign-card #myTab3 .nav-link i {
  width:30px;
  height:30px;
  border-radius:50%;
  border:1.5px solid var(--htc-login-border);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--htc-login-muted);
  font-size:14px;
  margin:0 !important;
}

.htc-login-redesign-card #myTab3 .nav-link.active {
  color:var(--htc-login-navy) !important;
}

.htc-login-redesign-card #myTab3 .nav-link.active i {
  background:var(--htc-login-navy);
  border-color:var(--htc-login-navy);
  color:#fff;
}

.htc-login-redesign-card #myTab3 .nav-link.active:after {
  content:"";
  position:absolute;
  bottom:-1px;
  height:2px;
  width:33.333%;
  background:var(--htc-login-navy);
  left:0;
  border-radius:2px;
}

.htc-login-redesign-card #instructor-tab.active:after { left:33.333%; }
.htc-login-redesign-card #staff-tab.active:after { left:66.666%; }

.htc-login-redesign-card .tab-pane {
  margin:0 !important;
  text-align:center;
}

.htc-login-redesign-card .tab-pane h1 {
  text-align:center;
  font-family:Oswald,Arial,sans-serif;
  font-weight:600 !important;
  font-size:20px !important;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin:0 0 4px !important;
  color:var(--htc-login-ink);
}

.htc-login-redesign-card .tab-pane.active h1:before,
.htc-login-redesign-card .tab-pane.active h1:after {
  content:"✦";
  color:var(--htc-login-gold);
  font-size:12px;
  vertical-align:3px;
  margin:0 7px;
}

.htc-login-redesign-card .wizard-custom-radio {
  display:flex !important;
  justify-content:center;
  gap:28px;
  margin:10px 0 18px !important;
  background:transparent !important;
  border:0 !important;
}

.htc-login-redesign-card .wizard-custom-radio-item {
  flex:0 0 auto !important;
}

.htc-login-redesign-card .wizard-custom-radio-item input {
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.htc-login-redesign-card .wizard-custom-radio-item label {
  background:transparent !important;
  border:0 !important;
  cursor:pointer;
  font-family:Oswald,Arial,sans-serif !important;
  font-weight:500 !important;
  font-size:12px !important;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--htc-login-muted) !important;
  padding:0 0 7px !important;
  border-bottom:2px solid transparent !important;
  border-radius:0 !important;
  margin:0 !important;
}

.htc-login-redesign-card .wizard-custom-radio-item input:checked + label {
  color:var(--htc-login-navy) !important;
  border-bottom-color:var(--htc-login-navy) !important;
}

.htc-login-redesign-card .wizard-custom-radio-item label i {
  display:none !important;
}

.htc-login-redesign-card .form-group,
.htc-login-redesign-card .js-mobile-fields {
  margin-bottom:12px !important;
}

.htc-login-redesign-card label.input-label {
  font-size:13px !important;
  font-weight:600 !important;
  color:var(--htc-login-ink) !important;
  margin-bottom:7px !important;
}

.htc-login-redesign-card input.form-control,
.htc-login-redesign-card select.form-control {
  height:46px !important;
  border:1.5px solid var(--htc-login-border) !important;
  border-radius:12px !important;
  font-size:14.5px !important;
  background:#FBFCFE !important;
  box-shadow:none !important;
}

.htc-login-redesign-card input.form-control:focus,
.htc-login-redesign-card select.form-control:focus {
  border-color:var(--htc-login-navy) !important;
  background:#fff !important;
  box-shadow:0 0 0 4px var(--htc-login-navy-tint) !important;
}

.htc-login-redesign-card form > button[type="submit"] {
  height:48px !important;
  margin-top:6px !important;
  border:0 !important;
  border-radius:12px !important;
  font-family:Oswald,Arial,sans-serif !important;
  font-weight:600 !important;
  font-size:14px !important;
  letter-spacing:1.5px;
  text-transform:uppercase;
  background:linear-gradient(180deg,var(--htc-login-navy) 0%,var(--htc-login-navy-deep) 100%) !important;
  color:#fff !important;
  box-shadow:0 14px 26px -12px rgba(27,32,102,0.55) !important;
}

#face-login-wrapper {
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px !important;
}

#face-login-btn,
#htc-login-fingerprint-btn {
  width:100% !important;
  height:42px !important;
  min-height:42px !important;
  margin:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--htc-login-navy) !important;
  border:1.5px solid var(--htc-login-border) !important;
  font-family:Oswald,Arial,sans-serif !important;
  font-weight:600 !important;
  font-size:11.5px !important;
  letter-spacing:1.5px;
  text-transform:uppercase;
  box-shadow:none !important;
}

#htc-fingerprint-login-status {
  grid-column:1 / -1;
  margin-top:0 !important;
}

.htc-login-redesign-card .badge-circle-gray300 {
  width:auto !important;
  height:auto !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--htc-login-muted) !important;
  font-family:Oswald,Arial,sans-serif;
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.htc-login-redesign-card .social-login {
  height:46px !important;
  background:#fff !important;
  color:var(--htc-login-ink) !important;
  border:1.5px solid var(--htc-login-border) !important;
  border-radius:12px !important;
  font-weight:600 !important;
  font-size:14px !important;
  padding:0 16px !important;
  margin-top:14px !important;
}

.htc-login-redesign-card .social-login img {
  width:18px !important;
  height:18px !important;
  margin-right:10px !important;
}

.htc-login-redesign-card .mt-30.text-center {
  margin-top:16px !important;
  font-size:13px;
}

.htc-login-redesign-card .mt-30.text-center a {
  color:var(--htc-login-navy) !important;
  font-weight:600 !important;
  text-decoration:none !important;
}

.htc-login-redesign-card a[href="/registration"] {
  margin-top:10px !important;
  border-radius:12px !important;
  font-size:13px !important;
  padding:10px !important;
  background:#FAFBFD !important;
  border:1px solid var(--htc-login-border);
  color:var(--htc-login-muted) !important;
}

@media(max-width:480px) {
  .login-container { padding:24px 12px; }
  .htc-login-real-inner { padding:30px 24px 26px; }
  .htc-login-logo-row img { width:280px !important; max-width:90% !important; }
  #face-login-wrapper { grid-template-columns:1fr; }
}