.ww-dropdown {
    position: relative;
}

.ww-dropdown__toggle {
    height: 2rem;
    box-sizing: border-box;
    display: flex;
    border: 1px solid #ccc;
    background-color: #fff;
}

.ww-dropdown__icon {
    width: 1rem;
    padding-left: 0.5rem;
    user-select: none;
}

.ww-dropdown__text {
    min-width: 7rem;
    padding: 0.3rem 0.5rem;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
}

.ww-dropdown__indicator {
    box-sizing: border-box;
    color: #ffe;
    border: none;
}

.ww-dropdown__menu {
    box-shadow: 1px 1px 5px #999;
    background-color: white; 
    z-index: 100;
    /** Dialog resets */
    padding: 0;
    border: 0;
    margin: initial;
    /** For floating-ui */
    width: max-content;
    position: absolute;
    top: 0;
    left: 0;

}

.ww-dropdown__list {
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: left;
    max-height: 18rem; 
    overflow-y: scroll;
}

.ww-dropdown__list--wide {
    height: 18rem;
    width: 36rem;
}

.ww-dropdown__toggle, .ww-dropdown__list:not(.ww-dropdown__list--wide), .ww-checkable-list {
    max-width: 24rem;
}

.ww-dropdown__header {
    border-top: 1px solid #ccc;
	border-bottom: 2px solid #ccc;
}

.ww-dropdown__header, .ww-dropdown__item {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    background-color: #F7F7F7;
    background-repeat: repeat-x;
    padding: 0.25rem;
    outline-offset: -0.25rem; /** Prevents focus outline from being clipped */
}

.ww-dropdown__filter {
    width: 100%;
}

.ww-dropdown__option {
    margin: 0;
    padding: 4px;
    border: 0 solid #ccc;
    border-bottom-width: 1px;
    cursor: pointer;
}

.ww-dropdown__option:not(.ww-dropdown__option--selected):hover {
    background-color: #efefef;
}

.ww-dropdown__item:nth-child(odd) {
    background-color:#E8E8E8;
}

.ww-dropdown__item + .ww-dropdown__item {
    border-top: none;
}

.ww-dropdown__checkbox {
    border-top: 1px solid #ccc;
    border-bottom: 2px solid #ccc;
}

.ww-dropdown__checkbox, .ww-dropdown__label {
    cursor: pointer;
}

.ww-dropdown__label {
    flex-grow: 1;
}