/* Module: sumo-select — theme overrides on top of sumoselect.css */

/* Wrapper */
.SumoSelect {
    width: 100%;
}

/* Trigger button */
.SumoSelect > .CaptionCont {
    border: 1px solid #ccc;
    border-radius: var(--rwc-radius, 4px);
    padding: 8px 36px 8px 12px;
    min-height: 42px;
    font-size: inherit;
    font-family: inherit;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    user-select: none;
}

.SumoSelect > .CaptionCont span {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-light, inherit);
}

.SumoSelect > .CaptionCont label {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.SumoSelect > .CaptionCont label i {
    border-color: #888 transparent transparent;
    border-width: 6px 5px 0;
}

.SumoSelect.open > .CaptionCont label i {
    border-color: transparent transparent #888;
    border-width: 0 5px 6px;
}

/* Focus ring */
.SumoSelect:focus > .CaptionCont,
.SumoSelect.open > .CaptionCont {
    border-color: var(--rwc-primary, #7b2d8b);
    box-shadow: 0 0 0 2px rgba(123, 45, 139, .12);
    outline: none;
}

/* Dropdown panel */
.SumoSelect > .optWrapper {
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 0 0 var(--rwc-radius, 4px) var(--rwc-radius, 4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
    z-index: 9999;
    top: calc(100% - 1px);
    background: #fff;
}

/* Search box */
.SumoSelect > .optWrapper > .search > input {
    border: none;
    border-bottom: 1px solid #eee;
    padding: 8px 12px;
    width: 100%;
    font-size: inherit;
    font-family: inherit;
    outline: none;
    box-shadow: none;
    background: #fff;
}

/* Options */
.SumoSelect > .optWrapper > .options li.opt {
    padding: 8px 12px;
    cursor: pointer;
    font-size: inherit;
}

.SumoSelect > .optWrapper > .options li.opt:hover,
.SumoSelect > .optWrapper > .options li.opt.sel {
    background: var(--rwc-secondary, #f0e6f5);
    color: inherit;
}

.SumoSelect > .optWrapper > .options li.opt.sel {
    font-weight: 600;
}

/* No results */
.SumoSelect > .optWrapper > .options li.no-match {
    padding: 8px 12px;
    color: #aaa;
    font-style: italic;
}
