.dropdown-menu {
  anchor-name: --dropdown-trigger;
  anchor-scope: --dropdown-trigger;
}

.dropdown-menu__trigger:hover {
  background-color: var(--color--grayscale--01-opacity);
}

.dropdown-menu__content {
  width: min-content;

  position: fixed;
  position-anchor: --dropdown-trigger;
  top: calc(anchor(bottom) + var(--space--xx-small));
  left: anchor(right);
  z-index: var(--z-index--ceiling);
  margin: 0;
  padding: var(--space--x-small);
  translate: -100% 0;

  background-color: var(--color--background-light);
  border: var(--border--light);
  box-shadow: var(--shadow-01);
}

/*
  Position the dropdown menu of the last row in the table above the trigger
  element to avoid clipping
*/
.list-row:last-child .dropdown-menu__content {
  top: auto;
  bottom: calc(anchor(top) + var(--space--xx-small));
}
