// TZ Portfolio Default
@import "../../../../../libraries/jollyany/framework/scss/jollyany/modules/tz-portfolio";

.tpBlog {
  .TzItemsRow {
    .TzItem {
      background-color: $white;
    }
    .date-group {
      margin-top: 0;
    }
  }
  >.pagination {
    margin-top: 1.2rem;
    flex-direction: column;
    .TzCounter {
      text-align: center;
    }
  }
}

.tpCategories {
  .tpCategory{
    background-color: $white;
  }
}

.tpItemPage {
  #tz-portfolio-template-text-inner, .tpHead, .tpBody {
    h2,h3,h4,h5,h6 {
      position: relative;
      padding-bottom: 25px;
      margin-bottom: 25px;
      &:after {
        content: '';
        position: absolute;
        left: 0px;
        bottom: 0;
        width: 100%;
        height: 30px;
        background: url(../assets/title-line-image.png) left bottom no-repeat;
      }
    }
    ul {
      list-style: none;
      padding-left: 0;
      li {
        position: relative;
        padding-left: 40px;
        margin-bottom: 12px;
        &:before {
          font-family: FontAwesome;
          content: '\f27e';
          position: absolute;
          left: 5px;
          top: 0px;
          display: block;
          font-size: 18px;
          line-height: 30px;
          color: #b89b5e;
        }
      }
    }
  }
  #tz-portfolio-template-body {
    .pull-left {
      margin: .5em 1.5em .5em 0;
    }
    .pull-right {
      margin: .5em 0 1em 1.5em;
    }
  }
  .tpHead {
    .contact, .profiler-social > span {
      background-color: $white;
      border-radius: 5px;
    }
    .profiler-social {
      i {
        color: $gray-600;
      }
      span {
        &:hover {
          background-color: $colorMain;
          border-color: $colorMain;
          i {
            color: $white;
          }
        }
      }
    }
    margin-bottom: 2rem;
  }

  .tpTitle {
    font-family: 'Lora';
    color: $dark;
    font-weight: bold;
  }
  .inline-style {
    >.row{
      display: block;
      >div {
        flex: auto;
        display: inline-block;
        width: auto;
      }
    }
  }
  .tpArticleMedia {
    margin: 0;
  }
  .pager {
    li a {
      background-color: $colorWhite;
      color: $colorBlack;
    }
  }
  .tpContent {
    background-color: $colorWhite;
    padding: 27px 30px;
    border: 1px solid darken($border-color, 0.02);
  }
  .tpArticleExtraField{
    margin-top: 15px;
    margin-bottom: 20px;
    ul.tpExtraFields{
      margin-bottom: 0;
      list-style: none;
      line-height: 20px;
      text-align: left;
      vertical-align: middle;
      border-top: 1px solid #ddd;
      margin-left: 0;
      padding-left: 0;
      li.tp_extrafield-item{
        border-bottom: 1px solid $border-color;
        padding: 10px 15px;
        div {
          display: inline-block;
        }
        .tp_extrafield-value {
          font-weight: bold;
        }
        .value-list {
          li{
            display: inline-block;
            padding: 0;
            border: none;
            margin-left: 3px;
          }
          li::after {
            content: ",";
          }
          li:last-child::after {
            content: "";
          }
        }
      }
    }
  }
  .charityAddon{
    background-color: lighten($colorMain, 0.02);
    padding: 10px;
    margin: 0 0 1.2rem;
    border-radius: 3px;
    >div {
      margin: 10px 0;
    }
    .modal-header {
      .close {
        position: absolute;
        top: 12px;
        right: 12px;
        background-color: $colorBlack;
        color: $colorWhite;
        font-size: 13px;
      }
    }
    .content-head {
      height: 200px;
      display: block;
      overflow: hidden;
      >img {
        object-fit: cover;
        width: 100%;
        height: 100%;
      }
    }
    .evens {
      .dash {
        border-color: fade_out($colorBlack, 0.9);
        margin-bottom: 0;
      }
      .time_number {
        padding: 5px 12px;
        display: flex;
        justify-content: center;
        color: $colorBlack;
        background-color: lighten($colorMain, 0.05);
      }
      .dash_title {
        border-color: fade_out($colorBlack, 0.9);
        background-color: lighten($colorMain, 0.1);
      }
    }
    .portfolio_cause {
      margin-top: 20px;
      .charity {
        margin-bottom: 0;
      }
    }
    .donate-progress {
      margin-bottom: 8px;
      .item-progress {
        background-color: fade_out($colorWhite, 0.7);
        .child-prgb {
          background-color: $colorWhite;
        }
      }
    }
    h3 {
      font-size: 20px;
    }
    .tz-form-donate {
      .item-input {
        min-width: 60px;
      }
      .item-input.selected {
        color: $colorBlack;
        background: $colorMain;
        border-color: $colorMain;
      }
      .donate-form-text-input {
        max-width: 90px;
      }
      .about-donate {
        .item {
          margin: 0;
          input {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
          }

        }
        .btn {
          min-width: 135px;
          border-top-left-radius: 0;
          border-bottom-left-radius: 0;
        }
      }
      .btn-primary {
        background-color: $colorMain;
        border-color: $colorMain;
        color: $colorBlack;
      }
    }
  }
  .profiler-head .contact {
    .position {
      color: $colorMain;
      font-style: italic;
    }
  }
}
.tplProfiler .element .TzInner .profiler-intro .TzPortfolioDescription {
  .TzPortfolioTitle {
    a {
      color: inherit;
    }
  }
  .position {
    font-size: inherit;
    color: $colorMain;
    font-style: italic;
    text-transform: capitalize;
  }
  .profiler-social {
    i {
      font-size: 1rem;
    }
  }
}