.form-control {
    .border-radius(@border-radius-small);
    .box-shadow(none);
    color: @text-normal;
    .user-select(text);

    &:focus {
        border-color: @input-border;
        outline: 0;
        .box-shadow(none);
    }
}

.form-control[readonly] {
    cursor: pointer;
    background-color: @input-bg;
}

.form-control[disabled] {
    cursor: default;
    background-color: @input-bg;
   .user-select(none);
}

.input-row {
    position: relative;
}

.input-error {
    display: none;

    &:before {
        content: '';
        position: absolute;
        right: 3px;
        top: 4px;
        width: 16px;
        height: 16px;
        background-position: @input-error-offset-x @input-error-offset-y;
    }
}

.input-field {
    input,
    .input-error {
        float: left;
        position: relative;
    }

    &.form-control:focus,
    .form-control:focus {
        border-color: @border-preview-select;
    }

    &.error {
        input:not([disabled]) {
            border-color: @brand-danger;
        }

        input:not([disabled]) + .input-error {
            display: block;
        }
    }
}

input:required:focus:invalid,
input:focus:invalid,
input.error {
    border-color: @brand-danger;

    & + span.input-error {
        display: block;
    }
}

.disabled .form-control {
    opacity: 0.65;
    cursor: default !important;
}

::-ms-clear {
    display: none;
}

input[type="password"] {
    font-size: 16px;
}

input[type="text"]::selection, textarea::selection {
    background: @highlight-text-select;
    color: @text-inverse;
}

textarea.form-control:focus {
    border-color: @border-preview-select;
}

.input-field-btn {
    position: relative;

    .select-button {
        position: absolute;
        top: 1px;
        right: 1px;
    }
    .input-error {
        &:before {
            right: 22px;
        }
    }
    
    input {
        padding-right: 20px;
    }
}