.root {
    display: inline-block;
    position: relative;
    z-index: 1;
    cursor: var(--cursor-pointer);
    height: var(--navbar-height);
    line-height: var(--navbar-height);
    border: none;
    padding: var(--navbar-dropdown-padding);
    font-size: var(--font-size-large);
}

.root:not(:last-child) {
    margin-right: var(--navbar-item-space);
}

.root::after {
    position: absolute;
    icon-font: url('../../i-icon.vue/assets/arrow-down.svg');
    font-size: var(--navbar-dropdown-popper-font-size);
    right: 10px;
    top: 0;
    line-height: var(--navbar-height);
}

.popper {
    background: white;
    font-size: var(--navbar-dropdown-popper-font-size);
    width: 100%;
    line-height: var(--navbar-dropdown-popper-line-height);
}

.root[disabled] {
    cursor: var(--cursor-not-allowed);
    color: var(--navbar-dropdown-color-disabled);
}
