/*
 * Comments disclosure triangle
 */

.comments-details {
  & > summary {
    @include font-size(1);
    color: $base-a;
    margin: 16px 0;
    white-space: nowrap;
    cursor: pointer;
  }

  & > summary:hover,
  & > summary:focus {
    &, & > .suffix {
      color: $base-a7;
    }
  }

  & > summary > .count {
    font-weight: bold;
  }

  & > summary > .count::before {
    @include ion-icon('md-chatboxes');
    color: $base-a;
    font-size: 24px;
    margin: 0 8px;
  }

  & > summary > .suffix {
    color: $base-mute;
  }
}