.topic {
  position: relative;
  >.post-bar{
    border-bottom: none;
  }
  .alkun-hide-toPid{
    display: none;
  }
  .posts .post-bar{
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
  }

  .posts{
    li[component="post"]{
      .alkun-item.alkun-views {
        display: none;
      }
      .alkun-topic-reply-btn{
        display: none;
      }
       .alkun-post-reply-btn{
        display: block;
      }
      .post-footer div[component="post/replies"] {
        .alkun-hide-toPid{
          display: block;
        }
        .alkun-item.alkun-views {
          display: none;
        }
        .alkun-topic-reply-btn{
          display: none;
        }
         .alkun-post-reply-btn{
          display: block;
        }
      }

    }
    // 主题帖的范围
    li[component="post"]:first-child {
      border-bottom: none;
      .alkun-item.alkun-views{
        display: block;
      }
      .alkun-topic-reply-btn{
        display: block;
      }
       .alkun-post-reply-btn{
        display: none;
      }
      .alkun-pullright{
        display: none;
      }
    }
  }


  .alkun-container{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    .alkun-item{
      margin-right: 24px;
      a.alkun-btn{
        color: #6c757d;
        display: flex;
        justify-items: center;
        .alkun-item-count{
          font-size: 18px;
          vertical-align: super;
          margin-left: 4px;
        }
        .fa-thumbs-up{
          display: none;
        }
        .fa-thumbs-o-up{
          display: block;
        }
        .fa-thumbs-down{
          display: none;
        }
        .fa-thumbs-o-down{
          display: block;
        }
        &.upvoted{
          .fa-thumbs-up{
            display: block;
          }
          .fa-thumbs-o-up{
            display: none;
          }
        }
        &.downvoted{
          .fa-thumbs-down{
            display: block;
          }
          .fa-thumbs-o-down{
            display: none;
          }
        }

      }
    }
    .alkun-item.alkun-views{
      display: none;
    }
  }


  .content {
    margin-left: 0;
    margin-top: -32px;
    font-size: 16px;
    line-height: 28.8px;
    padding-left: 60px;

    blockquote {
      padding: 0 0 0 20px;
      line-height: 25px;
      font-size: 14px;
      p {
        font-size: 14px;
      }
    }
    p,li,h1,h2,h3,h4,h5,h6,h7 {
      text-transform: inherit;
      line-height: 28.8px;
      font-size: 16px;
      margin-block-start: 22.4px;
      margin-block-end: 22.4px;
      margin-inline-start: 0;
      margin-inline-end: 0;
      margin-top: 22.4px;
      a {
        font-size: 16px;
        img {
          margin: 22.4px auto;
          &.img-responsive {            
            display: block;
            margin: 22.4px auto;
            max-height: 600px;
          }
        }
      }
    }
    h1 {
      font-size: 36px;
      line-height: 36px;
    }
    h2 {
      font-size: 30px;
      line-height: 30px;
    }
    h3 {
      font-size: 24px;
      line-height: 24px;
    }
    h4 {
      font-size: 18px;
      line-height: 18px;
    }
    h5 {
      font-size: 14px;
      line-height: 14px;
    }
    h6 {
      font-size: 12px;
      line-height: 12px;
    }
    a {
        font-size: 16px;
        img {
          margin: 22.4px auto;
          &.img-responsive {
            display: block;
            margin: 22.4px auto;
            max-height: 600px;
          }
        }
      }
  }
  li[component="post"]{
    border-bottom: 1px solid #eee;
  }
  .posts {
    .content {
      margin-left: 0;
      margin-top: -32px;
      font-size: 16px;
      line-height: 28.8px;
      padding-left: 60px;
      // padding-left: 30px;
      // @media (max-width: @screen-sm-max) {
      //   padding-left: 20px;
      // }

      blockquote {
        padding: 0 0 0 20px;
        line-height: 25px;
        font-size: 14px;
        p {
          font-size: 14px;
        }
      }
      p,li,h1,h2,h3,h4,h5,h6,h7 {
        line-height: 28.8px;
        font-size: 16px;
        margin-block-start: 22.4px;
        margin-block-end: 22.4px;
        margin-inline-start: 0;
        margin-inline-end: 0;
        margin-top: 22.4px;
        a {
          font-size: 16px;
          img {
            margin: 22.4px auto;
            &.img-responsive {
              display: block;
              margin: 22.4px auto;
              max-height: 600px;
            }
          }
        }
      }
      h1 {
        font-size: 36px;
        line-height: 36px;
      }
      h2 {
        font-size: 30px;
        line-height: 30px;
      }
      h3 {
        font-size: 24px;
        line-height: 24px;
      }
      h4 {
        font-size: 18px;
        line-height: 18px;
      }
      h5 {
        font-size: 14px;
        line-height: 14px;
      }
      h6 {
        font-size: 12px;
        line-height: 12px;
      }
      a {
        font-size: 16px;
        img {
          margin: 22.4px auto;
          &.img-responsive {
            display: block;
            margin: 22.4px auto;
            max-height: 600px;
          }
        }
      }
    }
    .post-header {
      display: flex;
      align-items: center;
      .icon {
        min-height: 50px;
        min-width: 50px;
        img {
          height: 50px;
          width: 50px;
        }

        @media (max-width: @screen-sm-max) {
          .avatar {
            width: 40px;
            height: 40px;
            img {
              height: 40px;
              width: 40px;
            }
          }
        }
      }
      small {
        font-size: 18px;
        @media (max-width: @screen-sm-max) {
          font-size: 14px;
        }

        &.group-label {
          vertical-align: -6px;
        }
      }
    }

    .post-footer { 
      padding-bottom: 10px; 
        img {
          &.img-responsive {
            max-height: 200px;
          }
        }
    }
  }

  [component="post/reply-count"] {
    margin-left: 32px;
  }
  .alkun-stats{
    span{
      display: inline-block;
    }
  }
  .alkun-sort{
    .btn {
      padding: 2px 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 150px;
      border-radius: 20px;
    }
  }
}

[component="category/topic"] {
  position: relative;
}

.back-to-top {
  height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  font-size: 24px;
  position: fixed;
  right: 40px;
  bottom: 80px;
  z-index: 9999;

  i {
    margin-bottom: -20px;
  }
  
  span {
    font-size: 12px;
  }
}

// .bx-controls.bx-has-controls-direction {
//     display: none;
// }