  .menu {
    @apply relative;
  }

  .menu__content {
    @apply absolute z-[100] rounded-lg bg-white flex flex-col py-2;
    box-shadow: 0px 15px 99px rgba(13, 24, 41, 0.15);
  }

  .menu__content--top-right {
    @apply top-0 right-0 transform -translate-y-full -mt-1;
  }

  .menu__content--top-left {
    @apply top-0 left-0 transform -translate-y-full -mt-1;
  }

  .menu__content--bottom-right {
    @apply bottom-0 right-0 transform translate-y-full -mb-1;
  }

  .menu__content--bottom-left {
    @apply bottom-0 left-0 transform translate-y-full -mb-1;
  }

  .menu:not(.menu--open) > .menu__overlay,
  .menu:not(.menu--open) > .menu__content {
    @apply hidden;
  }

  .menu.menu--open > .menu__overlay {
    @apply fixed z-[90] inset-0;
  }

  .menu-item {
    @apply w-full flex space-x-3 px-5 py-2 items-center hover:bg-gray-100 focus:bg-gray-100 whitespace-nowrap;
  }

  .menu-item:disabled {
    @apply pointer-events-none opacity-50;
  }

  .menu-item--disabled {
    @apply pointer-events-none opacity-50;
  }