.wps-content-analytics {
  display: flex;
  gap: 8px;
  flex-direction: column;
  @media (min-width: 759px) {
    flex-direction: row;
  }

  #wps-postbox-container-1 {
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
    @media(min-width: 759px) {
      width: 304px
    }
  }

  #wps-postbox-container-2 {
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    @media(min-width: 759px) {
      width: calc(100% - 308px);
      float: none;
    }
  }

  .wps-card {
    padding: 24px;
    gap: 24px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #DADCE0;

    &__sums {
      gap: 24px;
      display: flex;
      flex-direction: column;

      &.wps-card__sums--two-row {
        .wps-card__summary {
          flex-wrap: wrap;
          gap: 24px;

          & > div {
            flex: 1 1 calc(50% - 24px);
            min-width: calc(50% - 24px);
            width: calc(50% - 24px);

            &.wps-card__summary--total-avg {
              align-items: flex-end;
              span:last-child{
                width: 120px;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
                display: block;
                text-align: right;
                .rtl &{
                  text-align: left;
                }
              }
            }
            &.wps-card__summary--total span:first-child{
              color: #5100fd !important;
            }
          }
        }
      }
    }

    &__title {
      h2 {
        margin: 0;
        color: #0C0C0D;
        font-size: 14px;
        font-weight: 500;
        line-height: 16.41px;
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 0;
      }
      p {
        font-size: 12px;
        font-weight: 400;
        line-height: 14.06px;
        color: #56585A;
        margin-top: 0;
        margin-bottom: 20px;
      }

      .wps-tooltip {
        display: flex;

        .wps-tooltip-icon.info {
          background-image: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE1IiBoZWlnaHQ9IjE0IiB2aWV3Qm94PSIwIDAgMTUgMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik03LjQ5OTY3IDAuMzQzNzVDMy44MTc2NyAwLjM0Mzc1IDAuODMzMDA4IDMuMzI4NDIgMC44MzMwMDggNy4wMTA0MkMwLjgzMzAwOCAxMC42OTI0IDMuODE3NjcgMTMuNjc3MSA3LjQ5OTY3IDEzLjY3NzFDMTEuMTgxNyAxMy42NzcxIDE0LjE2NjMgMTAuNjkyNCAxNC4xNjYzIDcuMDEwNDJDMTQuMTY2MyAzLjMyODQyIDExLjE4MTcgMC4zNDM3NSA3LjQ5OTY3IDAuMzQzNzVaTTcuNDk5NjcgMS42NzcwOEM4LjkxNDE2IDEuNjc3MDggMTAuMjcwNyAyLjIzODk5IDExLjI3MDkgMy4yMzkxOEMxMi4yNzExIDQuMjM5MzcgMTIuODMzIDUuNTk1OTMgMTIuODMzIDcuMDEwNDJDMTIuODMzIDguNDI0OSAxMi4yNzExIDkuNzgxNDYgMTEuMjcwOSAxMC43ODE3QzEwLjI3MDcgMTEuNzgxOCA4LjkxNDE2IDEyLjM0MzcgNy40OTk2NyAxMi4zNDM3QzYuMDg1MTkgMTIuMzQzNyA0LjcyODYzIDExLjc4MTggMy43Mjg0NCAxMC43ODE3QzIuNzI4MjQgOS43ODE0NiAyLjE2NjM0IDguNDI0OSAyLjE2NjM0IDcuMDEwNDJDMi4xNjYzNCA1LjU5NTkzIDIuNzI4MjQgNC4yMzkzNyAzLjcyODQ0IDMuMjM5MThDNC43Mjg2MyAyLjIzODk5IDYuMDg1MTkgMS42NzcwOCA3LjQ5OTY3IDEuNjc3MDhaTTcuNDk5NjcgMy42NzcwOEM3LjMyMjg2IDMuNjc3MDggNy4xNTMyOSAzLjc0NzMyIDcuMDI4MjcgMy44NzIzNUM2LjkwMzI1IDMuOTk3MzcgNi44MzMwMSA0LjE2Njk0IDYuODMzMDEgNC4zNDM3NUM2LjgzMzAxIDQuNTIwNTYgNi45MDMyNSA0LjY5MDEzIDcuMDI4MjcgNC44MTUxNUM3LjE1MzI5IDQuOTQwMTggNy4zMjI4NiA1LjAxMDQyIDcuNDk5NjcgNS4wMTA0MkM3LjY3NjQ5IDUuMDEwNDIgNy44NDYwNiA0Ljk0MDE4IDcuOTcxMDggNC44MTUxNUM4LjA5NjEgNC42OTAxMyA4LjE2NjM0IDQuNTIwNTYgOC4xNjYzNCA0LjM0Mzc1QzguMTY2MzQgNC4xNjY5NCA4LjA5NjEgMy45OTczNyA3Ljk3MTA4IDMuODcyMzVDNy44NDYwNiAzLjc0NzMyIDcuNjc2NDkgMy42NzcwOCA3LjQ5OTY3IDMuNjc3MDhaTTYuODMzMDEgNS42NzcwOEM2LjY1NjIgNS42NzcwOCA2LjQ4NjYzIDUuNzQ3MzIgNi4zNjE2IDUuODcyMzVDNi4yMzY1OCA1Ljk5NzM3IDYuMTY2MzQgNi4xNjY5NCA2LjE2NjM0IDYuMzQzNzVDNi4xNjYzNCA2LjY2NTA4IDYuNDA1NjcgNi45MDUwOCA2LjcwNzY3IDYuOTY5MDhMNi4zMTIzNCA4Ljg4NTA4QzYuMTU3NjcgOS42NTkwOCA2LjcxMTAxIDEwLjM0MzcgNy40OTkwMSAxMC4zNDM3SDguMTY1NjdDOC4zNDI0OSAxMC4zNDM3IDguNTEyMDUgMTAuMjczNSA4LjYzNzA4IDEwLjE0ODVDOC43NjIxIDEwLjAyMzUgOC44MzIzNCA5Ljg1Mzg5IDguODMyMzQgOS42NzcwOEM4LjgzMjM0IDkuNTAwMjcgOC43NjIxIDkuMzMwNyA4LjYzNzA4IDkuMjA1NjhDOC41MTIwNSA5LjA4MDY1IDguMzQyNDkgOS4wMTA0MiA4LjE2NTY3IDkuMDEwNDJINy42NDU2N0w4LjE0NTY3IDYuNDY5MDhDOC4xNjU3NiA2LjM3MzE0IDguMTY0MTMgNi4yNzM5MSA4LjE0MDkgNi4xNzg2OEM4LjExNzY4IDYuMDgzNDQgOC4wNzM0NSA1Ljk5NDYgOC4wMTE0NSA1LjkxODY3QzcuOTQ5NDYgNS44NDI3NCA3Ljg3MTI2IDUuNzgxNjQgNy43ODI1OSA1LjczOTg0QzcuNjkzOTMgNS42OTgwNCA3LjU5NzAzIDUuNjc2NTkgNy40OTkwMSA1LjY3NzA4SDYuODMzMDFaIiBmaWxsPSIjNTY1ODVBIi8+Cjwvc3ZnPgo=");
        }
      }

    }

    .wps-content-category {
      margin-bottom: 0!important;

      .wps-content-tabs__content{
        height: unset!important;

        .wps-count{
          margin-right: 3px;
          display: inline-block;

          .rtl &{
            margin-left: 3px;
            margin-right: unset;
          }
        }
      }
    }

    .wps-card__summary {
      display: flex;
      justify-content: space-between;
      flex-direction: row;

      div:first-child span:first-child {
        color: #5100FD !important;
      }

      div {
        display: flex;
        flex-direction: column;
        gap: 2px;

        &.wps-card__summary--avg{
          align-items: flex-end;
          span:last-child{
            width: 120px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            display: block;
            text-align: right;

            .rtl &{
              text-align: left;
            }
          }
        }

        span:first-child {
          font-size: 25px;
          font-weight: 600;
          line-height: 29.3px;
          display: block;
          color: #0C0C0D;
        }

        span:last-child {
          font-size: 11px;
          font-weight: 500;
          line-height: 12.89px;
          letter-spacing: 0.01em;
          color: #56585A;
          text-wrap: nowrap;
        }
      }
    }
  }

  #performance-chart, #performance-chart-single {
    height: 299px !important;
    width: 100% !important;
    margin-top: 24px;
  }

  .c-footer {
    display: flex;
    justify-content: flex-end;
    padding: 0;

    &__more__link {
      font-size: 12px;
      font-weight: 500;
      line-height: 14.06px;
      display: flex;
      gap: 8px;
      align-items: center;
      &:hover:after{
        filter: grayscale(1);
      }
      &:after {
        content: '';
        width: 16px;
        height: 16px;
        display: inline-block;
        background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE3IiBoZWlnaHQ9IjE3IiB2aWV3Qm94PSIwIDAgMTcgMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF83ODMwXzM0MzIpIj4KPHBhdGggZD0iTTEwLjExMTggMy43MTI4OUw5LjM5OTEyIDQuNDI1NjFMMTIuNTcwNiA3LjU5NzFMMC41IDcuNjAxMDdWOC42MDUwNUgxMi41NzA2TDkuMzk5MTIgMTEuNzc2NUwxMC4xMTE4IDEyLjQ4OTJMMTQuNSA4LjEwMTA1TDEwLjExMTggMy43MTI4OVoiIGZpbGw9IiM0MDRCRjIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF83ODMwXzM0MzIiPgo8cmVjdCB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjUgMC4xMDE1NjIpIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==") center center/contain no-repeat;

        .rtl & {
          transform: rotate(180deg);
        }
      }
    }
  }

  .wps-flex-container {
    margin-left: -24px;
    margin-right: -24px;
    flex-direction: column;
    display: flex;

    .wps-flex-half:first-child .wps-content-tabs {
      border-bottom: 1px solid #DADCE0;
      margin-bottom: 0;
      padding-bottom: 20px;
      @media (min-width: 1192px) {
        border-right: 1px solid #DADCE0;
        border-bottom: 0;
        margin-bottom: 20px;
        padding-bottom: 0;
      }
    }


    .wps-content-tabs {
      margin-top: 20px;
      margin-bottom: 20px;

      & > label:first-of-type {
        margin-left: 15px;
      }

      & > label:last-of-type {
        margin-right: 15px;
      }
    }

    @media (min-width: 1192px) {
      flex-direction: row;
      .wps-flex-half {
        flex: 1;
      }
      .wps-content-tabs {
        & > label:first-of-type {
          margin-left: 24px;
        }
      }
    }
  }

  .wps-content-tabs {
    display: flex;
    flex-wrap: wrap;

    label {
      order: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
      transition: background ease 0.3s;
      font-size: 13px;
      font-weight: 500;
      line-height: 24px;
      text-align: left;
      color: #5F636C !important;
      padding: 0 6px 6px;
      @media (min-width: 376px) {
        padding: 0 12px 6px;
      }
    }

    .wps-content-tabs__content {
      order: 9;
      flex-grow: 1;
      width: 100%;
      height: 100%;
      display: none;
      background: #fff;
      padding-top: 20px;
    }

    input[type="radio"] {
      display: none;
    }

    input[type="radio"]:checked + label {
      color: #0C0C0D !important;
      border-bottom: 1px solid #404BF2
    }

    .wps-content-tabs__item {
      display: flex;
      gap: 8px;
      padding: 5px 24px;

      img {
        width: 39px;
        height: 39px;
        border-radius: 50%;
        display: inline-block;
        overflow: hidden;
      }

      &--image {
        position: relative;

        svg {
          width: 39px;
          height: 39px;
          border-radius: 50%;
        }

        span {
          position: absolute;
          color: #fff;
          width: 39px;
          height: 39px;
          border-radius: 50%;
          justify-content: center;
          align-items: center;
          font-size: 16px;
          font-weight: 400;
          line-height: 18.75px;
          background: #1f192dcc;
          display: none;
        }
      }

      &--content {
        display: flex;
        flex-direction: column;
        padding: 5px 0;
        gap: 3px;

        span {
          display: block;
          font-size: 12px;
          font-weight: 400;
          line-height: 14.06px;
          color: #56585A;
        }

        h3 {
          margin: 0;

          span {
            font-size: 14px;
            font-weight: 400;
            line-height: 16.41px;
            color: #0C0C0D;

            word-break: break-word;
          }
        }
      }

      &:hover {
        background: #EEEFF1;

        h3 span {
          color: #404BF2;
        }

        .wps-content-tabs__item--image span {
          display: flex;
        }
      }
    }

    input[type="radio"]:checked + label + .wps-content-tabs__content {
      display: block;
    }
  }

  td .wps-ellipsis-parent {
    max-width: 250px;
  }

  .wps-ellipsis-parent {
    display: table;
    table-layout: fixed;
    width: 100%;

    .wps-ellipsis-text {
      display: table-cell;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }
  }

  &-header {
    display: flex;
    gap: 12px;
    margin-top: -10px;
    &__title{
      h2{
        font-size: 15px;
        font-weight: 500;
        line-height: 22px;
        color: #0C0C0D;

      }
      a{
        margin-left: 8px;
        .rtl &{
          margin-left: unset;
          margin-right: 8px;
        }
      }
    }


    @media(max-width: 500px){
      flex-direction: column;

      .wps_title{
        font-size: 1.4em;
      }
    }

    img ,div>svg {
      width: 77px;
      height: 80px;
      border-radius: 8px;
    }

    &__info {
      display: flex;
      gap: 12px;
      align-items: center;
      margin-bottom: 6px;
      margin-top: 8px;
      @media(max-width: 450px){
        flex-direction: column;
        align-items: flex-start;
      }

      .wps-content-analytics-header__type {
        padding: 4px 8px;
        gap: 10px;
        border-radius: 4px;
        background: #1961401A;
        font-size: 14px;
        font-weight: 500;
        line-height: 16.41px;
        color: #196140;
      }

      .wps-content-analytics-header__date {
        &_published, &_updated{
          font-size: 14px;
          font-weight: 400;
          line-height: 16.41px;
          color: #363739;
          padding-right: 12px;
          padding-left: 12px;
          border-right: 1px solid #EEEFF1;
          border-left: 1px solid #EEEFF1;

          @media(max-width: 450px){
            border:0!important;
            padding: 0!important;
          }
        }
        &_updated{
          border-left: 0;
          padding-left: 0;
          span{
            color:#56585A
          }
        }

      }

      .wps-content-analytics-header__author a {
        font-size: 14px;
        font-weight: 400;
        line-height: 16.41px;
        color: #56585A;
        text-decoration: underline;
        &:hover{
          color: #404bf2;
        }
      }
    }

    &__tags {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: wrap;

      a {
        padding: 4px 8px;
        background: #404BF21A;
        border-radius: 4px;
      }
    }
  }
}