/* UI-REF-037 Login & Sicherheit - product visual conformance layer.
   Semantics remain server-authoritative in account-security.js. */
#loginView.login-shell{
  background:
    linear-gradient(180deg,rgba(5,18,28,.18),rgba(5,13,20,.72)),
    radial-gradient(circle at 18% 16%,#36594a 0,transparent 30%),
    radial-gradient(circle at 78% 22%,#36516d 0,transparent 31%),
    linear-gradient(145deg,#263f36 0,#18242d 48%,#0d1419 100%);
  color:#13202a;
}
#loginView .login-card{
  width:min(430px,calc(100% - 32px));
  background:#fff;
  border:1px solid #dce5ea;
  color:#13202a;
  box-shadow:0 26px 80px #06101866;
}
#loginView .login-card .brand{color:#13202a}
#loginView .login-card .brand span{color:#0e9f62}
#loginView .login-card .eyebrow{color:#5b6975}
#loginView .login-card h1{color:#13202a}
#loginView .login-card label{color:#23323d;font-weight:700}
#loginView .login-card input{
  background:#f8fafc;
  border-color:#cbd8e1;
  color:#13202a;
}
#loginView .login-card input:focus{
  outline:2px solid #0d6efd;
  border-color:#0d6efd;
}
#loginView .login-card .primary{
  background:#0d6efd;
  border-color:#0d6efd;
  color:#fff;
}
#loginView .login-card .primary:hover{background:#075ed9}
#loginView #accountForgotPassword{
  border:0;
  background:transparent;
  color:#075fbf;
  text-decoration:underline;
  font-weight:600;
}
#loginView #loginError:not(:empty){
  margin-top:12px;
  padding:11px 12px;
  border:1px solid #f2b9bf;
  border-radius:7px;
  background:#fff0f2;
  color:#b4232c;
  font-weight:700;
}

.account-security-dialog{
  background:rgba(8,18,28,.58);
  color:#182630;
}
.account-security-dialog .modal{
  background:#fff;
  border:1px solid #dce5ea;
  color:#182630;
  box-shadow:0 24px 70px #06101855;
}
.account-security-dialog .modal-head{
  padding-bottom:12px;
  border-bottom:1px solid #e5edf2;
}
.account-security-dialog .modal-head h2,
.account-security-dialog h3{color:#13202a}
.account-security-dialog .account-close{
  background:#f4f7f9;
  border-color:#d9e3e9;
  color:#33434f;
}
.account-security-dialog .account-security-body{color:#40505c}
.account-security-dialog label{color:#263844;font-weight:700}
.account-security-dialog input,
.account-security-dialog select,
.account-security-dialog textarea{
  background:#f8fafc;
  border-color:#cbd8e1;
  color:#13202a;
}
.account-security-dialog input:focus{
  outline:2px solid #0d6efd;
  border-color:#0d6efd;
}
.account-security-dialog .card{
  background:#fff;
  border-color:#dce5ea;
  color:#263844;
  box-shadow:0 1px 3px #13202a0c;
}
.account-security-dialog .primary{
  background:#0d6efd;
  border-color:#0d6efd;
  color:#fff;
}
.account-security-dialog .primary:hover{background:#075ed9}
.account-security-dialog .secondary{
  background:#f7f9fb;
  border-color:#cbd8e1;
  color:#243641;
}
.account-security-dialog .secondary:hover{background:#eef3f6;border-color:#aebfca}
.account-security-dialog .account-security-error:not(:empty){
  margin-top:12px;
  padding:10px 12px;
  border:1px solid #f2b9bf;
  border-radius:7px;
  background:#fff0f2;
  color:#b4232c;
  font-weight:700;
}
.account-security-dialog #accountTotpSecret{
  display:inline-block;
  padding:8px 10px;
  border:1px solid #cbd8e1;
  border-radius:6px;
  background:#f5f8fa;
  color:#22323d;
  letter-spacing:.05em;
}
.account-security-dialog #accountTotpDone{
  background:#159b58;
  border-color:#159b58;
}
.account-security-dialog #accountSessionRows{
  overflow:hidden;
  border:1px solid #dfe7ec;
  border-radius:8px;
}
.account-security-dialog .account-session-row{
  margin:0;
  padding:11px 12px;
  border-bottom:1px solid #e5edf2;
  background:#fff;
}
.account-security-dialog .account-session-row:first-child{background:#eef9f1}
.account-security-dialog .account-session-row:last-child{border-bottom:0}
.account-security-dialog .account-session-row small{color:#697985}
.account-security-dialog .account-session-revoke,
.account-security-dialog #accountRevokeOthers{
  background:#fff5f5;
  border-color:#efb7bb;
  color:#bd2530;
}
.account-security-dialog #accountIdleKeepalive{
  background:#0d6efd;
  border-color:#0d6efd;
  color:#fff;
}
.account-security-dialog #accountIdleLogout{
  background:#f7f9fb;
  border-color:#cbd8e1;
  color:#263844;
}
.mobile-account-security-action{display:none}

@media(max-width:820px){
  .mobile-account-security-action{
    display:flex!important;
    align-items:center;
    gap:11px;
    width:100%;
    min-height:44px;
    border:0;
    border-radius:7px;
    background:transparent;
    color:#e8efea;
    text-align:left;
    padding:11px 12px;
  }
  .mobile-account-security-action span:first-child{
    width:18px;
    color:#74c947;
    text-align:center;
  }
  .mobile-account-security-action:hover,
  .mobile-account-security-action:focus-visible{background:#202620}
  .account-security-dialog .modal{
    width:min(680px,100%);
    color:#182630;
  }
  .account-security-dialog .modal-actions{
    background:#fff;
    border-top:1px solid #edf2f5;
  }
}
@media(max-width:560px){
  #loginView.login-shell{place-items:center;padding:16px}
  #loginView .login-card{width:100%;padding:24px 18px}
  .account-security-dialog{place-items:end center}
  .account-security-dialog .modal{
    border-radius:16px 16px 8px 8px;
    padding:16px;
  }
  .account-security-dialog .two{grid-template-columns:1fr!important}
  .account-security-dialog .account-session-row{align-items:stretch}
  .account-security-dialog .account-session-revoke{width:100%;margin-top:8px}
}