.NestedDropdown {
    position: static;
}

.NestedDropdown-toggleButton:hover,
.NestedDropdown-toggleButton:focus {
    background-color: var(--surface-list-item-hover);
    color: var(--neutral-black-14);
}

.NestedDropdown.selected,
.NestedDropdown.selected .NestedDropdown-toggleButton {
    background-color: var(--surface-list-item-selected-dark);
    color: var(--text-inverse);
}

.dropdown-menu:has(.NestedDropdown-submenu),
.NestedDropdown-submenu {
    /* AR: To line up the nested dropdown ul with the parent, the two uls have to overlap slightly. These border-color and border-width changes keep the overlapped uls lined up. */
    border: 1px solid #ccc;
}

.dropdown-menu:has(.NestedDropdown-submenu.show) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.NestedDropdown-submenu.show {
    display: flex;
    flex-direction: column;
    margin-top: -1px;
    margin-left: -1px;
    top: 0;
    left: 100%;
    min-height: calc(100% + 2px);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.NestedDropdown-toggleButtonContent {
    padding-right: 26px;
    width: 100%;
}

.NestedDropdown-toggleIcon {
    line-height: 1.5;
}