/* BLAZOR HUB LOGIN — REFERENCE V2 (presentation only)
   Preserves form fields, names, IDs, validation and all auth flows. */
:root {
  --page: #181818;
  --page-2: #202020;
  --card: #1c1c1d;
  --input: #222223;
  --text: #f4f3ef;
  --muted: #a5a4a2;
  --line: #3c3c3e;
  --primary: #ffb300;
  --primary-2: #ffbd29;
  --danger: #ff777a;
  --success: #5bda98;
  --warning: #ffc96a;
}
html { color-scheme: dark; }
html,body { background-color: #191919; }
body {
  color: var(--text);
  background:
    radial-gradient(ellipse 39% 50% at 0% 10%,rgba(247,154,0,.22),transparent 76%),
    radial-gradient(ellipse 29% 40% at 100% 98%,rgba(247,154,0,.09),transparent 85%),
    radial-gradient(ellipse 35% 32% at 50% 65%,rgba(255,179,0,.055),transparent 90%),
    #191919 !important;
  background-attachment: fixed !important;
}
body::before,
body::after {
  content: "";
  position: fixed;
  pointer-events: none;
  left: 50%;
  top: 51%;
  transform: translate(-50%,-50%);
  border: 1px solid rgba(255,179,0,.075);
  border-radius: 50%;
  width: min(65vw,575px);
  height: min(65vw,575px);
  z-index: 0;
}
body::after {
  width: min(48vw,420px);
  height: min(48vw,420px);
  border-color: rgba(255,179,0,.11);
}
.login-shell {
  position: relative;
  z-index: 1;
  max-width: 395px !important;
}
.login-card {
  width: 100%;
  background: rgba(27,27,28,.98) !important;
  border: 1px solid #383838 !important;
  border-radius: 17px !important;
  box-shadow: 0 24px 90px rgba(0,0,0,.26),0 0 0 1px rgba(255,255,255,.018) !important;
}
.login-main { padding: 30px 29px 25px !important; }
.brand { margin-bottom: 26px !important; }
.brand-logo {
  max-width: 153px !important;
  max-height: 60px !important;
  margin-bottom: 10px !important;
}
.brand-fallback {
  background: #ffb300 !important;
  color: #221800 !important;
}
.brand-name {
  color: #f4f2ed !important;
  font-size: 1.23rem !important;
  letter-spacing: -.025em;
  font-weight: 800 !important;
}
.brand-subtitle {
  color: #a6a4a0 !important;
  font-size: .79rem !important;
  font-weight: 450 !important;
}
.field { margin-bottom: 15px; }
.field-label {
  color: #aaa8a5 !important;
  font-size: .68rem !important;
  letter-spacing: .075em !important;
  font-weight: 760 !important;
}
.input-icon { color: #ffb300 !important; }
.input-wrap input {
  background: #232324 !important;
  border: 1px solid #3b3b3e !important;
  border-radius: 9px !important;
  color: #f5f4f1 !important;
  min-height: 48px !important;
  box-shadow: none !important;
  font-weight: 500;
}
.input-wrap input::placeholder {
  color: #858585 !important;
  opacity: 1;
}
.input-wrap input:focus {
  background: #262626 !important;
  border-color: #ffb300 !important;
  outline: 2px solid rgba(255,179,0,.17) !important;
}
.password-toggle {
  color: #aaa9a5 !important;
  border-radius: 8px !important;
}
.password-toggle:hover { background: #303030 !important; color:#ffb300 !important; }
.recover-link,.tfa-back { color:#ffc343 !important; }
.login-btn {
  min-height: 48px !important;
  background: linear-gradient(110deg,#f7a600,#ffc024) !important;
  color: #251900 !important;
  border-radius: 9px !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 22px rgba(255,179,0,.12) !important;
}
.login-btn:hover {
  background: linear-gradient(110deg,#ffb51b,#ffce4e) !important;
}
.login-btn:focus-visible,
.blazor-signup-btn:focus-visible {
  outline: 3px solid rgba(255,179,0,.45) !important;
  outline-offset: 3px;
}
.blazor-signup-btn {
  background: transparent !important;
  color: #ffc343 !important;
  border: 1px solid rgba(255,179,0,.52) !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
  min-height: 45px !important;
}
.blazor-signup-btn:hover { background: rgba(255,179,0,.09) !important; }
.login-footer {
  background: #202021 !important;
  border-top: 1px solid #383838 !important;
  color: #929292 !important;
  font-weight: 500;
  font-size: .68rem !important;
}
.login-footer span+span::before { color: #666 !important; }
.message {
  background: #252525 !important;
  border-radius: 9px;
}
.message.error { color:#ff8f8f !important; border-color:rgba(255,106,106,.34) !important; }
.message.success { color:#80e0aa !important; border-color:rgba(79,218,140,.34) !important; }
.message.warning { color:#ffc66b !important; border-color:rgba(255,179,0,.34) !important; }
.message.info { color:#8eb5ff !important; border-color:rgba(114,162,255,.34) !important; }
.tfa-head,.tfa-title,.tfa-note { color:var(--text); }
.tfa-icon {
  background: rgba(255,179,0,.11) !important;
  color: #ffb300 !important;
  border-color: rgba(255,179,0,.23) !important;
}
@media(max-width:480px) {
  body::before {width:90vw;height:90vw;}
  body::after {width:69vw;height:69vw;}
  .login-shell {max-width:100% !important;}
  .login-main {padding:26px 21px 23px !important;}
  .login-card {border-radius:15px !important;}
  .input-wrap input {font-size:16px !important;}
}
@media(prefers-reduced-motion:reduce) {
  body::before,body::after {animation:none !important;}
}