@import '../../styles/variables';

.quick-search-item {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    line-height: normal;

    &.is-active {
        background-color: rgba(232, 243, 250, .4);
    }

    svg {
        flex: none;
    }

    .item-info {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        min-width: 1px; /* 0 doesn't work for IE11 */
        margin-left: 10px;
    }

    .item-name {
        max-width: 100%;
        overflow: hidden;
        color: $bdl-gray;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .search-term {
        font-weight: bold;
        background-color: transparent;
    }

    .item-subtext {
        display: flex;
        align-items: center;
        max-width: 100%;
        color: $bdl-gray-50;
        font-size: 12px;
    }

    .parent-folder {
        margin-left: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .separator {
        flex: none;
        margin: 0 10px;
    }
}