@import "../Theme/Theme.scss";
@import "../PickerList/RainbowBg.scss";

$line-min-height: 24px;

div.object-picker {

    div.list-color {
        width: 3px;
        height: $line-min-height;
        border-radius: 1000px;
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    div.value-view {
        flex-shrink: 1;
        width: 100%;
        height: 100%;
        max-width: calc( 100% - 51px );
        min-height: $line-min-height;
        display: flex;
        align-items: center;

        span {
            word-break: keep-all;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            display: block;
            max-width: 100%;
        }
    }

    div.list-button {
        width: $line-min-height;
        height: $line-min-height;
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    div.list-empty {
        width: $line-min-height;
        height: $line-min-height;
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    div.list-empty:hover {
        color: $lt-red;
    }
}