*{box-sizing:border-box}

html,body{
  min-height:100%;
}

body.phk-login{
  margin:0!important;
  min-height:100vh!important;
  padding:28px!important;
  display:grid!important;
  place-items:center!important;
  background:
    radial-gradient(circle at 78% 15%,rgba(237,28,36,.10),transparent 23%),
    radial-gradient(circle at 20% 0%,rgba(30,50,61,.30),transparent 28%),
    #05090c!important;
  color:#f4f6f7!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif!important;
}

.phk-login::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.14;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,black,transparent 80%);
}

.phk-login .login-card{
  position:relative;
  z-index:2;
  width:min(100%,440px)!important;
  margin:0!important;
  padding:38px!important;
  border:1px solid #253139!important;
  border-radius:8px!important;
  background:
    linear-gradient(145deg,rgba(15,24,29,.98),rgba(7,13,16,.98))!important;
  box-shadow:0 30px 80px rgba(0,0,0,.38)!important;
}

.phk-login .admin-logo{
  margin:0 0 45px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  background:none!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:900!important;
  letter-spacing:-.04em!important;
}

.phk-login .admin-logo b{
  width:46px!important;
  height:46px!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  background:#ed1c24!important;
  color:#fff!important;
  font-size:25px!important;
}

.phk-login .login-card h1{
  margin:0 0 10px!important;
  color:#fff!important;
  font-size:36px!important;
  line-height:1!important;
  font-weight:650!important;
  letter-spacing:-.055em!important;
}

.phk-login .login-card > p{
  margin:0 0 30px!important;
  color:#7f8a90!important;
  font-size:12px!important;
  line-height:1.65!important;
}

.phk-login .login-card label{
  margin:0 0 17px!important;
  display:block!important;
  color:#aeb6ba!important;
  font-size:8px!important;
  font-weight:750!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}

.phk-login .login-card input{
  width:100%!important;
  min-height:53px!important;
  margin-top:8px!important;
  padding:0 14px!important;
  outline:none!important;
  border:1px solid #2a373e!important;
  border-radius:0!important;
  background:#070d10!important;
  color:#fff!important;
}

.phk-login .login-card input:focus{
  border-color:#ed1c24!important;
}

.phk-login .login-card button{
  width:100%!important;
  min-height:52px!important;
  margin-top:5px!important;
  border:0!important;
  background:#ed1c24!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
}

.phk-login .login-card button:hover{
  background:#ff3037!important;
}

.phk-login .login-card > a{
  margin-top:22px!important;
  display:block!important;
  color:#717d83!important;
  font-size:9px!important;
  font-weight:650!important;
  text-align:center!important;
  text-decoration:none!important;
}

.phk-login .login-card > a:hover{
  color:#fff!important;
}

.phk-login .alert.error{
  margin-bottom:20px!important;
  padding:13px 14px!important;
  border:1px solid rgba(237,28,36,.4)!important;
  background:rgba(237,28,36,.08)!important;
  color:#ffc3c6!important;
  font-size:10px!important;
}

@media(max-width:520px){
  body.phk-login{
    padding:15px!important;
  }

  .phk-login .login-card{
    padding:28px 21px!important;
  }

  .phk-login .login-card h1{
    font-size:31px!important;
  }
}