.cart-drawer__header {
  padding-block: 24px 20px;
  padding-inline: 20px;
}

.cart-drawer__inner {
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  scrollbar-width: thin;
  padding-block: 16px 24px;
  padding-inline: 20px;
}

.cart-drawer__footer {
  padding-block: 0 20px;
  padding-inline: 20px;
}

@media (min-width: 960px) {
  .cart-drawer__content {
    width: 700px;
  }

  .cart-drawer__header {
    padding-block: 80px 40px;
    padding-inline: 100px;
  }

  .cart-drawer__inner {
    padding-inline: 100px;
  }

  .cart-drawer__footer {
    padding-block: 0 40px;
    padding-inline: 100px;
  }
}

/* cart-loading */

.cart-drawer__inner {
  min-height: 200px;
}

.cart-drawer__inner.loading>*,
.cart-drawer__inner.loading~* {
  display: none;
}

.cart-drawer__inner.loading .cart-drawer__loading {
  display: block;
}


.cart-drawer__loading .icon {
  width: 36px;
  height: 36px;
  animation: animation-circling 0.5s linear infinite;
}

/* cart-item */

.cart-item__product-info {
  word-break: break-all;
}

.cart-item__picture {
  width: 60px;
}

@media (min-width: 960px) {
  .cart-item__picture {
    width: 85px;
  }

  .cart-item__product-infos {
    padding-inline-start: 10px;
  }
}

.cart-item__property-image>:is(img, svg) {
  width: 30px;
  height: 30px;
}

.cart-item__discount {
  color: rgb(var(--color-discount));
}

.cart-item__amount {
  margin-block-start: 10px;
}

.cart-item__remove {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: rgb(var(--color-text));
  background-color: rgb(var(--color-background));
  border: 1px solid rgb(var(--color-text));
  border-radius: 50%;
  width: 20px;
  height: 20px;
  padding: 0;
  position: absolute;
  inset-inline-end: calc(100% + 24px);
}

@media (pointer: fine) {
  .cart-item__remove {
    transition: 0.5s cubic-bezier(.19, 1, .22, 1);
    transition-property: color, background-color;
  }

  .cart-item__remove:hover {
    color: rgb(var(--color-background));
    background-color: rgb(var(--color-text));
  }
}

@media (max-width: 767px) {
  .cart-item__remove {
    z-index: 1;
    position: absolute;
    inset-block-start: -6px;
    inset-inline-start: -6px;
    inset-inline-end: auto;
  }

  .cart-item__picture {
    pointer-events: none;
  }
}

.cart-item__total {
  width: 16.2%;
  min-width: 100px;
}

.cart-item__total-loading.loading {
  display: block;
  animation: animation-circling 0.5s linear infinite;
}

.cart-item__total-loading.loading~* {
  visibility: hidden;
}

.cart-item__total-final {
  color: rgb(var(--color-price));
}

.cart-item__total-final:has(~ .cart-item__total-original) {
  color: rgb(var(--color-discount));
}

.cart-item__total-original {
  position: relative;
  font-size: 90%;
  vertical-align: middle;
}

.cart-item__total-original::after {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 50%;
  width: 100%;
  transform: rotate(-15deg);
  border-block-end: 1px solid rgb(var(--color-discount));
}

.cart-item__product-infos .cart-item__total {
  width: 100%;
  display: block;
  margin-block-start: 10px;
}

@media (min-width: 640px) {
  .cart-item__product-infos .cart-item__total {
    display: none;
  }
}

.cart-item__fail {
  color: rgb(var(--color-error-text));
}

.cart-item__fail>* {
  margin-block-start: 20px;
}

.cart-item__fail-tip {
  order: 1;
  color: rgb(var(--color-error-text));
}

.cart-item__fail-tip:empty,
.cart-item__fail-tip:empty+svg {
  display: none;
}

.cart-items__list .cart-item__disabled {
  pointer-events: none;
}

.cart-amount {
  padding-block-start: 20px;
}

.cart-amount .cart-amount__discount span {
  color: rgb(var(--color-discount));
}

.cart-coupon {
  padding-block-start: 36px;
}

.cart-coupon--disabled {
  pointer-events: none;
}

.cart-coupon__form .field {
  --input-height: 58px;
  margin-block-end: 0;
}

.cart-coupon__form .field__inner::before {
  box-shadow: none;
  background-color: rgb(var(--color-text) / var(--input-border-opacity));
  -webkit-mask: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c10' stroke-linecap='square'/%3e%3c/svg%3e");
  mask: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c10' stroke-linecap='square'/%3e%3c/svg%3e");
  transition-property: background-color;
}

.cart-coupon__form .field__suffix {
  padding-inline-start: var(--input-padding-inline);
  padding-inline-end: 4px;
}

.cart-coupon__form .field__suffix .icon {
  opacity: 1;
}

.cart-coupon__form .field__input::placeholder {
  opacity: 1;
}

.cart-coupon__error {
  margin-block: 0;
}

.cart-coupon__list-warning,
.cart-coupon__list-expired .icon-alert-circle {
  color: rgb(var(--color-error-text));
}

.cart-coupon__list-item {
  padding: 8px 10px;
  background-color: rgb(var(--color-text)/ 0.045);
}

.cart-coupon__list-close {
  margin-inline-start: 8px;
}

.cart-coupon__list-close .button__spinner {
  width: 16px;
  height: 16px;
  margin-block-start: -8px;
  margin-inline-start: -8px;
}

.cart-coupon__list-close.loading .icon-close {
  transform: scale(0);
}

.cart-item__amount .cart-item__volume-pricing {
  margin-block-start: 10px;
}

.cart-item__volume-pricing theme-popover-content {
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  scrollbar-width: thin;
  z-index: 5;
  width: 245px;
  max-height: 240px;
  padding: 0;
}

.cart-item__volume-pricing-rules {
  padding-block: 20px;
  padding-inline: 24px;
}

.cart-item__volume-pricing-list li {
  padding-block: 8px;
  padding-inline: 20px;
}

.cart-item__volume-pricing-list li:nth-child(odd) {
  background-color: rgba(var(--color-text) / 0.025);
}

.cart-checkout {
  padding-block-start: 24px;
  border-block-start: 4px solid currentColor;
}