deja-select {
    // position: relative;
    // min-height: 3.5rem;
    width: 100%;
    white-space: initial;
    display: flex;
    align-items: center;
    min-height: 1rem;

    >input {
        flex: 1 1 100%;
    }

    deja-chips {
        width: 100%;

        .insert-item {
            display: flex;
            align-items: center;
            height: 1.2rem;
        }
    }

    .actions-suffix {
        flex: 0 0 auto;
        text-align: right;
        overflow: visible;
        display: flex;
        align-items: center;
        height: 0;

        #clear-button,
        #drop-down-button {
            font-size: 1.2rem;
            opacity: 0.35;

            &:hover {
                opacity: 1;
                cursor: pointer;
            }
        }
    }

    @keyframes load {
        0% {
            left: -35%;
            right: 100%;
        }

        60% {
            left: 100%;
            right: -90%;
        }

        100% {
            left: 100%;
            right: -90%;
        }
    }

    @keyframes load-short {
        0% {
            left: -200%;
            right: 100%;
        }

        60% {
            left: 107%;
            right: -8%;
        }

        100% {
            left: 107%;
            right: -8%;
        }
    }
}

.deja-overlay-container {
    .deja-listcontainer {
        width: 100%;
        text-align: left;
        overflow-y: auto;

        div.listitem {
            white-space: nowrap;

            >deja-bold-query {
                flex: 1 1 100%;
                overflow: hidden;

                div {
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    position: relative;
                    width: 100%;
                }
            }
        }

        #expandbtn {
            min-width: 24px;
        }

        &[valign="bottom"] {
            border-top: none;
        }

        [current="true"] {
            box-shadow: none;
        }

        &[keynav="false"] {
            div.listitem:not(.unselectable):hover {
                cursor: pointer;
            }
        }

        #nodata-holder {
            margin: 0.5rem;
        }

        #loader {
            .spinner {
                margin: 10px auto 10px;
            }
        }
    }

    @import '../styles/mixins/item-list';
    @import '../styles/mixins/tree-list';
}