@import '~scss/variables';
@import '~scss/mixins';

.wrapper {
  position: relative;
  display: flex;
}

.text {
  flex: 1;
  & > div:first-child {
    @include TypographyTitleH6($dark-color07);
  }

  & > div:last-child {
    @include TypographyParagraph($dark-color01);
  }
}

.ellipsis {
  flex: 1;
  overflow: hidden;

  .text {
    flex: 1;
    overflow: hidden;

    & > div {
      @include ellipsis;
    }
  }
}

.icon {
  margin-right: 12px;
}

.clickable {
  cursor: pointer;

  &:hover {
    .text {
      & > div {
        color: $primary;
      }
    }
    .icon {
      :global .kubed-icon {
        color: #00aa72;
        fill: #90e0c5;
      }
    }
  }
}
