/*
 * Comments disclosure triangle
 */

.comments-details {
  & > summary {
    margin-bottom: 16px;
    white-space: nowrap;
    cursor: pointer;
    color: $base-text;
  }

  & > summary::after {
    content: '';
    display: block;
    background: linear-gradient(to right, $dark-line-color 50%, transparent);
    margin-top: 16px;
    height: 1px;
  }

  & > summary:hover,
  & > summary:focus {
    color: $base-a;
  }

  & > summary > strong {
    @include font-size(1);
    font-weight: normal;
  }

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