@border-color: #c8c8c8;
@active-bg: #f5f8fc;
@active-color: #52a6e1;
@anim: cubic-bezier(0.215, 0.610, 0.355, 1.00);
@error-bg: #ffaaaa;
@error-color: darken(@error-bg, 35);

.bt-form__wrapper {
  margin: 30px auto;
  max-width: 500px;
}

.bt-flabels {  
  input[type=text], input[type=password], input[type=email], input[type=phone],
  select {
    position: relative;
    /*width: 100%;
    height: 50px;
    border: none;
    border-radius: 0;*/
    z-index: 1;
    transition: background 0.3s @anim, border-color 0.3s @anim;
    
    &:focus {
      background: @active-bg;
    }
  }
  /*
  label {
    pointer-events: none;
    position: absolute;
    opacity: 0;
    top: 0;
    transform: translateY(15%);
    z-index: 2;
    font-weight: bold;
    font-size: 10px;
    text-transform: uppercase;
    padding-left: 6px;
    color: @active-color;
    transition: transform 0.3s @anim, opacity 0.3s @anim;
  }
  */
  >*:not(:first-child) {
    
    &.bt-flabels__wrapper, .bt-flabels__wrapper {
      /*border-top: none;*/
    }
  }
}
.bt-flabels__wrapper {
  position: relative;
  /*border: 1px solid @border-color;*/
}
.bt-flabels__error-desc {
  position: absolute;
  top: 0;
  right: 6px;
  opacity: 0;
  font-weight: bold;
  color: @error-color;
  font-size: 10px;
  text-transform: uppercase;
  z-index: 3;
  pointer-events: none;
}
.bt-flabels__error {
  
  input[type], select {
    background: @error-bg;
    
    &:focus {
      background: @error-bg;
    }
  }
  
  .bt-flabels__error-desc {
    opacity: 1;
    transform: translateY(0);
  }
}

.bt-flabels--right {
  border-left: none;
}
.bt-flabel__float {
  
  label {   
    opacity: 1;
    transform: translateY(0);
  }
  
  input[type], select {
    padding-top: 9px;
  }
}