/* Dropdown context menu */
.menu {
  @apply absolute 
    z-20 
    
    right-0 
    mt-1 
    top-full
    
    hidden
    border 
    rounded-lg 
    
    border-line-dimmed 
    bg-main 
    text-content
    
    data-[open]:block  
    
    whitespace-nowrap
    
    max-h-max
    overflow-auto
    text-sm
    min-w-32;

  box-shadow: 0px 4px 6px -2px rgba(0, 0, 9, 0.03),
    0px 12px 16px -4px rgba(0, 0, 9, 0.08);

  &.menu-bl {
    @apply left-0 right-auto;
  }

  &.menu-b {
    @apply left-1/2 right-auto -translate-x-1/2;
  }

  &.menu-tr {
    @apply right-0 left-auto bottom-full top-auto mt-0 mb-1;
  }

  &.menu-tl {
    @apply left-0 right-auto bottom-full top-auto mt-0 mb-1;
  }
}