@import "pack/seed-this/__index";
@import "../../mixins/linkStyles";

.c-ChatTranscriptItem {
  @import "../../configs/color";
  @import "../../resets/base";
  $block: this();
  $colorMuted: _color(grey, 800);
  position: relative;
  margin-bottom: 20px;

  &__header {
    margin-bottom: 5px;
  }

  &__contentWrapper {
    position: relative;
  }

  &__content {
    font-size: 14px;
    // Link
    a {
      @include linkStyles;
    }
  }

  &__createdAt,
  &__privateNote {
    color: $colorMuted;
  }

  &__attachmentList {
    margin-top: 10px;
  }

  // Types
  &.is-note {
    $bdrWidth: 3px;
    padding-top: 2px;

    &:before {
      background-color: _color(yellow, 500);
      border-radius: 9999px;
      content: "";
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: $bdrWidth;
    }

    #{$block}__contentWrapper {
      margin-left: 10px + $bdrWidth;
    }
  }
}