:root {
  --swish-primary-color: #1f2d3d;
  --swish-input-shadow: #253649;
  --swish-border-radius: 3px;
  --swish-box-shadow: 0 8px 40px -12px var(--swish-primary-color);
}

#auth-page {
  font-family: "Open Sans", Helvetica, "sans-serif";
}

#auth-page h1, #auth-page h2, #auth-page h3, 
#auth-page h4, #auth-page h5, #auth-page h6 {
  color: #32325d;
}

#auth-page .text-main {
  color: #5D5C5D;
}

#auth-page .text-neutral {
  color: var(--swish-primary-color);
}

/* **
 * -------------------------------------------------------------------------------
 *  Button color scheme
 * -------------------------------------------------------------------------------
** */

#auth-page .btn-main {
  color: #fff;
  border: none;
  font-size: 16px;
  height: calc(1.5em + 1.25rem + 2px);
  background: var(--swish-primary-color);
}

#auth-page .btn:hover {
  box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

#auth-page .btn-primary {
  background-color: var(--swish-primary-color);
  border-color: var(--swish-primary-color);
}

#auth-page .btn-group-sm > .btn, #auth-page .btn-sm {
  font-size: .75rem;
}

#auth-page .btn-shadow {
  box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
}


/* **
 * -------------------------------------------------------------------------------
 *  General Custom
 * -------------------------------------------------------------------------------
** */

#auth-page .form-control:focus {
  border: 1px solid var(--swish-primary-color);
  box-shadow: 0 0 0 0.2rem var(--swish-input-shadow);
  -webkit-box-shadow: 0 0 0 0.2rem var(--swish-input-shadow);
  -moz-box-shadow: 0 0 0 0.2rem var(--swish-input-shadow);
}

#auth-page .form-control {
  background: #f7f8f9;
  border: 1px solid #ebeff6;
}

#auth-page .box-rounded-left {
  border-top-left-radius: var(--swish-border-radius)!important;
  -moz-border-top-left-radius: var(--swish-border-radius)!important;
  -webkit-border-top-left-radius: var(--swish-border-radius)!important;
  border-bottom-left-radius: var(--swish-border-radius)!important;
  -moz-border-bottom-left-radius: var(--swish-border-radius)!important;
  -webkit-border-bottom-left-radius: var(--swish-border-radius)!important;
}

#auth-page .box-rounded-right {
  border-top-right-radius: var(--swish-border-radius)!important;
  -moz-border-top-right-radius: var(--swish-border-radius)!important;
  -webkit-border-top-right-radius: var(--swish-border-radius)!important;
  border-bottom-right-radius: var(--swish-border-radius)!important;
  -moz-border-bottom-right-radius: var(--swish-border-radius)!important;
  -webkit-border-bottom-right-radius: var(--swish-border-radius)!important;
}

#auth-page .box-rounded {
  border-radius: var(--swish-border-radius) !important;
  -moz-border-radius: var(--swish-border-radius)!important;
  -webkit-border-radius: var(--swish-border-radius)!important;
}

#auth-page .overlay-background p {
  font-size: 14px;
  font-weight: 100;
  line-height: 20px;
  letter-spacing: .5px;
  margin: 20px 40px 30px;
}

#auth-page .sign-in-form button {
  transition: transform 80ms ease-in;
}

#auth-page a {
  font-size: 16px;
  text-decoration: none;
}

#auth-page .box-shadow {
  box-shadow: var(--swish-box-shadow)!important;
}


@media (max-width: 991px) {
  #auth-page .form-box {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

#auth-page .overlay-background {
  background: url("https://elimi.ir/images/overlay.jpg") center / cover no-repeat;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
}

#auth-page .form-group > label {
  color: var(--swish-primary-color);
  font-size: 0.9em;
  font-weight: bold;
}

#auth-page .sign-in {
  width: 100%;
  max-width: 450px;
}

#auth-page .sign-in-form .icon {
  font-size: 86px;
  color: #ff7043;
}

#auth-page .logo-image {
  max-height: 50px;
}

@media (max-width: 767px) {
  #auth-page .overlay-box {
    height: 250px;
  }
}

#auth-page .logo {
  z-index: 2;
}

#auth-page .forgot-password-text {
  font-size: 0.9em;
  font-weight: bold;
}

#auth-page .form-control-lg {
  font-size: 1rem;
  height: calc(1.5em + 1.25rem + 2px);
}

#auth-page .message-box {
  z-index: 2;
  color: white;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

#auth-page .overlay-background:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  opacity: 0.94;
  background: var(--swish-primary-color);
}

@media (max-width: 767px) {
  #auth-page .message-box {
    position: relative;
    left: 0;
    top: 0;
    transform: initial;
  }
}

.overlay-content{
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 767px) {
  .vh {
    height: 100vh!important;
  }
}

.form-step { transition: opacity .3s ease; }
.form-step.d-none { display: none !important; }