$moderator-note-bg: var(--v2-colors-grey-100);
$moderator-note-body: var(--v2-colors-mono-500);
$moderator-note-dot: var(--v2-colors-mono-100);
$moderator-note-username: var(--v2-colors-mono-900);

.root {
}

.body {
  font-family: var(--v2-font-family-primary);
  font-size: var(--v2-font-size-3);
  font-weight: var(--v2-font-weight-primary-regular);
  line-height: var(--v2-line-height-body-short);
  background-color: $moderator-note-bg;
  border-radius: 4px;
  padding: var(--v2-spacing-3);
  color: $moderator-note-body;
  margin-bottom: var(--v2-spacing-2);
}

.bodyType {
}

.leftBy {
  font-family: var(--v2-font-family-primary);
  font-size: var(--v2-font-size-2);
  font-weight: var(--v2-font-weight-primary-regular);
  line-height: var(--v2-line-height-reset);
  padding-left: var(--v2-spacing-4);
  padding-right: var(--v2-spacing-1);
  position: relative;
  color: $moderator-note-body;
}

.leftBy:before {
  content: "";
  width: 4px;
  height: 4px;
  background-color: ;
  position: absolute;
  border-radius: 50%;
  left: var(--v2-spacing-1);
  background-color: $moderator-note-dot;
  top: 50%;
}

.username {
  font-family: var(--v2-font-family-secondary);
  font-weight: var(--v2-font-weight-secondary-bold);
  line-height: var(--v2-line-height-reset);
  font-size: var(--v2-font-size-3);
  color: $moderator-note-username;
}

.footerLeft {
  padding-left: var(--v2-spacing-3);
}
