.board-container {
  @apply w-full h-full rounded shadow bg-background-base-50 flex-row-center justify-between transition-all;

  &:hover {
    filter: brightness(0.95);
    @apply transition-all;
  }
}

.sub-container{
  @apply rounded shadow flex flex-row items-center;
}

.flex-row-center {
  @apply flex flex-row items-center;
}

.all-center {
  @apply flex justify-center items-center;
}

#moreButton {
  @apply p-1 transition-all;

  &:hover {
    @apply transition-all bg-background-300;
  }
}

.tagItem {
  @apply border-[1px] text-center mx-4 rounded-full transition-all flex flex-row items-center justify-between mb-2 flex-grow relative;

  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis !important;

  button#tagButton {
    @apply text-[0.8rem] h-full py-1 pe-6 ps-2;

    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  button#more {
    @apply hidden transition-all absolute right-2 h-[80%];
  }

  &:hover {

    @apply bg-background-200 transition-all;

    button#more {
      @apply flex transition-all;

      &:hover {
        filter: brightness(0.95);
        @apply bg-background-300 rounded;
      }
    }
  }
}
