$cartbox-sidebar-width: 500px !default;

@import "@css[shared]/components/cartbox/_cartbox-sidebar";

.cartbox-focus-b2b {
   .price-total span, .price-total div span {
      display: none;
   }
}

.cartbox-header {
   border: 0;

   .h3 {
      font-size: 20px;
      font-weight: 600;
   }

   .count {
      width: 24px;
      height: 24px;
      font-size: 16px;
      line-height: 28px;
      position: relative;
      bottom: 2px;
      background: $count;
   }

   button {
      font-weight: 600;
      text-transform: uppercase;
      font-size: 14px;

      .fc {
         margin-left: 9px;

         &::before {
            content: $lightbox_close;
         }
      }
   }
}

.cartbox-product {
   border-bottom: unset;
   background-color: $body-bg-alt-light;
   border-radius: 10px;
   padding: 15px 10px;
   margin-bottom: 10px;

   .product-title {
      font-size: 12px;
   }

   .product-image {
      width: 64px;
      position: relative;
      margin-right: 20px;

      &::before {
         content: "";
         display: block;
         position: absolute;
         top: 0;
         left: 0;
         right: 0;
         bottom: 0;
         background-color: rgba(0, 0, 0, .02);
         opacity: 1;
         transition: opacity .3s ease;
         z-index: 2;
         pointer-events: none;
         border-radius: unset;
      }
   }

   .product-content {
      padding-left: 6px;
   }

   p {
      font-size: $font-size-smaller;
      line-height: $line-height-md;

      span {
         color: $text-muted;
         margin-top: 2px;
      }
   }

   .price-total {
      margin-top: 5px;
      align-items: center;

      .flag {
         border-radius: 5px;
         width: auto;
         height: auto;
         line-height: 21px;
         padding: 2px 7px;
         font-size: 12px;
      }

      div {
         flex-direction: column-reverse;
         align-items: center;
         display: flex;

         strong {
            font-size: $font-size-larger;
            margin-right: 6px;
            //color: $price-color;
         }

         span {
            font-size: $font-size-base;
            font-weight: $font-weight-bold;
         }
      }
   }

   .buy-count-wrapper {
      width: 76px;
      margin-right: 15px;
   }
}

.cartbox-footer {
   .btn-primary {
      background-color: $green-price;
      border-color: $green-price;
      color: $white;
      text-transform: uppercase;
      padding: 15px 10px;
   }

   .price-title {
      border: 0;
      padding: 0;
      color: $text-muted;
   }

   .total-price {
      font-size: 28px;
   }

   .cart-saving {
      color: $state-error;
   }

   .cartbox-shipping-progress-wrapper {
      margin-bottom: 10px;
      border-top: 1px solid $border-color;
      padding-top: 20px;

      .fc {
         font-size: 24px;
         color: $black;
      }
   }

   .cartbox-benefits {
      li {
         margin-bottom: 15px;
         font-weight: $font-weight-bold;
      }
   }

   .back {
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: .12px;
      text-decoration: unset;

      &::before {
         @include fonticon;

         content: $icons_caret-left;
         text-decoration: none;
         font-size: 10px;
         position: relative;
         top: 1px;
         margin-right: 10px;
         color: $pink-alt;
      }
   }
}

.cartbox-custom-scrollbar {
   ::-webkit-scrollbar {
      width: 5px;
   }
}
