#wps-postbox-container-1 {
  width: 367px;
  float: left;
}

#wps-postbox-container-2 {
  width: calc(100% - 383px);
  float: right;
}


@media screen and (max-width: 758px) {
  #wps-postbox-container-1 {
    width: 100%;
  }

  #wps-postbox-container-2 {
    margin: 0 0 0 1%;
    width: 100%;
  }
}


#wps-postbox-container-1 a, #wps-postbox-container-2 a, #wps-big-postbox a {
  text-decoration: none;
}


.column-wp-statistics-post-hits ,.column-wp-statistics-tax-hits{
  width: 12%;

  .wps-column__chart{
    span{
      display: none!important;
    }
    &.wps-hide{
      display: none;
    }
  }
  canvas{
    //height: 35px!important;
    margin: 0 auto 3px;
  }

  div:not(.wps-column__chart){
    &>span{
      font-size: 12px;
      font-style: italic;
      font-weight: 400;
      line-height: 14.06px;
      margin-right: 1px;
      color: #838494;
      display: inline-block;

      &.wps-hide{
        display: none;
      }

      .rtl &{
        margin-right: 0px;
        margin-left: 1px;
      }
    }
    &>a{
      font-size: 12px;
      user-select: none;
      font-weight: 500;
      line-height: 14.06px;
      &:focus{
        box-shadow: none;
      }
    }
    &.wps-hide{
      display: none;
    }
  }
}
.wps-admin-mini-chart__unlock{
  th#wp-statistics-post-hits{
    width: 90px!important;
  }
}

.wps-admin-column__unlock {
     &-count{
      width: 52px;
      display: block;
      text-align: center;
      margin-top: 3px;
    }

  a {
    color: #ffffff;
    font-size: 12px;
    display: flex;
    justify-content: center;
    position: relative;
    box-shadow:none!important;
    align-items: center;
    width: 52px;
    transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);

    span.wps-admin-column__unlock__text {
      position: absolute;
      visibility: hidden;
      z-index: 1;
      font-size: 10px;
      font-weight: 500;
      text-align: center;
      color: #22537A;
      width: 52px;
      height: 20px;
      display: flex;
      justify-content: center;
      align-items: flex-end;
      opacity: 0;
      user-select: none;
      transition: opacity .5s cubic-bezier(0.65, 0, 0.35, 1), visibility 0s .5s;
    }
    .wps-admin-column__unlock__img{
      width:34.5px;
      height: 20px;
      display: inline-block;
      transition: opacity .5s cubic-bezier(0.65, 0, 0.35, 1), visibility 0s 0s;
      background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjM1IiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMzUgMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIG9wYWNpdHk9IjAuMSI+CjxwYXRoIGQ9Ik0wLjUgMTAuNUMwLjUgOS42NzE1NyAxLjE3MTU3IDkgMiA5QzIuODI4NDMgOSAzLjUgOS42NzE1NyAzLjUgMTAuNVYyMEgwLjVWMTAuNVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGcgb3BhY2l0eT0iMC4wOSI+CjxwYXRoIGQ9Ik01IDEyLjVDNSAxMS42NzE2IDUuNjcxNTcgMTEgNi41IDExQzcuMzI4NDMgMTEgOCAxMS42NzE2IDggMTIuNVYyMEg1VjEyLjVaIiBmaWxsPSJibGFjayIvPgo8L2c+CjxnIG9wYWNpdHk9IjAuMDgiPgo8cGF0aCBkPSJNOS41IDkuNUM5LjUgOC42NzE1NyAxMC4xNzE2IDggMTEgOEMxMS44Mjg0IDggMTIuNSA4LjY3MTU3IDEyLjUgOS41VjIwSDkuNVY5LjVaIiBmaWxsPSJibGFjayIvPgo8L2c+CjxnIG9wYWNpdHk9IjAuMDciPgo8cGF0aCBkPSJNMTQgMTUuNUMxNCAxNC42NzE2IDE0LjY3MTYgMTQgMTUuNSAxNEMxNi4zMjg0IDE0IDE3IDE0LjY3MTYgMTcgMTUuNVYyMEgxNFYxNS41WiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8ZyBvcGFjaXR5PSIwLjA1Ij4KPHBhdGggZD0iTTE4LjUgMTEuNUMxOC41IDEwLjY3MTYgMTkuMTcxNiAxMCAyMCAxMEMyMC44Mjg0IDEwIDIxLjUgMTAuNjcxNiAyMS41IDExLjVWMjBIMTguNVYxMS41WiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8ZyBvcGFjaXR5PSIwLjA0Ij4KPHBhdGggZD0iTTIzIDkuNUMyMyA4LjY3MTU3IDIzLjY3MTYgOCAyNC41IDhDMjUuMzI4NCA4IDI2IDguNjcxNTcgMjYgOS41VjIwSDIzVjkuNVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGcgb3BhY2l0eT0iMC4wMyI+CjxwYXRoIGQ9Ik0yNy41IDExLjVDMjcuNSAxMC42NzE2IDI4LjE3MTYgMTAgMjkgMTBDMjkuODI4NCAxMCAzMC41IDEwLjY3MTYgMzAuNSAxMS41VjIwSDI3LjVWMTEuNVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGcgb3BhY2l0eT0iMC4wMSI+CjxwYXRoIGQ9Ik0zMiAxMi41QzMyIDExLjY3MTYgMzIuNjcxNiAxMSAzMy41IDExQzM0LjMyODQgMTEgMzUgMTEuNjcxNiAzNSAxMi41VjIwSDMyVjEyLjVaIiBmaWxsPSJibGFjayIvPgo8L2c+Cjwvc3ZnPgo=") center center no-repeat;
      opacity: 1;
      visibility: visible;
     }
  }

  a:hover{
    span.wps-admin-column__unlock__text {
      visibility: visible;
      opacity: 1;
      transition: opacity .5s cubic-bezier(0.65, 0, 0.35, 1), visibility 0s 0s;
    }
    .wps-admin-column__unlock__img{
      visibility: hidden;
      opacity: 0;
      transition: opacity .5s cubic-bezier(0.65, 0, 0.35, 1), visibility 0s .5s;
    }
  }

  a:not(:hover) span.wps-admin-column__unlock__text {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s cubic-bezier(0.65, 0, 0.35, .7), visibility 0s .5s;
  }

  a:not(:hover) .wps-admin-column__unlock__img {
    opacity: 1;
    visibility: visible;
    transition: opacity .5s cubic-bezier(0.65, 0, 0.35, 1), visibility 0s 0s;
  }

}
td:has(div.wps-admin-column__unlock){
  width: 90px!important;
  div{
    width: 90px!important;
  }
}

.wps-premium-box {

  &-feature {
    display: flex;
    margin-bottom: 12px;
    margin-top: 12px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 32px;
    border-radius: 8px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(64, 75, 242);
    border-image: initial;
    background: rgb(255, 255, 255);

    &__head {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      margin-bottom: 32px;
      gap: 16px;

      h1 {
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        color: rgb(12, 12, 13);
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 0px;
        margin: 0px;
        gap: 4px;
        white-space: nowrap;

        span {
          color: rgb(64, 75, 242);
        }
      }

      p {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: rgb(86, 88, 90);
        margin: 0px;
      }
    }

    a.button-primary {
      margin: 0 auto;
      padding: 8px 16px 8px 41px!important;
      border-radius: 4px !important;
      font-size: 14px;
      font-weight: 700 !important;
      line-height: 22px !important;
      background-size: 15px;
      background-repeat: no-repeat;
      background-color: #404bf2;
      background-position: center left 16px;
      background-image: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE1IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTUgMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04Ljc1IDMuMjczNDRDOS41OTEzOCAzLjI3MzQ0IDEwLjI3MzQgMi41OTEzNyAxMC4yNzM0IDEuNzVIMTAuOTc2NkMxMC45NzY2IDIuNTkxMzcgMTEuNjU4NiAzLjI3MzQ0IDEyLjUgMy4yNzM0NFYzLjk3NjU2QzExLjY1ODYgMy45NzY1NiAxMC45NzY2IDQuNjU4NjMgMTAuOTc2NiA1LjVIMTAuMjczNEMxMC4yNzM0IDQuNjU4NjMgOS41OTEzOCAzLjk3NjU2IDguNzUgMy45NzY1NlYzLjI3MzQ0Wk0wLjYyNSA3LjM3NUMyLjY5NjA3IDcuMzc1IDQuMzc1IDUuNjk2MDcgNC4zNzUgMy42MjVINS42MjVDNS42MjUgNS42OTYwNyA3LjMwMzk0IDcuMzc1IDkuMzc1IDcuMzc1VjguNjI1QzcuMzAzOTQgOC42MjUgNS42MjUgMTAuMzAzOSA1LjYyNSAxMi4zNzVINC4zNzVDNC4zNzUgMTAuMzAzOSAyLjY5NjA3IDguNjI1IDAuNjI1IDguNjI1VjcuMzc1Wk0xMC43ODEyIDkuMjVDMTAuNzgxMiAxMC4zNzE4IDkuODcxODEgMTEuMjgxMiA4Ljc1IDExLjI4MTJWMTIuMjE4N0M5Ljg3MTgxIDEyLjIxODcgMTAuNzgxMiAxMy4xMjgyIDEwLjc4MTIgMTQuMjVIMTEuNzE4OEMxMS43MTg4IDEzLjEyODIgMTIuNjI4MiAxMi4yMTg3IDEzLjc1IDEyLjIxODdWMTEuMjgxMkMxMi42MjgyIDExLjI4MTIgMTEuNzE4OCAxMC4zNzE4IDExLjcxODggOS4yNUgxMC43ODEyWiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);

      .rtl &{
        padding: 8px 41px 8px 16px!important;
        background-position: center right 16px;
      }

      &:hover, &:focus, &:active {
        background-size: 15px;
        background-repeat: no-repeat;
        background-position: center left 16px;
        background-color: #1e27bf;
        background-image: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE1IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTUgMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04Ljc1IDMuMjczNDRDOS41OTEzOCAzLjI3MzQ0IDEwLjI3MzQgMi41OTEzNyAxMC4yNzM0IDEuNzVIMTAuOTc2NkMxMC45NzY2IDIuNTkxMzcgMTEuNjU4NiAzLjI3MzQ0IDEyLjUgMy4yNzM0NFYzLjk3NjU2QzExLjY1ODYgMy45NzY1NiAxMC45NzY2IDQuNjU4NjMgMTAuOTc2NiA1LjVIMTAuMjczNEMxMC4yNzM0IDQuNjU4NjMgOS41OTEzOCAzLjk3NjU2IDguNzUgMy45NzY1NlYzLjI3MzQ0Wk0wLjYyNSA3LjM3NUMyLjY5NjA3IDcuMzc1IDQuMzc1IDUuNjk2MDcgNC4zNzUgMy42MjVINS42MjVDNS42MjUgNS42OTYwNyA3LjMwMzk0IDcuMzc1IDkuMzc1IDcuMzc1VjguNjI1QzcuMzAzOTQgOC42MjUgNS42MjUgMTAuMzAzOSA1LjYyNSAxMi4zNzVINC4zNzVDNC4zNzUgMTAuMzAzOSAyLjY5NjA3IDguNjI1IDAuNjI1IDguNjI1VjcuMzc1Wk0xMC43ODEyIDkuMjVDMTAuNzgxMiAxMC4zNzE4IDkuODcxODEgMTEuMjgxMiA4Ljc1IDExLjI4MTJWMTIuMjE4N0M5Ljg3MTgxIDEyLjIxODcgMTAuNzgxMiAxMy4xMjgyIDEwLjc4MTIgMTQuMjVIMTEuNzE4OEMxMS43MTg4IDEzLjEyODIgMTIuNjI4MiAxMi4yMTg3IDEzLjc1IDEyLjIxODdWMTEuMjgxMkMxMi42MjgyIDExLjI4MTIgMTEuNzE4OCAxMC4zNzE4IDExLjcxODggOS4yNUgxMC43ODEyWiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);
      }
    }
  }

  &__items {
    margin-bottom: 24px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    gap: 8px 128px;
  }

  &__item {
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    color: rgb(12, 12, 13);
    min-width: 150px;
    box-sizing: border-box;
    padding-left: 28px;
    position: relative;
    box-sizing: border-box;
    .rtl &{
      padding-left: 0;
      padding-right: 28px;
    }

    @media(min-width: 1270px) {
      min-width: 398px;
    }

    &::before {
      content: "";
      width: 24px;
      height: 24px;
      display: inline-flex;
      position: absolute;
      left: 0px;
      top: 0px;
      background: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE4IiBoZWlnaHQ9IjEzIiB2aWV3Qm94PSIwIDAgMTggMTMiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik02Ljk5OTcgMTAuMTcyOEwxNi4xOTIxIDAuOTgwNDY5TDE3LjYwNjMgMi4zOTQ2OEw2Ljk5OTcgMTMuMDAxMkwwLjYzNTc0MiA2LjYzNzM1TDIuMDQ5OTYgNS4yMjMxNUw2Ljk5OTcgMTAuMTcyOFoiIGZpbGw9IiMxOTYxNDAiLz4KPC9zdmc+Cg==) center center / 16.97px 12.02px no-repeat;

      .rtl &{
        left: unset;
        right: 0px;
      }
    }
  }

  &-image {
    text-align: center;

    img {
      width: 100%;
      margin: 0 auto;
    }
  }

  &__info {
    border-top: 1px solid #dadce0;
    margin-bottom: 16px;
    padding-top: 24px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #0c0c0d;
    text-align: center;
    width: 100%;
  }

}

.wps-premium-link-btn {
  font-weight: bold;
  color: #A03B1F;

  &:hover {
    color: #A03B1F;
  }
}

.wps-category-analytics , #authors-performance , .wps-content-analytics ,.wps-tracker-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 {
      display: flex;
      justify-content: space-between;
      flex-direction: row;



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

        span{
          display: flex;
          justify-content: space-between;
          width: 100%;

          &:last-child {
            width: 120px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            display: block;
            font-size: 11px;
            font-weight: 500;
            line-height: 13.5px;
            letter-spacing: 0.01em;
            color: #56585A;
            text-wrap: nowrap;
          }

          &:first-child {
            font-size: 25px;
            font-weight: 600;
            line-height: 29.3px;
            color: #0C0C0D;
            align-items: flex-end;
            display: flex
          }
        }

        &.wps-card__summary--total , &.wps-card__summary--title{
          span:first-child {
            justify-content: flex-start;
            align-items: flex-start;
            color: #5100FD !important;
          }
        }
        &.wps-card__summary--avg , &.wps-card__summary--total-avg {
          justify-content: flex-end;
          align-items: flex-end;
          span:first-child{
            justify-content: flex-end;
            display: flex
          }
          span:last-child{
            text-align: right;

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

      }
    }

    &__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-flex-container {
  margin-left: -24px;
  margin-right: -24px;
  flex-direction: column;
  display: flex;

  .wps-flex-half:first-child .wps-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;
      .rtl &{
        border-right: unset;
        border-left: 1px solid #DADCE0;
      }
    }
  }


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

    & > label:first-of-type {
      margin-left: 15px;
      .rtl &{
        margin-right: 15px;
        margin-left: 0;
      }
    }

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

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

.wps-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-tabs__content {
    order: 9;
    flex-grow: 1;
    width: 100%;
    display: none;
    background: #fff;
    padding-top: 20px;

    .wps-tooltip-premium{
      background: transparent;

      &:hover{
        background: #F4F4FB;

        .wps-content-tabs__item--content{
          h3 span, span{
            color:#ADB4C1!important;
          }
        }

        .wps-tabs-item img , .wps-tabs-item svg{
          opacity: 10%;
        }
        .wps-content-tabs__item--image span{
          background: transparent;
          z-index: 2;

          a{
            width: 39px;
            height: 39px;
            display: inline-block;
            background-size: 17px;
            background-repeat: no-repeat;
            background-position: center;
            background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkgMS40NDkyMkM0Ljg1MzU3IDEuNDQ5MjIgMS41IDQuODAyNzkgMS41IDguOTQ5MjJDMS41IDEwLjUwMjggMS45NjA3MSAxMS45Mjc4IDIuNzUzNTcgMTMuMTE3MUMzLjkxMDcxIDE0LjgzMTQgNS43NDI4NiAxNi4wNDIxIDcuODc1IDE2LjM1MjhDOC4yMzkyOSAxNi40MTcxIDguNjE0MjkgMTYuNDQ5MiA5IDE2LjQ0OTJDOS4zODU3MSAxNi40NDkyIDkuNzYwNzEgMTYuNDE3MSAxMC4xMjUgMTYuMzUyOEMxMi4yNTcxIDE2LjA0MjEgMTQuMDg5MyAxNC44MzE0IDE1LjI0NjQgMTMuMTE3MUMxNi4wMzkzIDExLjkyNzggMTYuNSAxMC41MDI4IDE2LjUgOC45NDkyMkMxNi41IDQuODAyNzkgMTMuMTQ2NCAxLjQ0OTIyIDkgMS40NDkyMlpNMTIuMjc4NiA4LjcxMzVMMTEuMzg5MyA5LjYwMjc5QzExLjIzOTMgOS43NTI3OSAxMS4xNTM2IDEwLjA0MjEgMTEuMjA3MSAxMC4yNTY0TDExLjQ2NDMgMTEuMzU5OUMxMS42Njc5IDEyLjIyNzggMTEuMjA3MSAxMi41NzA2IDEwLjQzNTcgMTIuMTA5OUw5LjM2NDI5IDExLjQ3NzhDOS4xNzE0MyAxMS4zNTk5IDguODUgMTEuMzU5OSA4LjY1NzE0IDExLjQ3NzhMNy41ODU3MSAxMi4xMDk5QzYuODE0MjkgMTIuNTU5OSA2LjM1MzU3IDEyLjIyNzggNi41NTcxNCAxMS4zNTk5TDYuODE0MjkgMTAuMjU2NEM2Ljg1NzE0IDEwLjA1MjggNi43ODIxNCA5Ljc1Mjc5IDYuNjMyMTQgOS42MDI3OUw1LjcyMTQzIDguNzEzNUM1LjE5NjQzIDguMTg4NSA1LjM2Nzg2IDcuNjYzNSA2LjA5NjQzIDcuNTQ1NjVMNy4yNDI4NiA3LjM1Mjc5QzcuNDM1NzEgNy4zMjA2NSA3LjY2MDcxIDcuMTQ5MjIgNy43NDY0MyA2Ljk3Nzc5TDguMzc4NTcgNS43MTM1QzguNzIxNDMgNS4wMjc3OSA5LjI3ODU3IDUuMDI3NzkgOS42MjE0MyA1LjcxMzVMMTAuMjUzNiA2Ljk3Nzc5QzEwLjMzOTMgNy4xNDkyMiAxMC41NjQzIDcuMzIwNjUgMTAuNzY3OSA3LjM1Mjc5TDExLjkxNDMgNy41NDU2NUMxMi42MzIxIDcuNjYzNSAxMi44MDM2IDguMTg4NSAxMi4yNzg2IDguNzEzNVoiIGZpbGw9IiM1NjU4NUEiLz4KPC9zdmc+Cg==") ;
          }
        }

        .wps-content-tabs__item--content{
          h3 span, span{
            color:#BFC2C9!important;
          }
        }
      }

    }

    .o-wrap--no-data {
      p{
        margin: 0;
      }
    }

  }

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

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



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

.wps-tabs-item {
  display: flex;
  gap: 8px;
  padding: 5px 24px;

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

  .wps-content-tabs__item--image{
    position: relative;
    display: flex;
    align-items: center;

    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;
    }
  }

  .wps-content-tabs__item--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;

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

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

    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;
    }
  }
}