@import "_SelectMixins.less";

.queryable-select {
    .autocomplete-container();

    > .icon {
        .autocomplete-dropdown-button(normal);
    }

    > input {
        .border-box();
        .text-overflow();
        resize: none;
        &::-ms-clear {
            display: none;
        }
    }
}

// Interop with AUI forms
// -----------------------
form.aui .queryable-select,
.jiraform .queryable-select {   // because the .queryable-select container is inline-block,
    width: 100%;                // the width:100%; on the `form.aui .text` won't work.
    max-width: 250px;           // we need to re-state it here ourselves.

    &.short-field,
    &.short-field > input { max-width: 75px; }
    &.medium-field,
    &.medium-field > input { max-width: 165px; }
    &.long-field,
    &.long-field > input { max-width: 500px; }
    &.full-width-field,
    &.full-width-field > input { max-width: none; }

    > input {
        padding-right: 28px; // to make room for the .icon
        vertical-align: baseline;
        width: 100%;
    }
}
