.multiselect-autocomplete {
    display : table;

    .search-field {
        display: flex;
        max-width   : 358px;
        min-height  : 22px;
        border      : solid 1px #bbbbbb;
        font-family : @inputFontFamily;

        span { font-size: 11px; }

        &-container {
            flex          : 1;
            min-width     : 150px;
            padding-right : 20px;

            &:focus { outline: none; }

            &.collapsed {
                height      : 20px;
                overflow    : hidden;
                white-space : nowrap;

                .last-in-line:after {
                    content   : "...";
                    position  : absolute;
                    top       : 1px;
                    right     : -16px;
                    font-size : 11px;
                }
            }

            .selected-item {
                position         : relative;
                float            : left;
                max-width        : 236px;
                height           : 16px;
                margin           : 2px 0px 2px 2px;
                padding          : 0 18px 0 7px;
                border           : solid 1px #e6e6e6;
                background-color : #e6e6e6;

                .item-prefix   { color: #777777; }
                .label-wrapper {
                    .m-ellipsis;

                    line-height: 12px;
                }

                .close {
                    position   : absolute;
                    top        : 5px;
                    right      : 5px;
                    width      : 7px;
                    height     : 7px;
                    background : url("img/icons/close-icon.svg") no-repeat;
                    cursor     : pointer;
                }

                &.marked-for-deleting {
                    border-color     : #cccccc;
                    background-color : #cccccc;
                }

                &.validation-failed { color: #f2243f; }
            }

            input {
                float       : left;
                max-width   : 318px;
                min-width   : 100px;
                height      : 16px;
                margin      : 2px 0 2px 5px;
                outline     : none;
                border      : 0;
                font-family : @inputFontFamily;
            }
        }
    }

    &-filter-dropdown {
        position         : absolute;
        z-index          : 1;
        width            : 100%;
        margin           : 0;
        padding          : 5px 0;
        border           : 1px solid #cccccc;
        background-color : #ffffff;
        list-style       : none;

        .dropdown-item {
            margin      : 0 6px;
            padding     : 8px 5px;
            border-top  : 1px solid #dddddd;
            font-family : @inputFontFamily;
            font-size   : 11px;
            word-wrap   : break-word;

            .prefix { color: #777777; }

            strong {
                font-weight : bold;
                color       : #222222;
            }

            &:first-child { border: 0; }
            &.hover       { background-color: #ffffdd; }
        }

        &.hidden { display: none; }
    }
}