@import "thredded";

#thredded--container {
  #q /* search input */ {
    height: 37px;
    padding-left: 16px;
  }

  .thredded--navigation-breadcrumbs {
    overflow: hidden;
    max-height: 60px;
  }

  .thredded--user-navigation {
    height: 70px;

    margin-top: 10px;
    margin-right: 10px;

    .thredded--user-navigation--item a {
      padding: 0;
    }
  }

  .thredded--currently-online {
    right: 100px;
    max-height: 80%;
    overflow-y: hidden;
    overflow-x: hidden;
    border: 1px solid lightgrey;
  }

  .thredded--currently-online.thredded--is-expanded {
    overflow-y: auto;
    overflow-x: hidden;
  }

  .thredded--new-topic-form {
    background: white;
    padding: 10px;
    padding-bottom: 0;
    border: 1px solid lightgrey;

    margin-bottom: 20px;
  }

  .thredded--topics--topic {
    background: white;
    padding: 4px 26px;
    border: 1px solid lightgrey;

    margin-bottom: 0.7rem;
  }

  .thredded--topics--posts-count {
    left: -1rem;
    top: 2px;
  }

  .thredded--topics--follow-icon {
    right: 0.2rem;
    top: 6px;
  }

  .thredded--pagination {
    background: white;
    padding: 0 0 10px 0;
  }

  .thredded--topic .thredded--post {
    background: white;
    padding: 10px;

    margin-bottom: 20px;
    border-bottom: 1px solid lightgrey;
  }

  @media (min-width: 47.12501rem) {
    .thredded--post--avatar {
      top: 0;
    }
  }

  .thredded--messageboard {
    background: white;
    border-bottom: 1px solid lightgrey;
    margin: 2px;
  }
}

.thredded--main-header {
  nav {
    background: white;
    padding: 0 10px;

    margin-bottom: 100px;
  }
}

.thredded--main-container {
  // The padding and max-width are handled by the app's container.
  min-width: 80%;
  padding: 0;
  @include thredded-media-tablet-and-up {
    padding: 0;
  }
}

.thredded--form {
  input[type="checkbox"] {
    position: relative !important;
    opacity: 1 !important;
    pointer-events: inherit !important;
  }
}

.thredded--messageboard--byline {
  i.material-icons {
    font-size: 0.9em;
    color: grey;
  }
}

.thredded--post--content {
  ul {
    list-style-type: inherit !important;
    padding-left: 40px !important;

    li {
      list-style-type: disc !important;
    }
  }
  ol {
    list-style-type: inherit !important;
    padding-left: 40px !important;

    li {
      list-style-type: decimal !important;
    }
  }
}

.muted-thredded-post {
  color: #616161;
  background-color: #f5f5f5 !important;
  border-bottom: 0 !important;
}

.thredded--post {
  .card-content {
    padding: 0 !important;
    padding-top: 5px !important;
  }
}
