.ui_dropdown {
  position: relative;
}

.ui_dropdown_menu {
  position: absolute;
  z-index: 50;
  top: calc(100% + 8px);
  right: 0;
  width: 190px;
  padding: 7px;
  border: 1px solid var(--ui_color_border);
  border-radius: var(--ui_radius_md);
  background: var(--ui_color_surface_raised);
  box-shadow: var(--ui_shadow_md);
}

.ui_dropdown_menu[hidden] {
  display: none;
}

.ui_dropdown_item {
  appearance: none;
  display: block;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: var(--ui_radius_sm);
  background: transparent;
  color: var(--ui_color_text);
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.ui_dropdown_item:hover,
.ui_dropdown_item:focus-visible {
  outline: 0;
  background: var(--ui_color_surface_hover);
}