/*--------------------------------------------------------------
Ajax Cart
--------------------------------------------------------------*/

#offcanvas-cart {

  // Hide extsting cart-loader in header.php, remove this in v6
  .cart-loader {
    display: none !important;
  }

  .cart-list {
    height: 100%;
  }

  .widget_shopping_cart_content {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  

  // Cart alert
  // Top margin to first alert only. If grouped product one is out of stock there are two alerts.
  .woocommerce-message:first-child,
  .woocommerce-error:first-child {
    margin-top: $modal-inner-padding;
  }

  .woocommerce-message,
  .woocommerce-error {
    margin-right: $modal-inner-padding;
    margin-left: $modal-inner-padding;
  }
}


// Hide button in alert
.alert .button.wc-forward {
  display: none;
}


// Hide View cart in loop and product pages
.woocommerce a.added_to_cart,
a.added_to_cart {
  display: none;
}


// btn-loader, overlayCSS is not an option
.single_add_to_cart_button,
.ajax_add_to_cart {
  position: relative;

  .btn-loader {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    justify-content: center;
    align-items: center;
    background-color: var(--#{$prefix}btn-bg);
    border-radius: var(--#{$prefix}btn-border-radius);
  }

  &.loading {
    .btn-loader {
      display: flex;
    }
  }
}


// Reset default Woo btn loader
.woocommerce {

  #respond input#submit.loading::after,
  a.button.loading::after,
  button.button.loading::after,
  input.button.loading::after,
  #respond input#submit.added::after,
  a.button.added::after,
  button.button.added::after,
  input.button.added::after {
    display: none;
  }

  #respond input#submit.loading,
  a.button.loading,
  button.button.loading,
  input.button.loading {
    opacity: 1;
    padding-left: 0;
    padding-right: 0;
  }

}

.offcanvas-title {
  color: var(--wpstream_woocommerce_cart_font_color, #f9fafb);
}

// MINI CART
.widget_shopping_cart_content {
 
  padding: 0px 30px 0px 30px;
  .m-3{
    margin: 0px!important;
  }
  
  .woocommerce-mini-cart {
    border: 1px solid var(--jet-grey);
    border-radius: 8px;
    
    .mini-cart-header {
      padding: 16px;
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid var(--jet-grey);

      > span {
        font-size: var(--wpstream_woocommerce_cart_font_size, 16px);
        color: var(--wpstream_woocommerce_cart_product_name_color, #f9fafb);

        &:hover {
          background-color: var(--wpstream_woocommerce_cart_product_name_hover_color, --wpstream_woocommerce_cart_font_color);
        }
      }
    }

    .mini_cart_item {
      .amount {
        margin-left: 5px;
        color: var(--green);
      }
    }

    .item-row {
      display: flex;
      justify-content: space-between;
      padding: 16px;
      align-items: center;
      column-gap: 16px;
      border-bottom: 1px solid var(--jet-grey);
      
      .item-name {
        display: flex;

        > strong {
          font-size: var(--wpstream_woocommerce_cart_font_size, 16px);
          color: var(--wpstream_woocommerce_cart_product_name_color, #f9fafb);

          &:hover {
            background: var(--wpstream_woocommerce_cart_product_name_hover_color, --wpstream_woocommerce_cart_font_color);
          }
        }

        .quantity {
          color: var(--wpstream_woocommerce_cart_font_color, #f9fafb);
        }
      }
    }

    &__total {
      display: flex;
      justify-content: space-between;
      margin-bottom: 0;
      border-top: none !important;
      padding: 16px !important;
      font-size: var(--wpstream_woocommerce_cart_font_size, 16px);
      color: var(--wpstream_woocommerce_cart_font_color, #f9fafb);

      > strong {
        color: var(--wpstream_woocommerce_cart_product_name_color, #f9fafb);

        &:hover {
          background: var(--wpstream_woocommerce_cart_product_name_hover_color, --wpstream_woocommerce_cart_font_color);
        }
      }
    }

    &__buttons {
      display: flex;
      flex-direction: row-reverse;
      justify-content: flex-end;
      
      a.button {
        padding: 10px 20px;
        border-width: var(--wpstream-type-2-button-border-width, 0);
        border-style: solid;
        border-color: var(--wpstream-type-2-button-border-color, transparent);
        border-radius: 24px;
        transition: all 300ms ease;
        background: linear-gradient(
            var(--wpstream-type-2-button-background-color-gradient-angle, 90deg),
            var(--wpstream_type_2_button_background_color_gradient_first_color, rgba(78, 46, 229, 1)),
            var(--wpstream_type_2_button_background_color_gradient_second_color, rgba(89, 125, 250, 1))
        );
        color: var(--wpstream-type-2-button-text-color);
        
        &:hover {
          color: var(--bs-body-color);
          background: linear-gradient(
            var(--wpstream-type-2-button-hover_background-color-gradient-angle, 90deg),
            var(--wpstream_type_2_button_hover_background_color_gradient_first_color, rgba(78, 46, 229, 1)),
            var(--wpstream_type_2_button_hover_background_color_gradient_second_color, rgba(89, 125, 250, 1))
          ) !important;
          border: 1px solid var(--wpstream-header-search-border-color, var(--wpstream-header-search-border-color-default));
      
        }
      }
      
      a.button.checkout {
        border-width: var(--wpstream-type-1-button-border-width, 0);
        border-style: solid;
        border-color: var(--wpstream-type-1-button-border-color, transparent);
        background: linear-gradient(
          var(--wpstream-type-1-button-background-color-gradient-angle, 90deg),
          var(--wpstream_type_1_button_background_color_gradient_first_color, rgba(78, 46, 229, 1)),
          var(--wpstream_type_1_button_background_color_gradient_second_color, rgba(89, 125, 250, 1))
        );
        margin-right: 10px;
        color: var(--wpstream-type-1-button-text-color, $anti-flash-white);
        
        &:hover {
          background: linear-gradient(
            var(--wpstream-type-1-button-hover_background-color-gradient-angle, 90deg),
            var(--wpstream_type_1_button_hover_background_color_gradient_first_color, rgba(78, 46, 229, 1)),
            var(--wpstream_type_1_button_hover_background_color_gradient_second_color, rgba(89, 125, 250, 1))
          ) !important;
          color: $anti-flash-white!important;
        }
      }
    }
  }

  .mini-cart-footer {
    margin-top: 16px;

    p {
      font-size: var(--wpstream_woocommerce_cart_font_size, 13px);
      color: var(--wpstream_woocommerce_cart_font_color) !important;
    }
  }
}
