@use '../../vars.scss' as vars;

.form-control {
    background-color: #fff;
    background-image: none;
    border: 1px solid vars.$Light-Gray-3;
    font-family: vars.$font-body;
    color: vars.$Dark-Gray-1;
    outline: 0;
    padding: 8px 12px;
    line-height: normal;
    font-size: 14px;
    font-weight: 400;
    vertical-align: middle;
    min-height: 35px;
    transition: all .12s ease;
    box-shadow: none;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    margin-bottom: calc(var(--form-control-mb, 10) * 1px);

    &::placeholder {
        font-style: italic;
        color: inherit;
        opacity: .7
    }
    &:focus {
        border-color: #0000001a;
        background-color: #f5f5f5;
        outline: 0!important;
        box-shadow: none
    }
}


.form-control:focus {
    border-color: #0000001a;
    background-color: #f5f5f5;
    outline: 0!important;
    box-shadow: none
}

.form-control:focus::-moz-placeholder {
    color: inherit;
    opacity: .7
}

.form-control:focus:-ms-input-placeholder {
    color: inherit;
    opacity: .7
}

.form-control:focus::-webkit-input-placeholder {
    color: inherit;
    opacity: .7
}

.form-control::-moz-placeholder {
    color: inherit;
    opacity: .33
}

.form-control:-ms-input-placeholder {
    color: inherit;
    opacity: .33
}

.form-control::-webkit-input-placeholder {
    color: inherit;
    opacity: .33
}

.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control {
    background: #fafafa;
    color: #929292
}