.cartpage {
  flex-direction: column;
  margin-top: 60px;
}

.cartpage-layout {
  --cartpage-layout-side-width: 30%;

  position: relative;
  display: flex;
  gap: 10px;

  align-items: flex-start;
  justify-content: flex-start;


  flex-direction: row;

  width: 100%;
}

.cartpage-cart {
  position: relative;
  display: flex;

  overflow: hidden;
  overflow-x: hidden;

  align-items: flex-start;
  justify-content: flex-start;

  flex-direction: column;

  width: 100%;
}

.cartpage-cart-table {
  position: relative;

  margin: 0;
  padding: 0;
  border: 0;

  width: 100%;

  border-collapse: collapse;
  border-spacing: 0;

  /* border: 1px solid rgba(0, 0, 0, 0.1); */
}

.cartpage-cart-table tr {
  position: relative;
}
.cartpage-cart-table td,
.cartpage-cart-table th {
  position: relative;

  padding: 0;
  padding: 15px 20px;

  font-size: 14px;
}

.cartpage-cart-table th {
  font-size: 14px;
  font-weight: 700;
}
.cartpage-cart-table td {
  font-size: 12px;
  font-weight: 600;

  text-align: center;
}

.cartpage-cart-table thead tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.cartpage-cart-table tbody tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.cartpage-cart-table tbody tr:last-child {
  border-bottom: 0;
}

.cartpage-cart-table-item {
  position: relative;
}

.cartpage-cart-table-item-image {
  position: relative;
  display: flex;

  width: 100%;
}
.cartpage-cart-table-item-image-squarer {
  position: relative;
  display: flex;

  width: 100%;
  /* padding-top: calc(100% * 1.56); */
  padding-top: calc(100% * 1);
}
.cartpage-cart-table-item-image-inner {
  position: absolute;
  display: flex;

  top: 0;
  right: 0;
  left: 0;
  bottom: 0;

  width: 100%;
  height: 100%;
}
.cartpage-cart-table-item-image img {
  position: relative;
  display: flex;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center center;
}

.cartpage-cart-table-item-pricing {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column;

  white-space: nowrap;
}
.cartpage-cart-table-item-pricing-price {
  position: relative;
}
.cartpage-cart-table-item-pricing-before {
  position: relative;

  text-decoration: line-through;

  color: rgba(0, 0, 0, 0.4);
}

.cartpage-cart-table-item-quantity-container {
  position: relative;
  display: flex;
  gap: 10px;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  width: 100%;
}
.cartpage-cart-table-item-quantity {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: flex-start;

  flex-direction: row;
}
.cartpage-cart-table-item-quantity-input {
  position: relative;
  display: flex;

  width: calc((30px * 2) + 30px);
  height: 30px;

  padding: 0 30px;
  padding-top: 2px;

  text-align: center;

  border: 1px solid rgba(0, 0, 0, 0.05);
}
.cartpage-cart-table-item-quantity-action {
  position: absolute;
  display: flex;
  z-index: 1;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  top: 1px;

  width: calc(30px - (1px * 2));
  height: calc(30px - (1px * 2));
}
.cartpage-cart-table-item-quantity-action:first-child {
  left: 1px;
}
.cartpage-cart-table-item-quantity-action:last-child {
  right: 1px;
}

.cartpage-cart-table-item-quantity-remove-action {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  width: 30px;
  height: 30px;

  color: rgba(var(--color-brand-elegant1), 1);
}

.cartpage-side {
  position: relative;
  display: flex;
  gap: 20px;

  align-items: flex-start;
  justify-content: flex-start;

  flex-direction: column;

  width: var(--cartpage-layout-side-width);
}

.cartpage-coupon {
  position: relative;
  display: flex;
  gap: 10px;

  align-items: flex-start;
  justify-content: flex-start;

  flex-direction: column;

  /* margin-top: 50px; */

  width: 100%;

  font-size: 14px;
  font-weight: 700;
}

.cartpage-coupon-title {
  position: relative;
  display: flex;
  gap: 10px;

  align-items: center;
  justify-content: space-between;

  flex-direction: row;

  width: 100%;
}

.cartpage-coupon-removecoupon-action {
  position: relative;
  display: none;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  width: 25px;
  height: 25px;

  font-size: 14px;

  color: rgba(var(--color-brand-elegant1), 1);
}

.cartpage-coupon-field {
  position: relative;
  display: flex;
  gap: 10px;

  align-items: center;
  justify-content: space-between;

  flex-direction: row;

  width: 100%;
  height: 40px;
}

.cartpage-coupon-input {
  position: relative;
  display: flex;

  flex-direction: column;

  width: 100%;
  height: 100%;

  padding: 0 20px;

  border: 1px solid rgba(0, 0, 0, 0.1);
}

.cartpage-coupon-button {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  height: 100%;

  padding: 0 20px;

  font-size: 12px;
  font-weight: 600;

  border: 1px solid rgba(0, 0, 0, 0.1);

  color: white;
  background: rgba(var(--color-brand-elegant1), 1);
}
.cartpage-coupon-button > *:not(.loading-spinner1),
.cartpage-coupon.is_loading .cartpage-coupon-button > .loading-spinner1 {
  display: flex;
}
.cartpage-coupon.is_loading .cartpage-coupon-button > *:not(.loading-spinner1),
.cartpage-coupon-button > .loading-spinner1 {
  display: none;
}

.cartpage-coupon-error {
  position: relative;
  display: none;

  align-items: center;
  justify-content: flex-start;

  flex-direction: row;

  width: 100%;

  font-size: 12px;
  font-weight: 600;

  color: rgba(195, 30, 30, 1);
}
.cartpage-coupon.has_error .cartpage-coupon-error {
  display: flex;
}

.cartpage-coupon-applied {
  position: relative;
  display: none;
  gap: 10px;

  align-items: center;
  justify-content: space-between;

  flex-direction: row;

  width: 100%;
  height: 40px;

  font-size: 14px;
  font-weight: 600;

  border: 1px solid rgba(0, 0, 0, 0.1);
}
.cartpage-coupon-applied-code,
.cartpage-coupon-applied-amount {
  position: relative;

  padding: 0 20px;
}
.cartpage-coupon-applied-amount {
  border-left: 1px solid rgba(0, 0, 0, 0.1);
}

.cartpage-coupon.has_coupon .cartpage-coupon-field {
  display: none;
}
.cartpage-coupon.has_coupon .cartpage-coupon-applied,
.cartpage-coupon.has_coupon .cartpage-coupon-removecoupon-action {
  display: flex;
}

.cartpage-summarybox {
  position: relative;
  display: flex;

  align-items: flex-start;
  justify-content: flex-start;

  flex-direction: column;

  width: 100%;

  padding: 20px 20px;

  border: 1px solid rgba(0, 0, 0, 0.1);
}

.cartpage-summarybox-keyval {
  position: relative;
  display: flex;
  gap: 10px;

  margin-bottom: 10px;

  width: 100%;

  padding: 10px 0;

  border-bottom: 1px solid rgba(0, 0, 0, 0.05);

  font-size: 12px;
  font-weight: 500;

  color: rgba(0, 0, 0, 0.7);
}
.cartpage-summarybox-keyval:last-child {
  border: 0;
}
.cartpage-summarybox-keyval--bold {
  font-weight: 700;
  color: rgba(0, 0, 0, 1);
}

.cartpage-summarybox-keyval-key,
.cartpage-summarybox-keyval-value {
  position: relative;
  display: flex;
  flex: 1;
  flex-shrink: 0;

  flex-direction: row;
}

.cartpage-checkout-button {
  position: relative;
  display: flex;
  gap: 10px;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  width: 100%;
  height: 45px;

  font-size: 12px;
  font-weight: 700;

  color: white;
  background: rgba(0, 0, 0, 1);

  transition: 0.26s all ease-out;
}
.cartpage-checkout-button:hover {
  opacity: 0.7;
}

.cartpage-checkout-button span {
  padding-top: 2px;
}























/* Responsiveness. */
@media (max-width: 1050px) {
  .cartpage-layout {
    --cartpage-layout-side-width: 100%;

    gap: 40px;

    flex-direction: column-reverse;

    margin-bottom: 100px;
  }
}
































































/*  */
