.product-card {
  .card__inner {
    &:hover {
      border-color: $blue;
    }
  }

  .card__actions {
    margin-top: 0;
  }

  .card__action-link {
    font-weight: 500;
  }

  .color-slider-container {
    width: 160px;
  }

  .main-price {
    display: flex;
    flex-direction: column;
    width: 100%;

    &__value {
      width: auto;
      margin-right: 6px;
      white-space: nowrap;
    }

    &__vat {
      font-size: .75rem;
      font-weight: 500;
    }
  }
}

.product-card__content {
  padding: 10px 15px 0;
}

.product-card__description {
  padding: 10px 15px 0;

  .card_offer_text {
    color: $red;
  }
}

.product-card__description.no-flex {
  flex: 0;
}

.product-card__title {
  margin-bottom: 10px;
  color: $blue;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.25rem;

  &:hover {
    color: $blue;
  }
}

.product-card__reviews {
  color: $warm-grey;
  font-size: .75rem;
  line-height: 16px;
  margin-top: 10px;

  + .card__descr {
    margin-top: 10px;
  }

  .product-rating {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 1em;

    .rating-bg {
      color: $gray;
      position: relative;
      padding-right: 5px;
    }

    .rating-overlay {
      color: $yellow;
      position: absolute;
      left: 0;
      top: 0;

    }

    .star-overlay {
      display: inline-block;
      margin-right: 2px;
      overflow: hidden;
    }
  }

  .skeleton.is-loading {
    margin: 0;
    width: 172px;

    .ssc-line {
      border-radius: 0;

      &:first-child {
        height: 22px;
        width: 138px;
      }

      &:last-child {
        margin-top: 5px;
        height: 17px;
      }
    }
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .product-card__reviews {

    .product-rating {

      .rating-bg {
        display: block;
      }

      .rating-overlay {
        height: 14px;
        display: block;
      }
    }
  }

  .product-card__description {
    &.no-flex {
      flex: none;
    }
  }
}

.product-card__price {
  margin: 10px 15px;
}

.product-card__additional-promo,
.product-card__additional-price {
  margin-top: 10px;
}

.product-card__lower-quantity {
  color: $red;
  font-weight: bold;
}

.product-card__bad-quantity {
  color: $red;
}

.product-card__price-value {
  color: $blue-dark;
  font-size: 1.625rem;
  font-weight: bold;
  line-height: 36px;

  .product-card__price-from {
    font-size: .7em;
    margin-right: 4px;
  }

  .product-card__price_sale & {
    color: $red;
  }

  .product-card__price_out-of-stock & {
    color: $warm-grey;
  }
}

.product-card__price__old-price,
.product-card__price__out-of-stock {
  color: $warm-grey;
  font-weight: 500;
  line-height: 14px;
}

.product-card__price__old-price {
  text-decoration: line-through;

  s {
    text-decoration-color: $line-through;
  }
}

.product-card__colors {
  margin-top: 10px;
}

.product-card__price-descr {
  @include info-text;
}

.product-card__extra-info {
  margin: 10px 15px;
  text-align: center;
  flex: 1 0 auto;

  @include media-breakpoint-down(sm) {
    width: calc(100% - 40px);
    float: left;
  }

  .out-of-stock-container {
    margin-right: 0;
    padding-right: 0;

    .out-of-stock {
      border: 1px solid $gray-dark;
      border-right: 0;
      border-radius: 3px 0 0 3px;
      cursor: default;
      width: 100%;
      @include media-breakpoint-down(lg) {
        padding: 8px 1px;
      }
    }
  }

  .notify-container {
    margin-left: 0;
    padding-left: 0;

    .notify-btn {
      background-color: $green;
      width: 100%;
      color: $white;
      border-radius: 0 3px 3px 0;
    }
  }
}

@include media-breakpoint-up(xl) {
  .product-card {
    .main-price {
      flex-direction: row;
      align-items: baseline;
    }
  }
}
