/* Registration Form Styles */

.registration-form{
  position: relative;
  max-width: 600px;
  justify-content: center;
  margin: auto;
  padding:1rem 1rem !important;
  font-family:Arial,sans-serif !important;
}

.valid-icon,
.error-icon{
  position:absolute;
  right:0.75rem;
  top:50%;
  transform:translateY(-50%);
  font-size:1rem;
  display:none !important;
  color:transparent
}
.has-success .valid-icon{
  display:block !important;
  color:#28a745
}
.has-error .error-icon{
  display:block !important;
  color:#dc3545
}

.form-group{
  position:relative;
  margin-bottom:1.25rem;
  border-radius: 0.5rem;
}

.form-group .sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0
}
.form-group input{
  width:100%;
  padding:0.75rem;
  font-size:1rem;
  border:1px solid #ddd;
  border-radius:0.5rem;
  box-sizing:border-box;
  transition:border-color .3s;
  box-shadow:2px 4px 1rem rgba(0,0,0,.1);
}
.form-group input[type=checkbox]{
  width:auto;
  margin-right:10px;
  vertical-align:middle
}

.checkbox-group{
  display:flex;
  align-items:center
}
.checkbox-group label{
  font-size:0.75rem;
  color:#555;
  margin:0;
  text-align: left;
}

.error-tooltip{
  position:absolute;
  top:-1rem;
  left:50%;
  transform:translateX(-50%);
  background:#dc3545;
  color:#fff;
  font-weight: 400 !important;
  padding:0.25rem 0.75rem;
  border-radius:0.5rem;
  font-size:0.75rem;
  white-space:nowrap;
  display:none;
  z-index:10
}
.error-tooltip::after{
  content:'';
  position:absolute;
  bottom:-0.25rem;
  left:50%;
  transform:translateX(-50%);
  border:0.25rem solid transparent;
  border-top-color:#dc3545
}
.has-error .error-tooltip {
  display:block
}

.has-success input {
  border-color:#28a745
}

.has-error input {
  border-color:#dc3545
}

.checkbox-group .error-tooltip {
  top:-50px
}

.iti { 
  width:100%
}

.submit-btn{
  width:100% !important;
  padding:0.75rem !important;
  background:#007bff;
  color:#fff;
  border:none;
  border-radius:0.5rem;
  font-size:1rem !important; 
  cursor:pointer !important;
  transition:filter .3s !important;
}
.submit-btn:hover {
  filter: brightness(85%);
}

.submit-btn:disabled {
  background:#ccc;
  cursor:not-allowed
}

@media(max-width:480px){
  .registration-form{padding:1rem;margin:0.75rem}
  .form-group input{padding:0.75rem;font-size:1rem}
  .submit-btn{padding:0.75rem;font-size:1rem}
}

.registration-form > div:nth-child(5) > i.fas.fa-times-circle.error-icon {
  top: 50% !important;
}

.registration-form > div:nth-child(5) > i.fas.fa-check-circle.valid-icon {
  top: 50% !important;
}

/* preLoader */

#loading-overlay{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:rgba(255,255,255,.4);
  display:flex;
  justify-content:center;
  align-items:center;
  font-size:3rem;
  color:#007bff;
  z-index:8888;
}