.drawer__heading .heading__text[data-ab-test],
.cart-drawer__empty-content[data-ab-test],
.cart-item__price-wrapper[data-ab-test],
.absave-badge__wrapper[data-ab-test],
.ab__discount-amount[data-ab-test],
.ab-cart__ctas[data-ab-test],
.cart-item__subscription-upgrade,
.ab__totals[data-ab-test],
.cart-drawer__footer-content[data-ab-test],
cart-upsells {
  display: none;
}

.cart-ab-test cart-drawer.drawer {
  &.is-empty .drawer__shipping-banner {
    display: none !important;
  }

  cart-upsells {
    display: block;
  }

  .drawer__inner {
    width: 100%;
    max-width: 100vw !important;
    padding: 0 16px;
  }

  .cart-drawer__empty-collection {
    text-decoration: unset;
  }

  .cart-drawer__empty-collection {
    width: calc(50% - 6px);
  }

  .cart-drawer__empty-content .button {
    margin-top: 32px;
  }

  .cart-drawer__empty-collection {

    display: flex;
    padding: 16px 20px 0 20px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    border-radius: 12px;
    overflow: hidden;
  }

  .cart-drawer__empty-collection:hover .cart-collection__img {
    transform: scale(1.1);
  }

  .cart-drawer__empty-collections {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 12px;
  }

  .cart-collection__img {
    object-fit: contain;
    height: 60px;
    transition: transform 0.7s ease-in-out;
  }

  .cart-collection__title {
    margin: auto;
    text-align: center;
    font-variant-numeric: lining-nums proportional-nums;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "New Spirit";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    color: #100F0F;
  }

  .cart__empty-title {
    text-align: center;
    font-variant-numeric: lining-nums proportional-nums;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "New Spirit";
    font-size: 21px;
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
    color: #100F0F;
    margin: 0 0 10px;
  }

  .cart__empty-text {
    color: #2C2926;
    text-align: center;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
  }

  /* Active cart styles */
  .drawer__header {
    padding-bottom: 10px;
  }

  .drawer__heading {
    height: 50px;
  }

  .drawer__heading .heading__text,
  .cart-drawer__empty-content {
    display: none;
  }

  .drawer__heading .heading__text[data-ab-test],
  .cart-drawer__empty-content[data-ab-test] {
    display: initial;
  }

  .cart-item__price-wrapper[data-ab-test],
  .ab-cart__ctas[data-ab-test] {
    display: flex;
  }

  .absave-badge__wrapper[data-ab-test],
  .ab__discount-amount[data-ab-test] {
    display: block;
  }

  .drawer__heading .heading__text[data-ab-test] {
    font-family: "New Spirit";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
  }

  .drawer__close {
    top: 16px;
  }

  .cart-drawer .cart-item__details {
    grid-column: 2 / 5;
  }

  .cart-item__subscription-upgrade {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    margin: 8px 0 0;

    padding: 4px 8px;
    border: none;
    border-radius: 4px;
    background: #FFF2CA;
    
    cursor: pointer;
    transition: .15s linear;

    :hover {
      opacity: 0.8;
    }

    svg {
      width: 12px;
      height: 12px;
    }

    span {
      color: #FF7A00;
      font-family: Inter;
      font-size: 11px;
      font-style: normal;
      font-weight: 500;
      line-height: normal;
    }
  }

  .drawer__shipping-banner:has(.shipping-banner__remaining) {
    padding: 10px 0;
    border: none;
    background: transparent;

    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .drawer__shipping-banner:has(.shipping-banner__remaining) .shipping-banner__progress {
    flex: 1 1 100%;
    order: -1;
    margin-bottom: 7px;
    height: 4px;
    border-radius: 10px;
    overflow: hidden;
  }

  .drawer__shipping-banner:has(.shipping-banner__remaining) .shipping-banner__progress .progress__line {
    height: 4px;
  }

  .drawer__shipping-banner:has(.shipping-banner__remaining) p.shipping-banner__remaining {
    color: var(--color--accent-primary);
  }

  .drawer__shipping-banner:has(.shipping-banner__remaining) p.shipping-banner__progress-price {
    color: #6E6A67;
  }

  .drawer__shipping-banner:has(.shipping-banner__reached-text) {
    border-radius: 8px;
    background: #E3F9D7;
    padding: 10px 0;
  }

  .drawer__shipping-banner p {
    color: var(--green, #56B529);
    text-align: center;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  td.cart-item__subscription-banner h5 {
    font-size: 15px;
  }

  .cart-drawer .cart-item {
    padding-top: 16px;
  }

  .cart-drawer .cart-item:first-child {
    padding-top: 6px;
  }

  .cart-drawer .cart-item:not(:has(+ tr.absave-badge__wrapper)) {
    border-bottom: 1px dashed rgba(0, 0, 0, .1) !important;
  }

  .cart-item__media {
    display: flex;
    align-items: center;
  }

  .cart-item__image {
    height: 80px;
    width: 80px;
    background-color: #F5F0EB;
    object-fit: contain;
    border-radius: 8px;
    max-width: unset !important;
  }

  .cart-item__name {
    font-family: "New Spirit";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    margin-bottom: 5px;
    line-height: 24.5px;

  }

  .cart-item .product-option {
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .cart-item__discounted-prices {
    display: flex;
    flex-direction: row !important;
    align-items: center;
  }

  .line-discount-badge {
    color: #100F0F;
    text-align: right;
    font-family: Inter;
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    display: flex;
    height: 16px;
    padding: 0 3px;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    background: #FFC107;
    flex-wrap: wrap;
  }

  .cart-item__price-wrapper {
    text-align: left;
    display: flex;
    justify-content: flex-start;
    margin-top: 10px !important;
  }

  .price {
    text-align: right;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal !important;
    color: #100F0F;
  }

  span.price.price--end {
    margin-left: 6px;
    margin-right: 6px;
  }

  .price.cart-item__old-price {
    color: #999;
    font-size: 10px;
  }

  quantity-input {
    border-radius: 160px !important;
    border: 1px solid rgba(0, 0, 0, 0.16);
    background: #FFF !important;
    text-align: center;
    font-variant-numeric: lining-nums proportional-nums;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
  }

  .cart-drawer .cart-items .cart-item__quantity {
    margin-top: 10px;
  }

  .cart-drawer .cart-items .cart-item__quantity .quantity__button {
    width: 30px;
    height: 30px;
  }

  .quantity__input {
    font-variant-numeric: lining-nums proportional-nums;
    font-feature-settings: "liga" off, "clig" off;
    font-family: Inter !important;
    font-size: 16px !important;
    font-style: normal;
    font-weight: 600;
  }

  .cart-item__totals.right {
    display: none !important;
  }

  .cart-item__totals.right .cart-item__price-wrapper {
    display: none !important;
  }

  .cart-drawer .cart-items .cart-item__quantity .quantity__input {
    width: 30px;
  }

  .absave-badge {
    display: flex;
    padding: 7px 0 !important;
    justify-content: center;
    align-items: center;
    gap: 4px;
    align-self: stretch;
    border-radius: 8px;
    background-color: #FFF2CA;

  }

  .absave-badge__wrapper {
    width: 100%;
    display: block;
    padding-bottom: 16px;
    border-bottom: 1px dashed rgba(0, 0, 0, .1);
  }

  .absave-badge__wrapper:last-child {
    border-bottom: 0;
  }

  .absave-badge__inner {
    color: #FF7A00;
    text-align: center;
    font-family: Inter;
    font-style: normal;
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
  }

  .cart-item {
    border-bottom: unset !important;
    padding-bottom: 16px !important;
  }

  .cart-item__subscription-banner span {
    color: #4B4744;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .cart-drawer .cart-item__error {
    margin: unset;
  }

  .drawer__footer {
    margin: 0 -16px;
    padding: 16px;

    border-top: 1px solid rgba(0, 0, 0, 0.08);
    background: #FFF;
    box-shadow: 0 -1px 5px 0 rgba(0, 0, 0, 0.03);
    width: calc(100% + 32px);
  }

  .cart__ctas {
    display: none;
  }

  .cart-drawer__footer .totals {
    display: none;
  }
  
  .discount-amount {
    display: none !important;
  }

  .total {
    display: none;
  }

  .cart__payment-icons {
    display: none;
  }

  .cart-drawer__footer-content[data-ab-test]  {
    display: flex;
    justify-content: center;
    align-items: center;

    .cart__payment-icon {
      display: block;
    }
  }

  td.cart-item__subscription-banner {
    padding-bottom: 10px;
    margin-bottom: 10px;
  }
}

/* cart footer */
.ab__discount-amount .totals__total {
  text-align: center;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  display: flex;
  padding: 7px 0;
  justify-content: center;
  align-items: center;
  gap: 4px;
  align-self: stretch;
  border-radius: 8px;
  background: rgba(88, 69, 118, 0.10);
}

.ab-cart__ctas {
  display: flex;
  height: 55px;
  padding: 0 16px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  border-radius: 10px;
  background: var(--red, #EC1D25);

  flex-direction: column;
  gap: 5px;
}

.ab-cart__ctas .ab-button__text {
  color: #FFF;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
  text-align: left;
}

.ab-cart__ctas .prediscount-price {
  color: #FFF;
  font-variant-numeric: lining-nums proportional-nums;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  text-decoration-line: line-through;
  opacity: 0.5;
}

.ab-pre-discount {
  display: flex;
  justify-content: space-between;
  align-items: center;

  color: #FFF;
  font-family: Inter;
  font-size: 11px;
  line-height: 120%;
  font-style: normal;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;

  opacity: .7;
}

.ab-cart__ctas .accurate-price {
  color: #FFF;
  font-variant-numeric: lining-nums proportional-nums;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Inter;
  font-size: 9px 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  margin: 0 12px 0 6px;
}


.ab-cart__ctas .cart__checkout-button button {
  padding: unset;
}

.cart-drawer .cart__checkout-button {
  padding: unset !important;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.cart__google-reviews {
  display: flex;
  justify-content: center;
  align-items: center;

  margin-top: 14px;

  color: #101728;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;

  svg {
    display: inline-flex;
    margin: 0 6px;

    :last-child {
      margin-right: 0;
    }
  }
}

@media (min-width: 768px) {
  .cart-ab-test cart-drawer.drawer {
    .cart__empty-title {
      font-size: 26px;
    }

    .drawer__heading .heading__text[data-ab-test] {
      font-size: 22px;
    }

    .drawer__close {
      top: 16px;
    }

    .drawer__inner {
      width: 600px;
      padding: 0 20px;
    }

    .cart-collection__img {
      height: 70px
    }

    .cart-drawer__empty-collection {
      display: flex;
      padding: 16px 20px 0 20px;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      border-radius: 12px;
      width: calc(50% - 6px);
      flex-grow: 1;
    }

    .cart-drawer .cart-items .cart-item__quantity {
      position: absolute;
      top: 50%;
      right: 0;
      transform: translateY(-50%);
      margin-top: 0;
    }

    .cart-drawer .cart-items .cart-item--subscription .cart-item__quantity {
      top: 102.5px;
      right: 0;
    }

    .cart-drawer .cart-item {
      position: relative;
    }

    .cart-drawer .cart-item {
      padding-top: 20px;
      gap: unset;
    }

    .cart-drawer .cart-item {
      grid-template: repeat(1, auto) / repeat(6, 1fr) !important;
      column-gap: 16px !important;
    }

    .cart-item__media {
      width: fit-content;
    }

    .cart-item__name { 
      font-size: 18px;
      line-height: 140%;
    }

    .cart-item .product-option {
      font-size: 14px;
    }

    .price.cart-item__old-price {
      font-size: 12px;
    }

    .line-discount-badge {
      font-size: 12px;
      height: 20px;
      padding: 0 6px;
    }

    td.cart-item__subscription-banner {
      padding-bottom: 16px;
    }
    
    td.cart-item__subscription-banner h5 {
      font-size: 16px;
    }

    .cart-item__subscription-banner span {
      font-size: 14px;
    }

    .cart-item cart-item--subscription {
      row-gap: 16px;
    }

    td.cart-item__subscription-banner {
      padding: unset;
      margin: unset;
      border: unset;
      padding-top: 2px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding-bottom: 16px;
    }

    td.cart-item__subscription-banner h5 {
      font-family: Inter;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
    }

    .cart-item__subscription-upgrade {
      margin: 10px 0 0;
      padding: 6px 12px;
  
      svg {
        width: 14px;
        height: 14px;
      }
  
      span {
        font-size: 14px;
      }
    }

    .drawer__footer {
      margin: 0 -20px;
      padding: 16px 20px;
      width: calc(100% + 40px);
    }

    .cart-drawer .cart__checkout-button {
      width: 100%;
    }

    .ab-cart__ctas {
      height: 60px;
      padding: 0 20px;
    }

    .ab-cart__ctas .ab-button__text {
      font-size: 18px;
      line-height: 18px;
    }

    .ab-cart__ctas .ab-pre-discount {
      font-size: 12px;
      opacity: .7;
    }

    .cart__google-reviews {
      font-size: 15px;
    }
  }
}


/* Cart A/B Test V2 */
.cart-ab-test cart-drawer.drawer {
  .ab__discount-amount[data-ab-test] {
    display: none;
  }

  .ab-cart__ctas[data-ab-test] {
    display: none;
  }

  .ab-cart__ctas[data-ab-test] {
    display: flex;

    .cart__checkout-button {
      position: relative;
      width: 100%;
    }
  }

  .ab__totals[data-ab-test] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin: 0 0 15px;

    .totals__items-count {
      color: #100F0F;
      font-family: Inter;
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: normal;

      strong {
        font-weight: 600;
      }
    }

    .totals__prices {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 6px;

      .prices__price {
        color: #100F0F;
        text-align: right;
        font-family: Inter;
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
      }

      .price--original {
        color: #999;
        text-decoration: line-through;
        font-size: 10px;
      }

      .prices__discount-badge {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 16px;

        padding: 0 3px;

        border-radius: 30px;
        background: #FFC107;
        
        color: #100F0F;
        text-align: right;
        font-family: Inter;
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
      }
    }
  }

  @media screen and (min-width: 768px) {
    .ab__totals[data-ab-test] {
      .totals__items-count {
        font-size: 15px;
      }
  
      .totals__prices {
        .prices__price {
          font-size: 16px;
        }
  
        .price--original {
          font-size: 12px;
        }
  
        .prices__discount-badge {
          font-size: 16px;
          height: 20px;
          padding: 0 6px;
        }
      }
    }
  }
}