// В этом файле должны быть стили для БЭМ-блока comment, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority

.comment {
  margin-top: $typo-margin-vertical;
  margin-bottom: $typo-margin-vertical;

  @media (min-width: $screen-md) {

    & & {
      padding-left: calc(60px + 1em);
    }

    & & & & { // stylelint-disable-line  selector-max-compound-selectors, selector-max-class, selector-max-combinators
      padding-left: 0;
    }
  }

  &__inner {
    display: flex;
  }

  &__avatar-wrap {
    flex-shrink: 0;
    margin-right: 1em;

    img {
      display: block;
      width: 60px;
      height: 60px;
      object-fit: cover;
    }
  }

  &__text {
    flex-grow: 1;

    *:first-child {
      margin-top: 0;
    }
  }

  &__header {}

  &__body {

    & > *:last-child { // stylelint-disable-line  selector-combinator-blacklist
      margin-bottom: 0;
    }
  }

  &__footer {}
}
