@layer components {
  [data-coco][data-component="app-menu-button"] {
    @apply contents;

    &[data-fit="full"] {
      @apply w-full;

      .menu-trigger {
        @apply w-full;
      }
    }

    [data-component="menu"] {
      @apply rounded-md;
    }

    .menu-item {
      &:first-child > * {
        @apply rounded-t-md;
      }

      &:last-child > * {
        @apply rounded-b-md;
      }
    }
  }
}