:root{
  --mk-login-navy:#082d63;
  --mk-login-blue:#1769e8;
  --mk-login-red:#d70d20;
  --mk-login-text:#17345d;
  --mk-login-muted:#6b7a90;
  --mk-login-border:#dce5ef;
}
html.login{background:#f5f8fc!important}
body.login{
  margin:0!important;
  min-height:100vh!important;
  background:
    radial-gradient(circle at 10% 10%,rgba(23,105,232,.07),transparent 28%),
    radial-gradient(circle at 92% 88%,rgba(8,45,99,.06),transparent 30%),
    #f7f9fc!important;
  font-family:'Manrope',Arial,sans-serif!important;
  color:var(--mk-login-text)!important;
  overflow-x:hidden;
}
body.login:before{
  content:"";
  position:fixed;
  width:520px;height:520px;
  left:-360px;bottom:-300px;
  border:90px solid rgba(23,105,232,.045);
  border-radius:50%;
  pointer-events:none;
}
body.login:after{
  content:"";
  position:fixed;
  width:430px;height:430px;
  right:-300px;top:-260px;
  border:75px solid rgba(8,45,99,.035);
  border-radius:50%;
  pointer-events:none;
}
#login{
  position:relative!important;
  z-index:2!important;
  width:min(430px,calc(100% - 32px))!important;
  margin:0 auto!important;
  padding:30px 0 26px!important;
}
#login h1{
  margin:0 0 8px!important;
  padding:0!important;
  height:170px!important;
  text-align:center!important;
}
#login h1 a,
#login h1 a:focus{
  display:block!important;
  width:160px!important;
  max-width:160px!important;
  height:160px!important;
  max-height:160px!important;
  margin:0 auto!important;
  padding:0!important;
  background-image:url('../assets/logo-login.png')!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:100% 100%!important;
  box-shadow:none!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  text-indent:-9999px!important;
  overflow:hidden!important;
  transform:none!important;
}
#login h1 a:hover{transform:scale(1.015)!important}
.mk-login-heading{
  text-align:center!important;
  font-size:28px!important;
  line-height:1.2!important;
  font-weight:800!important;
  letter-spacing:.4px!important;
  color:var(--mk-login-navy)!important;
  margin:0 0 5px!important;
}
.mk-login-subtitle{
  text-align:center!important;
  font-size:13px!important;
  line-height:1.55!important;
  color:var(--mk-login-muted)!important;
  margin:0 0 18px!important;
}
#loginform{
  margin-top:0!important;
  background:#fff!important;
  border:1px solid rgba(8,45,99,.10)!important;
  border-radius:16px!important;
  padding:25px 28px 27px!important;
  box-shadow:0 16px 40px rgba(8,45,99,.10)!important;
}
#loginform p{margin:0 0 16px!important}
#loginform label{
  display:block!important;
  color:#304762!important;
  font-size:13px!important;
  font-weight:700!important;
  margin:0 0 7px!important;
}
#loginform input[type=text],
#loginform input[type=password]{
  width:100%!important;
  box-sizing:border-box!important;
  height:50px!important;
  margin:0!important;
  border:1px solid var(--mk-login-border)!important;
  border-radius:9px!important;
  background:#fff!important;
  color:var(--mk-login-text)!important;
  font-size:15px!important;
  padding:0 13px!important;
  outline:none!important;
  box-shadow:none!important;
  transition:border-color .2s,box-shadow .2s!important;
}
#loginform input[type=text]:focus,
#loginform input[type=password]:focus{
  border-color:var(--mk-login-blue)!important;
  box-shadow:0 0 0 3px rgba(23,105,232,.11)!important;
}
#loginform .forgetmenot{
  float:none!important;
  width:auto!important;
  margin:1px 0 17px!important;
}
#loginform .forgetmenot label{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  color:#5d6e83!important;
  font-weight:500!important;
}
#loginform .forgetmenot input{
  width:16px!important;
  height:16px!important;
  margin:0!important;
  accent-color:var(--mk-login-blue)!important;
}
#loginform .submit{
  float:none!important;
  margin:0!important;
}
#loginform .submit .button-primary{
  width:100%!important;
  height:50px!important;
  border:0!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,#1769e8,#0757d4)!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:800!important;
  text-shadow:none!important;
  box-shadow:0 7px 16px rgba(23,105,232,.22)!important;
  transition:transform .2s,box-shadow .2s!important;
}
#loginform .submit .button-primary:hover{
  background:linear-gradient(135deg,#0757d4,#0648b4)!important;
  transform:translateY(-1px)!important;
  box-shadow:0 10px 20px rgba(23,105,232,.27)!important;
}
#login p#nav,
#login p#backtoblog{
  text-align:center!important;
  padding:0!important;
  margin:14px 0 0!important;
  font-size:12px!important;
}
#login p#nav a,
#login p#backtoblog a{
  color:var(--mk-login-blue)!important;
  text-decoration:none!important;
}
#login p#nav a:hover,
#login p#backtoblog a:hover{text-decoration:underline!important}
.mk-login-footer{
  position:relative;
  z-index:2;
  text-align:center;
  padding:2px 16px 22px;
  color:#7a8798;
  font-size:11px;
}
.mk-login-values{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:10px;
  font-weight:700;
  font-size:10px;
}
.mk-login-values span:nth-child(1){color:#1457c4}
.mk-login-values span:nth-child(2){color:#159447}
.mk-login-values span:nth-child(3){color:#d3212d}
.mk-login-values span:nth-child(4){color:#4b35a9}
.login #login_error,
.login .message,
.login .success{
  border-radius:9px!important;
  border-left-color:var(--mk-login-blue)!important;
  box-shadow:0 5px 14px rgba(8,45,99,.07)!important;
}
@media(max-width:600px){
  #login{
    width:calc(100% - 24px)!important;
    padding:18px 0 16px!important;
  }
  #login h1{
    height:140px!important;
    margin-bottom:6px!important;
  }
  #login h1 a,
  #login h1 a:focus{
    width:130px!important;
    max-width:130px!important;
    height:130px!important;
    max-height:130px!important;
  }
  .mk-login-heading{font-size:23px!important}
  .mk-login-subtitle{font-size:12px!important;margin-bottom:14px!important}
  #loginform{padding:20px 17px 21px!important;border-radius:14px!important}
  #loginform input[type=text],
  #loginform input[type=password],
  #loginform .submit .button-primary{height:48px!important}
  .mk-login-values{gap:9px;font-size:9px}
  .mk-login-footer{padding-bottom:14px}
}
@media(min-width:1000px){
  #login{width:430px!important;padding-top:32px!important}
  #login h1{height:170px!important}
  #login h1 a,
  #login h1 a:focus{
    width:160px!important;
    max-width:160px!important;
    height:160px!important;
    max-height:160px!important;
  }
}