//
// Posts List Event
// --------------------------------------------------


// Event style
.posts-list .event {
  margin-bottom: @line-height-computed;

  color: @text-muted;

  .media {
    margin-top: @line-height-computed / 4;
  }
}


// Event label
.posts-list .event-label {
  .label-unread {
    background-color: @brand-success;

    color: #fff;
  }
}

// Event icon
.posts-list .event .text-right {
  padding-right: 0px;

  text-align: right;

  .material-icon {
    margin-right: -12px;

    height: @event-icon-size;
    width: @event-icon-size;

    font-size: @event-icon-size;
    line-height: @event-icon-size;

    text-align: center;
  }
}


// Align event content with post's content
.posts-list .event .text-left {
  padding-left: 24px;
}


// Event first and second rows
.posts-list .event .event-message {
  margin-bottom: @line-height-computed / 4;

  font-size: @font-size-large;
}

.posts-list .event .event-info {
  margin: 0px;

  font-size: @font-size-small;

  li {
    margin-right: @padding-base-horizontal;

    &:last-child {
      margin-right: 0px;
    }
  }
}


// Event controls
.posts-list .event .event-controls {
  .btn-link {
    border: 0px;
    margin: 0px;
    margin-right: @padding-base-horizontal;
    padding: 0px;

    font-size: @font-size-small;

    &:last-child {
      margin-right: 0px;
    }
  }
}


// Mobile tweaks
@media screen and (max-width: @screen-xs-max) {
  .posts-list .event .text-right {
    width: @event-icon-size;

    text-align: right;
  }

  .posts-list .event .text-left:first-child {
    padding-left: 0px;
  }

  .posts-list .event .event-info {
    margin-top: @line-height-computed / 4;
  }

  .posts-list .event .event-controls {
    clear: both;
    margin-top: @line-height-computed / 4;

    .btn-link {
      margin-right: @line-height-computed;

      font-size: @font-size-base;

      &:last-child {
        margin-right: 0px;
      }
    }
  }
}