﻿/**********************************************************/
/*List of items for Dropdowns, Multiselects and ComboBoxes*/
/**********************************************************/
.k-animation-container .k-list-container  {
    padding: 0;
    box-shadow: var(--small-shadow);
}

.k-animation-container .k-list-container .k-list-scroller .k-list li {
    color: var(--default-font);
    font-weight: 500;
    overflow: hidden;
    word-break: break-word;
    border-radius: 0;
    padding: 5px 10px;
}

.k-animation-container .k-list-container .k-list-scroller .k-list li:nth-child(odd),
.k-animation-container .k-list-container.k-list-scroller .k-list li:nth-child(odd),
#ResolvePopup .resolve-popup-box:nth-child(odd) {
    background-color: var(--item-alternate-background);
}

.k-animation-container .k-list-container.k-list-scroller .k-list > li.k-state-selected.k-state-focused,
.k-animation-container .k-list-container.k-list-scroller .k-list > li.k-state-selected,
.k-animation-container .k-list-container .k-list-scroller .k-list > li.k-state-selected.k-state-focused,
.k-animation-container .k-list-container .k-list-scroller .k-list > li.k-state-selected,
#ResolvePopup .resolve-popup-box:focus {
    background-color: var(--item-selected-background);
    color: var(--default-font);
    border-radius: 0;
}

.k-animation-container .k-list-container.k-list-scroller .k-list li.k-item.k-state-hover,
.k-animation-container .k-list-container .k-list-scroller .k-list li.k-item.k-state-hover,
#ResolvePopup .resolve-popup-box:hover {
    background-color: var(--item-hover-background);
}

.k-animation-container .k-list-container .k-list-optionlabel.k-state-hover {
    background-color: var(--item-hover-background);
}

.k-animation-container .k-list-container .k-list-optionlabel:hover .phoenix-placeholder {
    color: var(--default-font);
}

.k-animation-container .k-list-container.k-popup .k-list .k-state-focused {
    box-shadow: none;
}

.k-animation-container .k-list-container .k-list-optionlabel.k-state-selected,
.k-animation-container .k-list-container .k-list-optionlabel {
    color: var(--placeholder-font) !important;
    background-color: inherit;
    border: none;
    padding: 5px 10px;
}

.k-animation-container .k-list-container .k-list-optionlabel.k-state-selected.k-state-hover,
.k-animation-container .k-list-container .k-list-optionlabel.k-state-hover {
    background-color: var(--item-hover-background);
    color: var(--label-font);
}
/**********************************************************/