quantity-popover {
  position: relative;
  display: block;
}

quantity-popover volume-pricing li:nth-child(odd) {
  background: rgba(var(--color-foreground), 0.03);
}

quantity-popover volume-pricing li {
  font-size: 1.2rem;
  letter-spacing: 0.06rem;
  padding: 0.6rem 0.8rem;
  display: flex;
  justify-content: space-between;
}

.quantity-popover__info.global-settings-popup {
  width: 100%;
  z-index: 3;
  position: absolute;
  background-color: rgb(var(--color-background));
  max-width: 36rem;
}

.quantity-popover__info .button-close,
.variant-remove-total quick-order-list-remove-all-button .button,
.quick-order-list-total__confirmation quick-order-list-remove-all-button .button,
quantity-popover quick-order-list-remove-button .button {
  --shadow-opacity: 0;
  --border-opacity: 0;
}

.quantity-popover__info-button {
  display: flex;
  align-items: center;
  margin: 0 0.4rem 0 0;
  min-width: 1.5rem;
  min-height: 1.5rem;
  --shadow-opacity: 0;
  --border-opacity: 0;
}

.quantity-popover__info-button--icon-with-label {
  text-align: left;
}

.quantity-popover__info-button--icon-with-label svg {
  flex-shrink: 0;
  width: 15px;
  height: 14px;
}

.quantity-popover__info-button--open {
  text-decoration: underline;
}

.quantity-popover__info-button span {
  padding-left: 1rem;
}

.quantity-popover__info-button--icon-only--animation svg {
  transform: scale(1.25);
}

.quantity-popover__info-button--icon-only svg {
  transition: transform var(--duration-default) ease;
  width: 15px;
  height: 14px;
}

@media screen and (max-width: 989px) {
  .quantity-popover__info.global-settings-popup {
    left: 0;
    top: 100%;
  }

  .quantity-popover__info-button {
    padding-left: 0;
  }
}

.quantity-popover__info .quantity__rules {
  margin-top: 1.2rem;
  margin-bottom: 1rem;
}

.quantity-popover__info .volume-pricing-label {
  display: block;
  margin-left: 1.2rem;
  margin-top: 1.2rem;
  font-size: 1.2rem;
}

.quantity-popover__info .button {
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  top: 0.4rem;
  right: 0;
  padding: 0 1.2rem 0 0;
  display: flex;
  justify-content: flex-end;
}

.quantity-popover__info .volume-pricing-label ~ .button {
  top: -0.2rem;
}

.quantity-popover__info .button .icon {
  width: 1.5rem;
  height: 1.5rem;
}

quantity-popover volume-pricing {
  margin-top: 1.2rem;
  display: block;
}

quantity-popover .quantity__rules span:first-of-type {
  display: block;
}

.quantity-popover-container {
  display: flex;
  padding: 0.5rem 0.5rem 0.5rem 0;
}

.quantity-popover-container:not(.quantity-popover-container--hover) {
  align-items: center;
}

@media screen and (min-width: 990px) {
  .quantity-popover-container--empty {
    margin-right: 2.7rem;
  }

  .quantity-popover__info.global-settings-popup {
    width: 20rem;
  }

  .quantity-popover-container {
    width: auto;
    max-width: 20rem;
  }

  .quantity-popover__info.global-settings-popup {
    transform: translateX(-100%);
    top: 0.5rem;
  }
}

/* quantity-popover .quantity {
  background: rgb(var(--color-background));
} */

quantity-popover .quantity__rules {
  margin-left: 0.8rem;
}

quantity-popover .quantity__rules .divider:nth-child(2)::before {
  content: none;
}

quantity-popover .quantity__button:not(:focus-visible):not(.focused),
quantity-popover .quantity__input:not(:focus-visible):not(.focused) {
  background-color: initial;
}

quantity-popover {
  .quantity {
    min-height: 2rem;
    height: 2rem;
    width: 7.5rem;
  }

  .quantity__input {
    margin-top: 0.25rem;
    &:focus {
      background-color: transparent;
      outline: 0;
      box-shadow: none;
    }
  }

  .quantity:after {
    content: '';
    border: 0;
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 90 35" fill="none" preserveAspectRatio="none"><path d="M1.70858 7.0568C1.987 5.77646 1.40581 3.47441 2.06845 2.26404C2.24633 2.00082 2.679 2.01869 3.04525 1.96449C4.07628 1.81192 5.21272 1.69414 6.25841 1.66494C11.0978 1.52982 15.9815 1.68175 20.8269 1.74577C24.6688 1.79653 28.5219 1.91109 32.3621 1.9217C36.7343 1.93377 41.1305 2.09175 45.4975 1.9217C51.6691 1.68136 57.8294 1.7253 64.0053 1.59837C66.8085 1.54076 69.6139 1.61449 72.4173 1.5746C76.2296 1.52036 79.9783 1.39367 83.7855 1.68396C85.2443 1.79519 86.6659 1.96193 88.0783 2.25453C88.3387 2.30847 88.5226 2.30809 88.6502 2.478C88.9924 2.93368 88.8155 3.69086 88.8816 4.1897C89.0852 5.72609 89.0001 7.35845 88.8237 8.89212C88.588 10.9413 88.714 13.0003 88.5024 15.0542C88.1918 18.0695 87.7827 21.0491 87.7827 24.0787C87.7827 26.3804 87.4641 28.7023 86.7994 30.954C86.6253 31.5438 86.6793 31.962 85.8676 31.962C84.9018 31.962 84.0436 32.0153 83.0915 32.176C80.2317 32.6586 77.1511 32.5483 74.236 32.6943C71.4337 32.8346 68.6693 33.1698 65.8689 33.2648C63.9281 33.3307 61.9979 33.4778 60.0531 33.4978C57.9231 33.5197 55.8043 33.3719 53.6782 33.2981C50.2307 33.1786 46.7761 33.343 43.3254 33.3314C36.1719 33.3073 28.9031 32.5222 21.8294 31.7909C19.6618 31.5668 17.501 31.2408 15.3067 31.2108C12.4154 31.1713 9.56146 31.3674 6.68255 31.5151C5.10828 31.5959 3.53972 31.7158 2.01062 31.3677C1.91633 31.3462 1.42523 31.2592 1.38084 31.1442C1.24412 30.7902 1.38084 29.5592 1.38084 29.1923C1.38084 28.3971 1.33979 27.5259 1.323 26.7308C1.3055 25.9019 1.42978 25.9011 1.323 25.0772C1.16401 23.8505 1.17662 22.6083 1.0788 21.378C0.926805 19.4662 1.02556 17.5818 1.11736 15.6724C1.18971 14.1676 1.11444 12.6606 1.16877 11.1554C1.21849 9.77786 1.41285 8.41675 1.70858 7.0568Z" stroke="%23413D39" stroke-width="3" stroke-linecap="round"/></svg>');
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 100%;
    height: 100%;
    background-color: var(--neutral-300);
  }
  .quantity__button {
    width: 2rem;
    height: 2rem;
  }
}
