@charset "UTF-8";

.authentication-wrapper {
  display: flex;
  flex-basis: 100%;
  min-height: 100vh;
  width: 100%;
}

.authentication-wrapper .authentication-inner {
  width: 100%;
}

.authentication-wrapper.authentication-basic {
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.authentication-wrapper.authentication-cover {
  align-items: flex-start;
}

.authentication-wrapper.authentication-cover .authentication-inner {
  height: 100vh;
}

.authentication-wrapper.authentication-basic .authentication-inner {
  max-width: 690px;
  position: relative;
  direction: rtl;
}

.authentication-wrapper.authentication-basic .authentication-inner:after {
  width: 243px;
  height: 240px;
  content: " ";
  position: absolute;
  bottom: -68px;
  left: -46px;
}

.authentication-wrapper.authentication-basic .authentication-inner .card {
  z-index: 1;
  min-height: 500px;
}

.authentication-wrapper.authentication-basic .authentication-inner .card-body {
  width: 80%;
  margin: auto;
  padding-top: 9%;
}

.authentication-wrapper.authentication-basic .authentication-inner .card-body h4 {
  color: #285238;
}

.authentication-wrapper.authentication-basic .authentication-inner .app-brand {
  margin-bottom: 2.5rem;
}

.authentication-wrapper .auth-input-wrapper .auth-input {
  max-width: 50px;
  padding-left: 0.4rem;
  padding-right: 0.4rem;
  font-size: 150%;
}

@media (max-width: 575.98px) {
  .authentication-wrapper .auth-input-wrapper .auth-input {
    font-size: 1.125rem;
  }
}

.light-style .authentication-wrapper .authentication-bg {
  background-color: #fff;
}

div#forgetPass {
  direction: rtl;
}

input#contryCode {
  margin-top: 7px;
}

div#forgetPass .modal-footer button {
  width: 48%;
  border-radius: 5px;
  padding: 10px;
}

div#forgetPass .modal-dialog .modal-content {
  padding: 40px !important;
}

.pass .eye-hide {
  position: absolute;
  left: 1px;
  top: 5px;
  z-index: 99;
  background-color: transparent;
}

.pass input#password:focus {
  border-left: 1px solid #696cff;
}

label.form-label[for=phoneNumber] {
  width: 100%;
  text-align: right;
}

.alert-danger .error_icon {
  background-color: rgba(215, 45, 48, .2);
  display: inline-block;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  margin-left: 10px;
}

input.form-control.error {
  border: 1px solid #f30;
}

.input-group-merge .form-control.error:not(:last-child) {
  border-left: 1px solid #f30;
}

small.error_msg {
  position: relative;
  display: block;
  width: 100%;
  font-weight: normal;
  color: #d72d30;
}