/*Login page css here */

  
.login-page {
  min-height: 100vh;
  position: relative;
}

.login-page::before {
  content: "";
  display: block;
  z-index: -1;
  -webkit-filter: blur(10px);
  filter: blur(10px);
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.login-page .container {
  z-index: 999;
}

.align-items-center {
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
}


.input-material-group {
  position: relative;
  padding-top: 0.85rem;
}

.input-material-group .input-material {
  border: none;
  background: none;
  padding: 0.375rem 0;
  border-bottom: 1px solid #ebeef0;
  display: block;
  width: 100%;
}

.input-material-group .input-material:focus-visible {
  outline: none;
}

.input-material-group .input-material.js-validate-error-field {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}

.input-material-group .input-material.is-invalid {
  position: relative;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.input-material-group .input-material.is-valid {
  position: relative;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
  border-color: #28a745;
}

.input-material-group .input-material.is-valid + label {
  color: #28a745 !important;
}

.input-material-group .label-material {
  position: absolute;
  top: 1.225rem;
  left: 0;
  font-size: 16px;
  color: #a1a8ae;
  cursor: text;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: none;
  transform: none;
}

.input-material-group .label-material.active {
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
  top: -6px;
  color: #7000F4;
  font-weight: bold;
}