.tag-container {
  @apply flex flex-wrap mb-md;
  .tag {
    @apply bg-grey-mid rounded-2xl pt-sm pb-sm flex justify-between items-center;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 14px;
    margin-left: 2px;
    height: 2rem;
    margin-top: 1rem;
    .text {
      padding-right: 5px;
      max-width: calc( 100% - 24px );
      height: 22px;
      overflow: hidden;
      text-overflow: clip;
    }

    &:hover {
      @apply cursor-pointer;

      .close {
        fill: black;
      }
    }
  }
}