.form-group.has-danger .error, .input-group.has-danger .error {

color: $danger-states;

}

.form-group.has-success .error, .input-group.has-success .error {

color: $success;

}

@include form-control-lg-padding($padding-lg-vertical, $padding-input-horizontal); @include input-base-padding($padding-input-vertical, $padding-input-horizontal);

.form-group.no-border, .input-group.no-border{

.form-control,
.form-control + .input-group-prepend .input-group-text,
.form-control + .input-group-append .input-group-text{

    background-color: lighten($black,1%);
    border: medium none;
    &:focus,
    &:active,
    &:active{
        border: medium none;
        background-color: lighten($black,2%);
    }
}

.form-control{
    &:focus{
        & + .input-group-prepend .input-group-text,
        & + .input-group-append .input-group-text{
            background-color: lighten($black,2%);
        }
    }
}

.input-group-prepend .input-group-text,
.input-group-append .input-group-text{
    background-color: lighten($black,1%);;
    border: none;
}

}

.has-error{

.form-control-feedback, .control-label{
    color: $danger-states;
}

} .has-success{

.form-control-feedback, .control-label{
    color: $success;
}

}

.input-group-append .input-group-text, .input-group-prepend .input-group-text {

background-color: transparent;
border: 1px solid lighten($black,5%);
border-radius: $border-radius-lg;
color: $white;

& i{
  opacity: .5;
}

@include transition-input-focus-color();

.has-danger.input-group-focus &{
    background-color: $transparent-bg;
}

.has-success &{
    background-color: $transparent-bg;
}
.has-danger .form-control:focus + &{
    color: $danger-states;
}
.has-success .form-control:focus + &{
    color: $success;
}

& + .form-control,
& ~ .form-control{
    @include input-size($padding-base-vertical - 1, $padding-base-horizontal);
    padding-left: 18px;
}

i{
    width: 17px;
}

}

.input-group-append, .input-group-prepend .input-group-text, .input-group-prepend .input-group-text {

background-color: transparent;
border: 1px solid lighten($black,5%);
border-radius: $border-radius-lg;
color: $white;
margin: 0;

}

.input-group-append .input-group-text{

border-left: none;

} .input-group-prepend .input-group-text{

border-right: none;

}

.input-group-focus{

.input-group-prepend .input-group-text,
.input-group-append .input-group-text{
    background-color: $white;
    border-color: $primary;
    background-color: $transparent-bg;
    border-color: $primary;
}

&.no-border{
    .input-group-prepend .input-group-text,
    .input-group-append .input-group-text{
        background-color: lighten($black,2%);
    }
}

}

.input-group, .form-group{

margin-bottom: 10px;
position: relative;

.form-control-static{
    margin-top: 9px;
}

}

.input-group{

.input-group-prepend .input-group-text,
.input-group-append .input-group-text{
    background-color: $light-gray;
}

}

.input-group .form-control:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child){

border-radius: $border-radius-lg;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left: 0 none;

}

.input-group .form-control:first-child, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {

border-right: 0 none;

} .input-group .form-control:last-child, .input-group-btn:last-child > .dropdown-toggle, .input-group-btn:first-child > .btn:not(:first-child) {

border-left: 0 none;

} .form-control, .form-control, fieldset .form-control {

background-color: $black-states;
color: $default;
cursor: not-allowed;

}

.input-group-btn .btn{

border-width: $border-thin;
padding: $padding-btn-vertical  $padding-base-horizontal;

} .input-group-btn .btn-default:not(.btn-fill){

border-color: $medium-gray;

}

.input-group-btn:last-child > .btn{

margin-left: 0;

}

textarea.form-control{

max-width: 100%;
max-height: 80px;
padding: 10px 10px 0 0;
resize: none;
border: none;
border-bottom: 1px solid lighten($black,5%);
border-radius: 0;
line-height: 2;

&:focus,
&:active{
    border-left: none;
    border-top: none;
    border-right: none;
}

}

.has-success, .has-danger{

&.form-group .form-control,
&.form-group.no-border .form-control{
    padding-right: $input-padding-horizontal + 21;
}

}

.form.form-newsletter .form-group{

float: left;
width: 78%;
margin-right: 2%;
margin-top: 9px;

}

.input-group .input-group-btn{

padding: 0 12px;

}

// Input files - hide actual input - requires specific markup in the sample. .form-group input {

opacity: 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;

}

.form-text{

font-size: $font-size-sm;
color: rgba($white,0.8);

}

.form-control-lg{

padding: 0;
font-size: inherit;
line-height: 0;
border-radius: 0;

.form-control {
  height: calc(2.875rem + 2px);
}

}

.form-horizontal{

.col-form-label,
.label-on-right{
    padding: 10px 5px 0 15px;
    text-align: right;
    max-width: 180px;
}

.checkbox-radios{
    margin-bottom: 15px;

    .form-check:first-child{
       margin-top: 8px;
   }
}

.label-on-right{
    text-align: left;
    padding: 10px 15px 0 5px;
}

.form-check-inline{
    margin-top: 6px;
    .form-check-label{
      margin-right: 1.5rem;
    }
}

}

.search-bar{

 margin-left: $margin-lg-vertical;
   .btn{
     margin: 0;
   }
    &.input-group{
        border-radius: 25px;
        z-index: 4;
        margin-bottom: 0;
        height: 43px;
        .input-group-addon{
           padding: 10px;
            background: transparent;
            border: none;
            color: rgba(255, 255, 255, 0.7);

        }

        i{
            font-size: 20px;
            color: white;
            margin-top: 0 !important;
        }
        input{
            background: transparent;
            border:none !important;
            border-radius: 0;
            padding: 12px !important;
            font-size: 12px;
            opacity: 0.5;
            &:focus{
                background: transparent;
            }
        }
        .form-control{
            opacity: 1;
            color: $white;
            &::placeholder{
              color: white;
            }
        }
    }
}

.modal-search .modal-dialog{
  max-width: 1000px;
  margin: 20px auto;
  .form-control{
    border: none;
    color: $black;
    &::placeholder{
      color: $black;
    }
  }
}

.input-group-prepend{

margin-right: 0;

} .input-group-prepend, .input-group-append {

.tim-icons {
  font-size: $font-paragraph;
}

}