/*
 * blog-single.scss
 * -----------------------------------------------
*/
body.single-post {
  .main-content-area {
    article {
      margin-bottom: 0;
      border-bottom: none;
      .entry-meta {
        padding: 0;
        margin-top: 60px;
        margin-bottom: 0;
        li {
          position: relative;
          padding-right: 8px;
          a {
            font-weight: normal;
          }
          i {
            margin: 0 5px 0 0;
            vertical-align: baseline;
          }
          i, .sl-wrapper .sl-icon svg {
            color: var(--theme-color1);
          }
          .sl-wrapper .sl-icon svg {
            &:hover {
              color: var(--hover-theme-color);
            }
          }
          &:first-child:after {
            display: none;
          }
          &:last-child {
            padding-right: 0;
          }
        }
      }
      .entry-header {
        .post-thumb {
          @include box-shadow( 0px 0px 50px rgba(5, 5, 5, 0.18) );
          margin-bottom: 25px;
          border-radius: 5px;
          overflow: hidden;
          display: inline-block;
        }
      }
      .entry-title {
        margin-top: 0;
      }
      .entry-content {
        h1, h2, h3, h4, h5, h6,
        .h1, .h2, .h3, .h4, .h5, .h6 {
          margin-top: 30px;
          &:first-child {
            margin-top: 0;
          }
        }
        .post-content,
        .post-excerpt {
          a:not(.btn):not(.styled-icons-item):not(.wp-block-button__link), p a:not(.btn):not(.styled-icons-item):not(.wp-block-button__link) {
          }
        }
      }
      &.format-link {
        position: relative;
        .entry-header {
          padding: 90px 30px;
          background-color: #fdfdfd;
          text-align: center;
          border: 1px solid rgba(222, 222, 222, 0.3);
          margin-bottom: 30px;
          border-radius: 5px;
          @include box-shadow( 0 3px 15px rgba(25, 41, 66, 0.04) inset );
          a {
            font-size: $h4-font-size;
            color: $headings-color;
            @include transition(all 0.3s ease);
            span {
              color: #999;
              display: block;
              font-size: 1rem;
              margin-top: 15px;
            }
          }
          .post-excerpt {
            margin-bottom: 5px;
            p {
              margin-bottom: 5px;
              a {
              }
            }
          }
        }
        &:after {
          content: "";
          background: url('../images/blog/link.png') no-repeat;
          opacity: 0.10;
          position: absolute;

          right: 0;
          top: 10px;
          margin: 0 auto;
          left: 0;

          width: 100px;
          height: 100px;
          @include transition(all .3s ease-in-out);
        }
      }
      &.format-quote {
        position: relative;
        .post-excerpt {
          margin-bottom: 0;
        }
        .entry-header {
          padding: 90px 30px;
          background-color: #fdfdfd;
          text-align: center;
          border: 1px solid rgba(222, 222, 222, 0.3);
          margin-bottom: 30px;
          border-radius: 5px;
          @include box-shadow( 0 3px 15px rgba(25, 41, 66, 0.04) inset );
          blockquote {
            border: 0;
            padding: 0;
            margin: 0;
            background:none;
            &:before {
              display: none;
            }
            p {
              font-size: $h4-font-size;
              color: $headings-color;
              margin-bottom: 5px;
              span {
                color: #999;
                display: block;
                font-size: 1rem;
                margin-top: 15px;
              }
            }
            cite {
              font-size: 1rem;
              font-family: $body-font;
              margin-top: 20px;
              a {
                color: var(--theme-color1);
              }
            }
          }
        }
        &:after {
          content: "";
          background: url('../images/blog/quote.png') no-repeat;
          opacity: 0.10;
          position: absolute;

          right: 0;
          top: 10px;
          margin: 0 auto;
          left: 0;

          width: 100px;
          height: 100px;
          @include transition(all .3s ease-in-out);
        }
      }
      &.format-gallery {
        .entry-header {
          .post-thumb {
            display: block;
            .owl-nav {
              position: unset;
              button {
                border-radius: 0;
                position: absolute;
                margin: 0;
                opacity: 0.3;
                &.owl-prev, &.owl-next {
                  background: #fff;
                  border-radius: 0;
                  color: var(--theme-color1);
                  padding: 10px;
                  width: 30px;
                  height: 65px;
                  opacity: 1;
                  top: 50%;
                  transform: translateY(-50%);
                  &:hover {
                    background: var(--theme-color1);
                    color: var(--text-color-bg-theme-color1);
                  }
                }
                &.owl-prev {
                  left: 0;
                }

                &.owl-next {
                  right: 0;
                  left: auto;
                }
              }
            }
            &:hover {
              .owl-nav {
                > button {
                  &.owl-prev {
                    //left: 20px;
                  }
                  &.owl-next {
                    //right: 20px;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .single-post-tags-share {
    border-top: 1px solid #ececec;
    border-bottom: 1px solid #ececec;
    padding: 20px 0;
    margin-top: 55px;
    margin-left: 0;
    margin-right: 0;
    > div {
      @include media-breakpoint-up(xl) {
        max-width: 100%;
      }
      &.max-width-half {
        @include media-breakpoint-up(xl) {
          max-width: 50%;
        }
      }
      &:first-child {
        padding-left: 0;
        padding-right: 0;
        @include media-breakpoint-down(xl) {
          margin-bottom: 20px;
        }
      }
      &:last-child {
        padding-left: 0;
        padding-right: 0;
        @include media-breakpoint-down(xl) {
          margin-bottom: 0;
        }
      }
    }
  }

  .single-post-tags {
    margin: 0;
    span {
      color: $headings-color;
      font-size: 1rem;
      font-family: $heading-font;
      font-weight: $headings-font-weight-h4;
      line-height: $headings-line-height-smaller;
    }
    li:not(:first-child) {
      margin: 5px 7px 11px 0;
    }
    a {
      border-radius: 30px;
      font-size: 0.8rem;
      padding: 10px 16px;
      text-transform: capitalize;
      color: var(--text-color-bg-theme-color1);
      background-size: 200% auto;
      text-shadow: 0px 0px 10px rgba(0,0,0,0.2);
      &:hover {
      }
    }
  }
  .pre-next-post-link {
    margin-top: 60px;
    vertical-align: middle;
    .pre-post-link,
    .next-post-link {
      cursor: pointer;
      display: table;
      height: 100%;
      position: relative;
      width: 100%;
      > * {
        display: table-cell;
        height: 100%;
        position: relative;
        vertical-align: middle;
      }
      .title {
        margin-top: 0;
        margin-bottom: 0;
        font-style: italic;
        color: #9a9a9a;
        font-size: $font-size-sm;
      }
      .content {
        font-size: $font-size-lg;
        word-break: break-all;
        a {
          font-size: 1rem;
          font-family: $heading-font;
          font-weight: $headings-font-weight-h4;
          line-height: $headings-line-height-smaller;
        }
      }
      span {
        color: #f5f5f5;
        font-size: 130px;
        line-height: 0;
        padding-top: 15px;
        @include transition( all .4s ease 0s);
      }
      &:hover {
        a {
          color: var(--hover-theme-color);
        }
        span {
          color: #ddd;
        }
      }
      .link {
        margin-bottom: 0;
        margin-top: 0;
      }
    }
    .next-post-link {
      text-align: right;
    }
  }
  .author-info {
    background: #f8f8f8;
    border: 1px solid #f5f5f5;
    margin-top: 60px;
    padding: 40px;
    .author-thumb {
      float: left;
      margin-right: 30px;
      img {
        border-radius: 50%;
      }
    }
    .author-description {
      margin-left: 110px;
      .author-title {
        margin-bottom: 0;
        margin-top: 0;
        .author-title-label {
          display: none;
          font-weight: $body-font-bold;
        }
        a {
        }
      }
      .author-email {
        font-size: 14px;
        a {
          color: #a1a1a1;
          font-weight: normal;
        }
      }
      .author-text {
        p {
          margin-top: 10px;
          margin-bottom: 0;
        }
      }
    }
    @include media-breakpoint-down(md) {
      .author-thumb {
        float: none;
      }
      .author-description {
        margin-left: 0;
        .author-title {
          margin-top: 15px;
          margin-bottom: 7px;
        }
      }
    }
  }
  .related-posts {
    margin-top: 60px;
    .title {
      margin-bottom: 20px;
      font-weight: $body-font-bold;
      text-transform: uppercase;
    }
    article {
      background-color: #fefefe;
      @include box-shadow( 0px 0px 50px rgba(5, 5, 5, 0.08) );
      .entry-header {
        .post-thumb {
          margin-bottom: 0;
        }
      }
      .entry-content {
        padding: 20px;
      }
      .entry-date {
        color: #999;
        font-size: $font-size-sm;
      }
      .post-excerpt {
        font-size: $font-size-sm;
        margin-bottom: 10px;
      }
      .entry-meta {
        padding: 5px 0;
        margin-bottom: 0;
        margin-top: 0;
      }
      .post-btn-readmore {
        font-size: 11px;
        font-weight: $body-font-bold;
        text-transform: uppercase;
      }
    }
  }
}
body.single-post.single-post .related-posts article .entry-title {
  margin-bottom: 0;
  margin-top: 10px;
}
.post-single .entry-content p:last-of-type {
}

body.single-post {
  .post-single.drop-caps {
    .entry-content {
      .post-content,
      .post-excerpt {
        > p:first-child:first-letter {
          color: $black-222;
          float: left;
          font-size: 75px;
          line-height: 0.85;
          padding-top: 4px;
          padding-right: 8px;
          padding-left: 0;
        }
      }
    }
  }
}

body.single-post {
  .comments-no-password {
    margin-top: 1rem;
  }
  .no-comments, .comments-no-password {
    background-color: var(--theme-color1);
    color: var(--text-color-bg-theme-color1);
    .close {
      color: var(--text-color-bg-theme-color1);
    }
  }
}
.comments-area {
  margin-top: 60px;
  .comments-title {
    .title {
      margin-bottom: 0;
      margin-top: 0;
    }
    p {
      display: none;
    }
  }

  .comment-list { 
    margin: 0 0 60px;
    border-bottom: 1px solid #eee;
    .comment,
    .pingback, .trackback {
      border-top: 1px solid #eee;
      background: #fff;
      @include box-shadow( 0px 0px 50px rgba(5, 5, 5, 0.08) );
      padding: 30px 30px 30px;
      margin-top: 30px;
      margin-bottom: 0;
      list-style: none;
      .comment,
      .pingback, .trackback {
        padding-left: 20px;
        padding-right: 0;
        box-shadow: none;
      }
      .children {
        margin: 20px 0 0 20px;
        > li {
          padding-bottom: 0;
          margin-bottom: 0;
        }
      }
      
      .comment-item-wrapper {
        position: relative;
        @include media-breakpoint-up(md) {
          padding-left: 110px;
        }
        .comment-thumb {
          @include media-breakpoint-down(md) {
            margin-bottom: 20px;
          }
          img {
            border-radius: 50%;
            @include media-breakpoint-up(md) {
              position: absolute;
              top: 0;
              left: 0;
            }
          }
        }
        .comment-body {
          display: block;
          padding: 0;
          width: auto;

          .comment-reply-link {
            .list-inline-item {
              margin-right: 0;
              @include media-breakpoint-up(sm) {
                padding-left: 15px;
              }
              @include media-breakpoint-down(sm) {
                padding-left: 0;
                padding-right: 15px;
              }
            }
            .comment-edit-link, 
            .comment-reply-link {
              font-size: 1rem;
              font-weight: normal;
              color: var(--theme-color2);
              &:hover {
                color: var(--hover-theme-color);
              }
            }
          }

          .comment-author-name {
            margin-top: 0;
            margin-bottom: 0;
            text-transform: capitalize;
            a {
              @include transition(all .2s ease-in-out);
              &:hover {
                text-decoration: underline;
              }
            }
          }
          .comment-metadata {
            margin-bottom: 25px;
            a {
              font-size: 0.95rem;
              color: #a1a1a1;
              font-weight: normal;
              &:hover {
                color: var(--hover-theme-color);
              }
            }
          }
          .comment-content {
            p {
              margin-bottom: 30px;
              &:last-of-type {
                margin-bottom: 0;
              }
            }
            ul, ol {
              padding-left: 10px;
            }
            > ul > li, > ol > li {
              padding-left: 0;
            }
          }
        }
      }
    }
    .pingback, .trackback {
      .comment-body {
        a {
          color: $headings-color;
          &:hover {
            color: var(--hover-theme-color);
          }
        }
        .edit-link a {
          font-size: 1rem;
        }
      }
    }

    @include media-breakpoint-down(lg) {
      .comment,
      .pingback, .trackback {
        .children {
          margin: 5px 0 0 5px;
        }
      }
    }
    @include media-breakpoint-down(md) {
      .comment,
      .pingback, .trackback {
        .children {
          margin: 0;
          .comment,
          .pingback, .trackback {
            padding-left: 5px;
          }
        }
      }
    }
    @include media-breakpoint-down(sm) {
    }
  }

  .comment-respond {
    margin: 30px 0 0 0;
    padding-left: 15px;
    width: 100%;
    padding-right: 15px;
    .comment-reply-title {
      margin-bottom: 20px;
      text-transform: capitalize;
      #cancel-comment-reply-link {
        font-size: 0.85rem;
        text-transform: capitalize;
        margin-left: 10px;
        color: var(--theme-color2);
        &:hover {
          color: var(--hover-theme-color);
        }
      }
    }
    .comment-form {
      margin-bottom: 0;
      .logged-in-as, .comment-notes {
        color: #888;
        a {
          color: #888;
          font-weight: normal;
          &:hover {
            color: var(--hover-theme-color);
          }
        }
      }
      .form-submit {
        margin-bottom: 0;
        input[type="submit"] {
          margin-top: 15px;
        }
      }
      .form-control {
        height: form-control-height();
        &:focus {
          background-color: #fff;
        }
      }
      textarea.form-control {
        height: auto;
      }
    }
    .form-group {
      label {
        display: none;
        font-size: 14px;
      }
      .required {
        display: none;
      }
    }
  }
  > .comment-respond {
    padding-left: 0;
    padding-right: 0;
  }

  .comment-form-cookies-consent {
    label {
      color: #aaa;
      display: inline;
      font-weight: normal;
    }
    #wp-comment-cookies-consent {
      margin-right: 0.6rem;
    }
  }
}

.post-password-form {
  margin-bottom: 20px;
  label {
    display: block;
    margin-bottom: 0;
  }
  input[type="password"] {
    margin-bottom: 7px !important;
  }
  > :last-child {
    margin-bottom: 0;
  }
}
body.single-post {
  .post-password-form {
    label {
      display: inline-block;
    }
    input[type="password"] {
      margin-bottom: 0 !important;
    }
    input[type="submit"] {
      margin-top: -3px;
    }
  }
}

.page-links {
  clear: both;
  padding: 20px 0 20px;
  display: flex;
  align-items: center;
  a,
  > span {
    border: 0;
    border-radius: 50%;
    font-size: 15px;
    line-height: 1.9;
    width: 40px;
    height: 40px;
    padding: 3px 10px;
    margin-right: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  > span {
    color: #fff;
    background-color: #222;
  }

  a {
    background-color: #f4f5f8;
    border-color: #ddd;
    color: #222;
    &:hover,
    &:focus {
      background-color: #222;
      border-color: transparent;
      color: #fff;
      text-decoration: none;
    }
  }
  > .page-links-title {
    border: 0;
    background: none;
    color: #1a1a1a;
    height: auto;
    margin: 0 7px 0 0;
    padding: 0;
    width: auto;
  }
}

.gallery {
  margin-bottom: 30px;
  .isotope-item {
    display: inline-block;
    padding: 1.79104477%;
    text-align: center;
    vertical-align: top;
    width: 100%;
    margin: 0;
  }
  &.gallery-columns-2 .isotope-item {
    max-width: 50%;
  }
  &.gallery-columns-3 .isotope-item {
    max-width: 33.33%;
  }
  &.gallery-columns-4 .isotope-item {
    max-width: 25%;
  }
  &.gallery-columns-5 .isotope-item {
    max-width: 20%;
  }
  &.gallery-columns-6 .isotope-item {
    max-width: 16.66%;
  }
  &.gallery-columns-7 .isotope-item {
    max-width: 14.28%;
  }
  &.gallery-columns-8 .isotope-item {
    max-width: 12.5%;
  }
  &.gallery-columns-9 .isotope-item {
    max-width: 11.11%;
  }
  .gallery-icon img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
  }
  .gallery-caption {
    color: #707070;
    color: rgba(51, 51, 51, 0.7);
    display: block;
    font-size: 0.95rem;
    line-height: 1.5;
    padding: 0.5em 0;
  }
  &.gallery-columns-6 .gallery-caption, 
  &.gallery-columns-7 .gallery-caption, 
  &.gallery-columns-8 .gallery-caption, 
  &.gallery-columns-9 .gallery-caption {
    //display: none;
  }
}

.video-player-wrapper {
  video {
    width: 100% !important;
  }
}

.tm-social-share-icons {
  @include media-breakpoint-up(xl) {
    text-align:right;
  }
  .title {
    display: inline-block;
    margin-right: 10px;
    font-size: 1rem;
    font-family: $heading-font;
    color: $headings-color;
    font-weight: $headings-font-weight-h4;
    line-height: $headings-line-height-smaller;
    i {
      color: var(--theme-color1);
    }
  }
  .styled-icons {
    display: inline-block;
    margin-bottom: 0;
    a {
      float: none;
    }
  }
  .social-share-icons-text {
    display: inline-block;
  }
}