/*========== Category Widget One ==========*/
.jbs-category-widget-one {
  .jbs-card-item {
    flex: 0 0 auto;
    width: 16.66666%;
    @media (max-width: 1024px) {
      width: 25%;
    }
    @media (max-width: 768px) {
      width: 33.33%;
    }
    @media (max-width: 576px) {
      width: 50%;
    }

    .box-info {
      display: block;
      background: var(--bs-white);
      -webkit-border-radius: 60px;
      -moz-border-radius: 60px;
      border-radius: 60px;
      padding: 50px 15px 30px;
      border: 1px solid var(--border_on_white);
      @include transition(0.3s);

      &:hover {
        background: #f5ffcb;
        border-color: #f5ffcb;
        text-decoration: none;
      }

      .icon {
        height: 25px;

        img {
          max-height: 100%;
        }
      }

      .title {
        font-size: 18px;
        color: var(--jbs-heading_color);
        margin: 40px 0 50px;
        transition: 0.3s;
      }

      .total-job {
        transition: 0.3s;
        font-size: 14px;
        color: rgba($color: #09321C, $alpha: 0.6);
      }
    }
  }
}


/*========== Category Widget Two ==========*/
.jbs-category-widget-two {
  .card-wrapper {
    row-gap: 15px;
    column-gap: 15px;
    margin: 0 -5px;

    .jbs-card-item {

      .box-info {
        padding: 16px 38px;
        border-radius: 60px;
        background: #F2F8F4;
        border: 1px solid #F2F8F4;
        @include transition(0.2s);
        &:hover {
          border-color: #35764B;
          background: #fff;
          text-decoration: none;
        }

        .title {
          color: #35764B;
          margin-left: 12px;

          &:hover {
            border-color: #35764B;
            background: #fff;
            text-decoration: none;
          }
        }
      }
    }
  }
}

/*========== Category Widget Three ==========*/
.jbs-category-widget-three {


  .jbs-row {
    row-gap: 30px;
  }

  .jbs-card-item {
    background: #FFFFFF;
    -webkit-box-shadow: 0px 20px 50px rgba(1, 20, 44, 0.0356);
    -moz-box-shadow: 0px 20px 50px rgba(1, 20, 44, 0.0356);
    box-shadow: 0px 20px 50px rgba(1, 20, 44, 0.0356);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;

    &:hover {
      -webkit-transform: translateY(-5px);
      -moz-transform: translateY(-5px);
      -ms-transform: translateY(-5px);
      transform: translateY(-5px);
    }

    a {
      padding: 40px 38px 50px;

      &:hover {
        text-decoration: none !important;
      }
    }

    .icon {
      width: 72px;
      height: 72px;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;
      border: 1px solid #F0F0F0;
    }

    &:hover .icon {
      background: var(--jbs-brand_color_3);
      border-color: transparent;
    }

    .title {
      color: var(--jbs-heading_color);
      margin: 28px 0 25px;
    }

    &:hover .title {
      color: var(--jbs-brand_color_4);

    }

    .total-job {
      transition: 0.3s;
      font-size: 16px;
      color: rgba($color: #09321C, $alpha: 0.4);
    }

    &.jbs-bg-color {
      box-shadow: none;
      background: var(--jbs-brand_color_4);

      a {
        padding: 10px 40px 20px;
      }

      .title {
        font-size: 72px;
        line-height: initial;
        margin: 0 0 5px;

      }

      .icon {
        border-color: #fff;
      }
    }
  }

}

/*========== Job Tabs Widget ==========*/
.jbs-job-tabs-widget {
  .jbs-grid-column-3 {
    margin: 0 -20px;

    .grid-sizer, .isotop-item {
      width: 33.3333%;
      padding: 0 20px;
      @media (max-width: 992px) {
        width: 50%;
      }
      @media (max-width: 576px) {
        width: 100%;
      }
    }
  }
}