/** Shopify CDN: Minification failed

Line 708:0 Unexpected "<"

**/
  /* ═══════════════════════════════════════════════════════
   FIX: SCROLL-BUG + KOMPAKTERE ABSTÄNDE
   ═══════════════════════════════════════════════════════ */
/* Scroll-Fix: nur der Item-Bereich scrollt */
#CartDrawer .drawer__inner {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
#CartDrawer .drawer__header,
#CartDrawer .drawer__footer,
#CartDrawer .cd-rewards-container,
#CartDrawer .cart-timer {
  flex-shrink: 0 !important;
}
#CartDrawer cart-drawer-items {
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 0 !important;
  overscroll-behavior: none !important;
  overscroll-behavior-y: none !important;
}
#CartDrawer .drawer__inner-empty {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
/* Shipping Warranty — engere Abstände */
#CartDrawer #nrn-protect {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  padding: 11px !important;
}
/* Checkout-Button → 30 Day Returns */
#CartDrawer .nrn-guarantee {
  margin-top: 11px !important;
}
/* 30 Day Returns → Payment Icons */
#CartDrawer .footer__payment {
  margin-top: 14px !important;
}
#CartDrawer .list.list-payment-lm,
#CartDrawer .footer__payment ul,
#CartDrawer .payment-icons-drawer ul,
#CartDrawer ul.list-payment-lm {
  margin: 4px 0 0 0 !important;
}
/* ═══════════════════════════════════════════════════════
   NERIONA CART DRAWER v16
   ═══════════════════════════════════════════════════════ */

/* ── BODY SCROLL LOCK ── */
body:has(.drawer.active) { overflow: hidden !important; }
#CartDrawer-Overlay { background: rgba(0,0,0,0.4) !important; }

/* ── iOS Scroll-Lock ── */
cart-drawer-items {
  overscroll-behavior: none;
  overscroll-behavior-y: none;
}

#CartDrawer .drawer__inner {
  overscroll-behavior: none !important;
  overscroll-behavior-y: none !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  overflow-x: hidden !important;
}

/* ── LAYOUT HELPERS ── */
quantity-popover .quantity:after { box-shadow: none; }
quantity-popover .quantity__button:first-child,
quantity-popover .quantity__button:last-child { border: 0; }
quantity-popover .quantity { background: rgba(var(--color-foreground), 0.05) !important; }

.cart-drawer .cart-item__details {
  width: auto;
  grid-column: 2 / 6;
  display: flex;
  justify-content: space-between;
}
cart-remove-button .button { min-height: 24px; }
cart-drawer .cart-item__totals {
  pointer-events: auto !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-direction: row-reverse;
  grid-column: 2 / 6;
  gap: 10px;
}
.cart-drawer .cart-item__price-wrapper .cart-item__discounted-prices {
  display: block;
  line-height: 1.2;
  margin-bottom: 6px;
}
.cart-item__name   { margin-bottom: 4px; }
.cart-drawer .cart-items td { padding-top: 0; }
.cart-drawer .cart-item { margin-bottom: 18px; scrollbar-width: none; }
.cart-drawer-items-wrapper { scrollbar-width: none; }

/* ══════════════════════════════════════════════════
   DRAWER HEADER
   ══════════════════════════════════════════════════ */
.drawer__header {
  padding: 10px 20px 10px 20px !important;
  border-bottom: none !important;
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  position: relative !important;
  min-height: 48px !important;
}

.drawer__inner > .drawer__header,
#CartDrawer .drawer__inner > .drawer__header {
  padding: 10px 20px !important;
  display: flex !important;
  align-items: center !important;
  position: relative !important;
  min-height: 48px !important;
}

.drawer__heading {
  margin: 0 !important;
  flex: 1 !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  font-family: 'Inter', sans-serif !important;
  line-height: 1.2 !important;
  padding: 0 !important;
}
.drawer__contents { padding-top: 16px !important; }

/* ── X-Button: FIXED oben rechts ── */
.drawer__close {
  width: 40px !important;
  height: 40px !important;
  border-radius: 6px !important;
  background: rgba(var(--color-foreground), 0.06) !important;
  transition: background 0.15s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: fixed !important;
  top: 5px !important;
  right: 18px !important;
  z-index: 9999 !important;
  flex-shrink: 0 !important;
}
.drawer__close:hover { background: rgba(var(--color-foreground), 0.11) !important; }
.drawer__close svg { width: 18px !important; height: 18px !important; }

/* ── PRODUCT IMAGE ── */
.cart-item__media {
  width: 100px !important;
  min-width: 100px !important;
  height: 100px !important;
  border-radius: 8px !important;
  position: relative !important;
  flex-shrink: 0 !important;
  /* Shimmer shown while image is loading — sits behind the img */
  background: linear-gradient(110deg, #f0f0f0 30%, #e8e8e8 50%, #f0f0f0 70%) !important;
  background-size: 200% 100% !important;
  animation: nrn-img-shimmer 1.2s linear infinite !important;
}

@keyframes nrn-img-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.cart-item__image {
  width: 100px !important;
  height: 100px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  transform: translateZ(0) !important;
  display: block !important;
  position: relative !important;
  /* Always visible — no opacity tricks, no JS dependency */
  opacity: 1 !important;
}

/* ══════════════════════════════════════════════════
   PRODUCT TITLE
   ══════════════════════════════════════════════════ */
.cart-item__name,
.cart-item__details a.cart-item__name,
#CartDrawer .cart-item__name,
#CartDrawer a.cart-item__name {
  font-family: 'Inter', sans-serif !important;
  font-size: 18.5px !important;
  font-weight: 570 !important;
  font-variation-settings: "wght" 570 !important;
  letter-spacing: 0.0066em !important;
  word-spacing: 0.065em !important;
  line-height: 1.35 !important;
  color: rgb(var(--color-foreground)) !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  white-space: normal !important;
}
@media screen and (min-width: 750px) {
  .cart-item__name,
  .cart-item__details a.cart-item__name,
  #CartDrawer .cart-item__name,
  #CartDrawer a.cart-item__name {
    font-size: 20px !important;
    letter-spacing: 0.0066em !important;
    word-spacing: 0.07em !important;
  }
}

/* ── VARIANT / OPTIONS ── */
.product-option,
#CartDrawer .product-option {
  font-family: 'Inter', sans-serif !important;
  font-size: 13.25px !important;
  color: rgba(var(--color-foreground), 0.5) !important;
  font-weight: 400 !important;
  letter-spacing: 0em !important;
  word-spacing: 0.04em !important;
  margin-bottom: 1px !important;
  word-break: break-word;
  text-decoration: none !important;
}

/* ══════════════════════════════════════════════════
   ITEM TOTAL PRICE (rechte Spalte)
   ══════════════════════════════════════════════════ */
.cart-drawer .cart-item__totals .price,
.cart-drawer .cart-item__totals .price *,
.cart-drawer .cart-item__price-wrapper > .price,
.cart-drawer .cart-item__price-wrapper > .price *,
.cart-drawer .cart-item__price-wrapper > .cart-item__discounted-prices span > .price,
.cart-drawer .cart-item__price-wrapper > .cart-item__discounted-prices span > .price *,
#CartDrawer .cart-item__totals .price,
#CartDrawer .cart-item__totals .price * {
  font-family: 'Inter', sans-serif !important;
  font-size: 16.5px !important;
  font-weight: 550 !important;
  color: rgb(var(--color-foreground)) !important;
  letter-spacing: 0.01em !important;
  line-height: 1.3 !important;
  max-width: 100% !important;
  word-break: break-word !important;
}
@media screen and (min-width: 750px) {
  .cart-drawer .cart-item__totals .price,
  .cart-drawer .cart-item__totals .price *,
  .cart-drawer .cart-item__price-wrapper > .price,
  .cart-drawer .cart-item__price-wrapper > .price *,
  #CartDrawer .cart-item__totals .price,
  #CartDrawer .cart-item__totals .price * {
    font-size: 17.5px !important;
  }
}

/* ══════════════════════════════════════════════════
   VERGLEICHSPREIS / DURCHGESTRICHEN
   ══════════════════════════════════════════════════ */
.cart-drawer .cart-item__old-price,
.cart-drawer s.cart-item__old-price,
.cart-drawer .cart-item__price-wrapper s,
.cart-drawer .cart-item__discounted-prices .cart-item__old-price,
.cart-drawer .cart-item__discounted-prices s,
#CartDrawer .cart-item__old-price,
#CartDrawer s.cart-item__old-price,
#CartDrawer .price s,
#CartDrawer .price-item--strikethrough,
#CartDrawer .variant-item__old-price,
#CartDrawer .cart-item__discounted-prices s,
.cart-item__discounted-prices .cart-item__old-price.product-option,
.cart-drawer .product-option s,
#CartDrawer .product-option s {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #b0b0b0 !important;
  -webkit-text-fill-color: #b0b0b0 !important;
  opacity: 1 !important;
  text-decoration: line-through !important;
  text-decoration-color: #b0b0b0 !important;
  display: block !important;
  margin-top: 2px !important;
}

/* ── QUANTITY SELECTOR ── */
/* FIX: overflow:visible on wrapper so the left border/button is never clipped */
.cart-item__quantity {
  overflow: visible !important;
}
.cart-item__quantity-wrapper {
  overflow: visible !important;
}
.cart-item__quantity .quantity {
  height: 34px !important;
  min-height: 34px !important;
  width: 96px !important;
  max-width: 96px !important;
  min-width: 96px !important;
  background: rgba(var(--color-foreground), 0.04) !important;
  border: 1px solid rgba(var(--color-foreground), 0.12) !important;
  border-radius: 7px !important;
  overflow: hidden !important;
  /* Ensure it's fully visible inside the drawer scroll container */
  position: relative !important;
  z-index: 1 !important;
}
.quantity__button {
  width: 28px !important;
  height: 32px !important;
  min-width: 28px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  transition: background 0.12s ease !important;
}
.quantity__button:hover { background: rgba(var(--color-foreground), 0.07) !important; }
.quantity__button .icon { width: 12px !important; height: 12px !important; }
.quantity__input {
  font-size: 14px !important;
  font-weight: 600 !important;
  width: 36px !important;
  font-family: 'Inter', sans-serif !important;
}

/* ── DISCOUNTS BADGE ── */
.discounts__discount { font-size: 11.25px !important; padding: 3px 7px !important; }

/* ══════════════════════════════════════════════════
   FOOTER: FREE SHIPPING BADGE
   ══════════════════════════════════════════════════ */
.free-shipping-badge-cart {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  background: #ebf2ed;
  border-radius: 7px;
  margin-bottom: 10px;
}
.shipping-check-icon-cart { width: 18px; height: 18px; flex-shrink: 0; }
.shipping-text-cart {
  font-size: 14px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600;
  color: #008100;
  letter-spacing: 0.2px;
}

/* ══════════════════════════════════════════════════
   FOOTER TOTALS
   ══════════════════════════════════════════════════ */
.totals { margin-bottom: 8px !important; }
.totals:last-of-type { margin-bottom: 0 !important; }

/* Label */
.totals__total,
.cart-drawer .totals__total,
#CartDrawer .totals__total {
  font-family: 'Inter', sans-serif !important;
  font-size: 17px !important;
  font-weight: 450 !important;
  letter-spacing: -0.003em !important;
  color: rgba(var(--color-foreground), 0.8) !important;
}

/* Preiswert */
.totals__total-value,
.cart-drawer .totals__total-value,
#CartDrawer .totals__total-value,
.cart-drawer__footer .totals__total-value,
p.totals__total-value {
  font-family: 'Inter', sans-serif !important;
  font-size: 17px !important;
  font-weight: 450 !important;
  letter-spacing: 0.005em !important;
  color: rgba(var(--color-foreground), 0.85) !important;
}

/* ORDER TOTAL Label */
#CartDrawer .cart-drawer__footer .totals:last-of-type h2.totals__total,
#CartDrawer .cart-drawer__footer .totals:last-of-type .totals__total,
.cart-drawer__footer .totals:last-of-type h2.totals__total,
.cart-drawer__footer .totals:last-of-type .totals__total {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 450 !important;
  color: rgba(30,30,30,0.88) !important;
  -webkit-text-fill-color: rgba(30,30,30,0.88) !important;
  letter-spacing: -0.01em !important;
}

/* ORDER TOTAL PREIS */
#CartDrawer .cart-drawer__footer .totals:last-of-type p.totals__total-value,
#CartDrawer .cart-drawer__footer .totals:last-of-type .totals__total-value,
.cart-drawer__footer .totals:last-of-type p.totals__total-value,
.cart-drawer__footer .totals:last-of-type .totals__total-value {
  font-family: 'Inter', sans-serif !important;
  font-size: 19px !important;
  font-weight: 550 !important;
  letter-spacing: 0.01em !important;
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
}

/* ══════════════════════════════════════════════════
   EINZELPREIS (linke Spalte)
   ══════════════════════════════════════════════════ */
#CartDrawer .cart-item__details .cart-item__price-solo,
#CartDrawer .cart-item__details .cart-item__final-price,
#CartDrawer .cart-item__discounted-prices .cart-item__final-price,
.cart-drawer #CartDrawer .cart-item__price-solo,
.cart-item__details .cart-item__price-solo,
td.cart-item__details .cart-item__price-solo,
td.cart-item__details strong.cart-item__final-price {
  font-family: 'Inter', sans-serif !important;
  font-size: 17px !important;
  font-weight: 550 !important;
  color: rgb(var(--color-foreground)) !important;
  letter-spacing: 0.01em !important;
  line-height: 1.3 !important;
  display: block !important;
}


@media screen and (max-width: 749px) {
  .totals__total,
  .cart-drawer .totals__total,
  #CartDrawer .totals__total {
    font-size: 19px !important;
  }
  .cart-drawer__footer .totals:last-of-type h2.totals__total,
  .cart-drawer__footer .totals:last-of-type .totals__total {
    font-size: 19px !important;
  }
}

.cart-drawer .price { line-height: 1.2; }

/* ══════════════════════════════════════════════════
   CHECKOUT BUTTON — Apple-clean style
   ══════════════════════════════════════════════════ */
.cart__checkout-button {
  border: none !important;
  outline: none !important;
  letter-spacing: 0.018em !important;
  word-spacing: 0.1em !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  border-radius: 2px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 17.5px !important;
  font-weight: 600 !important;
  padding: 15px 24px !important;
  min-height: 48px !important;
  color: #ffffff !important;
  background-clip: padding-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  letter-spacing: 0.01em !important;
  cursor: pointer !important;
  width: 100% !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
  position: relative !important;
}
.cart__checkout-button::before,
.cart__checkout-button::after { display: none !important; content: none !important; }
@media (hover: hover) {
  .cart__checkout-button { transition: background 0.2s ease !important; }
  .cart__checkout-button:hover { background: #201812 !important; }
}

/* ── Checkout tap pulse animation ── */
@keyframes nrn-checkout-pulse {
  0%   { transform: scale(1);     }
  35%  { transform: scale(0.974); }
  65%  { transform: scale(1.010); }
  100% { transform: scale(1);     }
}
.cart__checkout-button.nrn-pulse,
.product-form__submit.nrn-pulse {
  animation: nrn-checkout-pulse 0.38s cubic-bezier(0.36,0.07,0.19,0.97) both !important;
}
.cart__checkout-button .svg-wrapper,
.cart__checkout-button svg,
.cart__checkout-button .icon { display: none !important; }

/* Lock icon in checkout button */
.cart__checkout-button .nrn-lock-icon {
  display: flex !important;
  align-items: center !important;
  opacity: 1 !important;
  flex-shrink: 0 !important;
  position: relative !important;
  top: -1.5px !important;
}
.cart__checkout-button .nrn-lock-icon svg { display: flex !important; }

/* ══════════════════════════════════════════════════
   GUARANTEE BADGE — under checkout button
   ══════════════════════════════════════════════════ */
.nrn-guarantee {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  margin-top: 11px !important;
  padding: 0 4px !important;
}
.nrn-guarantee__icon {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
.nrn-guarantee__text {
  font-family: 'Inter', sans-serif !important;
  font-size: 15.5px !important;
  color: rgba(var(--color-foreground), 0.72) !important;
  letter-spacing: 0.005em !important;
  line-height: 1 !important;
  font-weight: 450 !important;
}
.nrn-guarantee__text strong {
  font-weight: 600 !important;
  color: rgba(var(--color-foreground), 0.85) !important;
}

/* ── FOOTER CONTAINER ── */
.drawer__footer {
  padding: 0 20px calc(14px + env(safe-area-inset-bottom, 0px)) !important;
  border-top: none !important;
  margin-top: -1px !important;
  background: #ffffff !important;
}
/* Ensure white background all the way to bottom on all browsers */
.drawer__inner,
#CartDrawer {
  background: #ffffff !important;
}
@media screen and (min-width: 750px) {
  cart-drawer {
    background: transparent !important;
  }
  .drawer__inner {
    border-left: 1px solid rgba(0,0,0,0.12) !important;
  }
}
.drawer__footer > *:first-child,
.drawer__footer > cart-upsell-checkbox:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.drawer__footer > *:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.cart-upsell-checkbox,
.cart-upsell__checkbox,
.cart-upsell-checkbox-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-bottom: -4px !important;
  padding-bottom: 0 !important;
}

.cart-drawer__footer {
  padding-top: 12px !important;
}
.cart__ctas {
  margin-top: 15px !important;
  margin-bottom: 0 !important;
}

.footer__payment {
  margin-top: 17px !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.drawer__footer > *:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

[class*="payment-icon"],
[class*="payment_icon"],
.payment-icons-drawer,
.payment-icons,
.payment-icons-drawer *:last-child,
.footer__payment *:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.drawer__footer {
  padding-bottom: 10px !important;
}
/* ══════════════════════════════════════════════════
   PAYMENT ICONS — gleichmäßig, kein versetztes Icon
   ══════════════════════════════════════════════════ */
.list.list-payment-lm,
.footer__payment ul,
.payment-icons-drawer ul,
ul.list-payment-lm {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10.0px 10.0px !important;
  list-style: none !important;
  margin: 14px 0 0 0 !important;
  padding: 0 !important;
}

.list.list-payment-lm li,
.payment-icons-drawer li,
ul.list-payment-lm li,
.list-payment__item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
}

/* ── EMPTY CART ── */
.cart-drawer__empty-content .button {
  margin: 24px auto 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px !important;
  font-size: 15px !important;
  padding: 14px 28px !important;
  min-height: 48px !important;
  text-align: center;
  width: auto;
  max-width: 280px;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: #1a1a1a!important;
  color: #ffffff !important;
  font-weight: 500 !important;
  transition: background 0.2s ease !important;
}
.cart-drawer__empty-content .button::before,
.cart-drawer__empty-content .button::after { display: none !important; content: none !important; }
@media (hover: hover) {
  .cart-drawer__empty-content .button:hover { background: #1a1310 !important; }
}

/* ── MISC ── */
#Details-CartDrawer > .cart__note:after { box-shadow: none; }
#Details-CartDrawer > .cart__note { top: 0; }
.drawer__footer > details[open] { padding-bottom: 0; }
.drawer.is-empty .drawer__header:not(:first-of-type) { display: none !important; }
.drawer.is-empty cart-drawer-items .drawer__heading { display: none !important; }


@media screen and (min-width: 750px) {
  .cart-items .cart-items__heading--quantity,
  .cart-item .cart-item__quantity,
  .cart-item__quantity--info quantity-popover > * { padding-left: 0; }
}

@media screen and (max-width: 749px) {
  #CartDrawer .cart-item__final-price,
  cart-drawer .cart-item__final-price,
  #CartDrawer .cart-item__price-wrapper .price,
  cart-drawer .cart-item__price-wrapper .price { font-size: 16.5px !important; }

  #CartDrawer s.cart-item__old-price,
  cart-drawer .cart-item__old-price,
  #CartDrawer .cart-item__price-wrapper s,
  cart-drawer .cart-item__price-wrapper s { font-size: 12.5px !important; }

  #CartDrawer .totals__total-value,
  cart-drawer .totals__total-value { font-size: 17.5px !important; }

  #CartDrawer .totals__total,
  cart-drawer .totals__total { font-size: 17.5px !important; }

  #CartDrawer .cart-drawer__footer .totals:last-of-type .totals__total-value,
  .cart-drawer__footer .totals:last-of-type .totals__total-value { font-size: 18.5px !important; }
}

</style>

<style>
/* ═══════════════════════════════════════════════════════
   NRN SHIPPING PROTECTION WIDGET
   ═══════════════════════════════════════════════════════ */

#nrn-protect {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 13px !important;
  margin-top: 11px !important;
  margin-bottom: 10px !important;
  background: #ffffff !important;
  border-top: 1px solid #e0e0e0 !important;
  border: none !important;
  border-radius: 12px !important;
  transition: background .22s !important;
  box-sizing: border-box !important;
  cursor: default !important;
}
#nrn-protect.nrn-protect--on {
  border-color: rgba(var(--color-foreground), 0.1) !important;
  background: #ffffff !important;
}
#nrn-protect.nrn-loading {
  opacity: .45 !important;
  pointer-events: none !important;
}

#nrn-protect .nrn-protect__img {
  flex-shrink: 0 !important;
  width: 50px !important;
  height: 48px !important;
  border-radius: 9px !important;
  overflow: hidden !important;
  background: transparent !important;
}
#nrn-protect .nrn-protect__img img {
  width: 50px !important;
  height: 48px !important;
  object-fit: contain !important;
  display: block !important;
}

#nrn-protect .nrn-protect__body {
  flex: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
#nrn-protect .nrn-protect__title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: rgb(var(--color-foreground)) !important;
  line-height: 1.5 !important;
  letter-spacing: 0.008em !important;
  word-spacing: 0.13em !important;
  white-space: nowrap !important;
  overflow: visible !important;
}
#nrn-protect .nrn-protect__sub {
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: rgba(var(--color-foreground), 0.58) !important;
  line-height: 1.4 !important;
  letter-spacing: 0.015em !important;
}

#nrn-protect .nrn-protect__right {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}
#nrn-protect .nrn-protect__price {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: rgb(var(--color-foreground)) !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
  padding-right: 3px !important;
  white-space: nowrap !important;
}

#nrn-protect .nrn-tog {
  position: relative !important;
  display: inline-block !important;
  width: 46px !important;
  height: 26px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
}
#nrn-protect .nrn-tog__input {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}
#nrn-protect .nrn-tog__track {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(var(--color-foreground), 0.16) !important;
  border-radius: 26px !important;
  transition: none !important;
}
#nrn-protect .nrn-tog__thumb {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 20px !important;
  height: 20px !important;
  background: #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.22) !important;
  transition: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#nrn-protect .nrn-tog__check {
  opacity: 0 !important;
  transition: none !important;
}

#nrn-protect.nrn-animated .nrn-tog__track  { transition: background .25s !important; }
#nrn-protect.nrn-animated .nrn-tog__thumb  { transition: transform .25s !important; }
#nrn-protect.nrn-animated .nrn-tog__check  { transition: opacity .18s !important; }

#nrn-protect.nrn-protect--on .nrn-tog__track  { background: #1a1a1a !important; }
#nrn-protect.nrn-protect--on .nrn-tog__thumb  { transform: translateX(20px) !important; }
#nrn-protect.nrn-protect--on .nrn-tog__check  { opacity: 1 !important; }

@media (max-width: 749px) {
  #nrn-protect .nrn-protect__title { font-size: 15.5px !important; }
  #nrn-protect .nrn-protect__sub   { font-size: 12.75px !important; }
  #nrn-protect .nrn-protect__price { font-size: 17.5px !important; }
}
@media (min-width: 750px) {
  #nrn-protect .nrn-protect__title { font-size: 16px !important; }
  #nrn-protect .nrn-protect__sub   { font-size: 13.5px !important; }
  #nrn-protect .nrn-protect__price { font-size: 18.5px !important; }
}

/* ══════════════════════════════════════════════════════════════
   NRN FIX: Optimistic cart-loading state — no more white screen
   When ATC fetch takes >500ms, drawer opens with a skeleton.
   ══════════════════════════════════════════════════════════════ */

/* 1) While loading: show the skeleton, hide empty-state content */
cart-drawer.nrn-cart-loading #CartDrawer-ItemsWrapper,
cart-drawer.nrn-cart-loading .cart-drawer__form,
cart-drawer.nrn-cart-loading cart-drawer-items,
cart-drawer.nrn-cart-loading .drawer__footer {
  visibility: hidden !important;
}

/* 2) Animated loading skeleton overlay */
cart-drawer.nrn-cart-loading .drawer__inner::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 10;
  background: #ffffff;
  pointer-events: none;
}
cart-drawer.nrn-cart-loading .drawer__inner::after {
  content: '';
  position: absolute;
  top: 70px;
  left: 20px;
  right: 20px;
  height: calc(100% - 90px);
  z-index: 11;
  pointer-events: none;
  background-image:
    /* Product image placeholder */
    linear-gradient(#ebebeb 1px, transparent 0),
    linear-gradient(90deg, #ebebeb 68px, transparent 0),
    /* Title line */
    linear-gradient(#ebebeb 14px, transparent 0),
    /* Price line */
    linear-gradient(#ebebeb 12px, transparent 0),
    /* Separator */
    linear-gradient(#e0e0e0 1px, transparent 0),
    /* Footer skeleton */
    linear-gradient(#ebebeb 44px, transparent 0),
    linear-gradient(#d6d6d6 50px, transparent 0);
  background-size:
    68px 68px,
    68px 68px,
    calc(100% - 88px) 14px,
    80px 12px,
    100% 1px,
    100% 44px,
    50% 50px;
  background-position:
    20px 20px,
    20px 20px,
    96px 22px,
    96px 46px,
    0 110px,
    0 calc(100% - 130px),
    25% calc(100% - 60px);
  background-repeat: no-repeat;
  animation: nrn-skeleton-pulse 1.4s ease-in-out infinite;
}
@keyframes nrn-skeleton-pulse {
  0%,100% { opacity: 1; }
  50% { opacity: 0.55; }
}

/* ══════════════════════════════════════════════════════════
   NRN FIX v2: suppress content-jump when drawer HTML is
   injected via renderContents(). The DOM swap causes a brief
   repaint that looks like everything "shifts down".
   Solution: keep the drawer inner stable with contain:strict
   and clip overflow during the render frame.
   ══════════════════════════════════════════════════════════ */

/* Stable compositing layer for the whole drawer — prevents
   GPU texture invalidation during innerHTML swap */
#CartDrawer {
  will-change: transform;
  transform: translateZ(0);
}

/* nrn-just-rendered class removed — no longer needed */

/* No flicker of the page content when body.overflow-hidden
   is added (cart drawer opening). Use contain:strict on the
   sticky ATC to prevent it from triggering a layout pass. */
.sticky-atc, .nrn-sticky-atc {
  contain: layout style;
  /* will-change removed — promotes a permanent GPU compositor layer that floats
     above the real viewport bottom on Chrome Android during URL-bar collapse */
}

/* Prevent body scroll-lock from causing width shift — even
   when no position:fixed is used, removing the scrollbar
   can shift content. Pre-reserve scrollbar width on desktop. */
@media (min-width: 750px) {
  html {
    scrollbar-gutter: stable;
  }
}

/* =========================================================
   NRN FINAL CART DRAWER FIXES — Mayberry/Bowlift feel
   Fixes: black checkout, black left border, cleaner drawer
   animation, progress spacing, mobile payment icon size.
   ========================================================= */
#CartDrawer .cart__checkout-button,
#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

#CartDrawer .cart__checkout-button:hover,
#CartDrawer-Checkout:hover {
  background: #201812 !important;
  color: #ffffff !important;
}

#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  border-left: 1px solid #000000 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 420ms cubic-bezier(0.32, 0.72, 0, 1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
}

cart-drawer.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active .drawer__inner,
.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 300ms cubic-bezier(0.4, 0, 1, 1) !important;
}

#CartDrawer-Overlay,
.cart-drawer__overlay {
  background: rgba(0,0,0,0.42) !important;
  transition: opacity 300ms ease, visibility 300ms ease !important;
}

/* Progress message must sit above the bar, never touch/overlap it */
#CartDrawer .cd-rewards-container {
  padding-top: 14px !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg {
  margin: 0 0 14px 0 !important;
  line-height: 1.35 !important;
  position: relative !important;
  z-index: 2 !important;
}
#CartDrawer .cd-progress-container {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
#CartDrawer .cd-icon-container-wrapper {
  margin-top: 8px !important;
  padding-bottom: 12px !important;
}

/* Mobile payment icons: exactly 0.25px smaller than current 24.25px */
@media screen and (max-width: 749px) {
  #CartDrawer .payment-icons-drawer img,
  #CartDrawer .footer__payment img,
  #CartDrawer .list-payment-lm img,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment__item svg,
  #CartDrawer .list-payment__item .icon,
  #CartDrawer .list-payment__item .icon--full-color {
    height: 28px !important;
    width: auto !important;
  }
}


/* =========================================================
   NRN CART DRAWER FIX v8 — clean drawer + real outside click
   ========================================================= */

/* Outside area must be clickable; old pointer-events:none blocked overlay clicks */
cart-drawer.drawer.active,
.drawer.active {
  pointer-events: auto !important;
}

/* No white backup box behind drawer: only drawer panel is white */
#CartDrawer,
cart-drawer.drawer,
.drawer {
  background: transparent !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
#CartDrawer .drawer__inner-empty,
cart-drawer .drawer__inner-empty {
  background: #ffffff !important;
}

/* Overlay covers the left click-area and closes reliably */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0,0,0,0.36) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 1 !important;
  transition: opacity 280ms ease, visibility 280ms ease !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Drawer panel above overlay, slightly smaller, no left black line */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(452px, calc(100vw - 18px)) !important;
  max-width: calc(100vw - 18px) !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: -10px 0 30px rgba(0,0,0,0.10) !important;
  transform: translate3d(104%, 0, 0) !important;
  transition: transform 340ms cubic-bezier(0.32, 0.72, 0, 1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
}
.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transform: translate3d(104%, 0, 0) !important;
  transition: transform 250ms cubic-bezier(0.4, 0, 1, 1) !important;
}

/* Kill old loading/skeleton white rectangle completely */
cart-drawer.nrn-cart-loading #CartDrawer-ItemsWrapper,
cart-drawer.nrn-cart-loading .cart-drawer__form,
cart-drawer.nrn-cart-loading cart-drawer-items,
cart-drawer.nrn-cart-loading .drawer__footer {
  visibility: visible !important;
}
cart-drawer.nrn-cart-loading .drawer__inner::before,
cart-drawer.nrn-cart-loading .drawer__inner::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

/* Progress bar back to the original centered icon position */
#CartDrawer .cd-rewards-container {
  padding: 13px 23px 0 !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg {
  margin: 0 0 10px 0 !important;
  line-height: 1.4 !important;
}
#CartDrawer .cd-progress-container {
  margin: 0 23px !important;
  height: 5px !important;
}
#CartDrawer .cd-progress-bar-background,
#CartDrawer .cd-progress-bar {
  height: 5px !important;
}
#CartDrawer .cd-icon-container-wrapper {
  margin-top: -20px !important;
  padding: 0 3px 14px !important;
  align-items: flex-start !important;
}

/* Mobile payment icons: another 0.25px smaller */
@media screen and (max-width: 749px) {
  #CartDrawer .payment-icons-drawer img,
  #CartDrawer .footer__payment img,
  #CartDrawer .list-payment-lm img,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment__item svg,
  #CartDrawer .list-payment__item .icon,
  #CartDrawer .list-payment__item .icon--full-color {
    height: 28px !important;
    width: auto !important;
  }
}


/* =========================================================
   NRN CART DRAWER CLEAN PATCH v8
   Exact fixes: outside-click close, no left divider, smaller
   drawer, clean slide animation, progress bar back centered,
   mobile payment icons -0.25px, stable black checkout hover.
   ========================================================= */

/* No divider / no broken black line on the left side */
#CartDrawer,
#CartDrawer .cart-drawer,
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  border-left: 0 !important;
  border-inline-start: 0 !important;
  box-shadow: none !important;
}
#CartDrawer .drawer__inner::before,
#CartDrawer .drawer__inner::after,
cart-drawer .drawer__inner::before,
cart-drawer .drawer__inner::after {
  border-left: 0 !important;
  border-inline-start: 0 !important;
  box-shadow: none !important;
}

/* Drawer a little smaller / more premium spacing */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  width: min(455px, calc(100vw - 5rem)) !important;
  max-width: calc(100vw - 5rem) !important;
  overflow-x: hidden !important;
  transform: translate3d(102%, 0, 0) !important;
  transition: transform 360ms cubic-bezier(.25,.9,.25,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  contain: layout paint !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    max-width: 455px !important;
  }
}
@media screen and (max-width: 600px) {
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    width: calc(100vw - 5rem) !important;
    max-width: calc(100vw - 5rem) !important;
  }
}
cart-drawer.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active .drawer__inner,
.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transform: translate3d(102%, 0, 0) !important;
  transition: transform 280ms cubic-bezier(.4,0,1,1) !important;
}

/* Clean overlay only, no white backup box/flicker during animation */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  display: block !important;
  background: rgba(0,0,0,.40) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 260ms ease, visibility 260ms ease !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.active .cart-drawer__overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
cart-drawer.nrn-cart-loading .drawer__inner::before,
cart-drawer.nrn-cart-loading .drawer__inner::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}
cart-drawer.nrn-cart-loading #CartDrawer-ItemsWrapper,
cart-drawer.nrn-cart-loading .cart-drawer__form,
cart-drawer.nrn-cart-loading cart-drawer-items,
cart-drawer.nrn-cart-loading .drawer__footer {
  visibility: visible !important;
}

/* Progress bar back to original centered position with reward icons */
#CartDrawer .cd-rewards-container {
  padding: 13px 23px 0 !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg {
  margin: 0 0 10px 0 !important;
  line-height: 1.4 !important;
}
#CartDrawer .cd-progress-container {
  margin: 0 23px !important;
  height: 5px !important;
}
#CartDrawer .cd-progress-bar-background,
#CartDrawer .cd-progress-bar {
  height: 5px !important;
}
#CartDrawer .cd-icon-container-wrapper {
  margin-top: -20px !important;
  padding: 0 3px 14px !important;
  align-items: flex-start !important;
}

/* Mobile payment icons another 0.25px smaller */
@media screen and (max-width: 749px) {
  #CartDrawer .payment-icons-drawer img,
  #CartDrawer .footer__payment img,
  #CartDrawer .list-payment-lm img,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment__item svg,
  #CartDrawer .list-payment__item .icon,
  #CartDrawer .list-payment__item .icon--full-color {
    height: 28px !important;
    width: auto !important;
  }
}

/* Checkout button: wider by 1.5px each side and no weird hover color */
#CartDrawer .cart__checkout-button,
#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  width: calc(100% + 3px) !important;
  max-width: none !important;
  margin-left: -1.5px !important;
  margin-right: -1.5px !important;
}
#CartDrawer .cart__checkout-button:hover,
#CartDrawer .cart__checkout-button:focus,
#CartDrawer .cart__checkout-button:active,
#CartDrawer-Checkout:hover,
#CartDrawer-Checkout:focus,
#CartDrawer-Checkout:active {
  background: #1a1a1a !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: none !important;
}


/* =========================================================
   NRN CART DRAWER FINAL PATCH v9 — clean last chance
   ========================================================= */

/* LEFT SIDE: no random grey/black divider anywhere. Keep only soft overlay darkness. */
#CartDrawer,
#CartDrawer *,
cart-drawer,
cart-drawer * {
  border-left-color: transparent !important;
  border-inline-start-color: transparent !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  border: 0 !important;
  border-left: 0 !important;
  border-inline-start: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
}
#CartDrawer .drawer__inner::before,
#CartDrawer .drawer__inner::after,
cart-drawer .drawer__inner::before,
cart-drawer .drawer__inner::after {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Drawer size + real slide, no white backup box in background */
#CartDrawer,
cart-drawer.drawer,
.drawer {
  background: transparent !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  position: relative !important;
  z-index: 3 !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: calc(100vw - 5rem) !important;
  transform: translate3d(105%, 0, 0) !important;
  transition: transform 390ms cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  contain: layout paint !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    width: 452px !important;
    max-width: 452px !important;
  }
}
.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transform: translate3d(105%, 0, 0) !important;
  transition: transform 300ms cubic-bezier(.4,0,1,1) !important;
}

/* Overlay: left side gets darker/blurred and remains clickable for close */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0,0,0,.46) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2 !important;
  transition: opacity 300ms ease, visibility 300ms ease !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Kill skeleton/white rectangle completely while add-to-cart updates. */
cart-drawer.nrn-cart-loading .drawer__inner::before,
cart-drawer.nrn-cart-loading .drawer__inner::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}
cart-drawer.nrn-cart-loading #CartDrawer-ItemsWrapper,
cart-drawer.nrn-cart-loading .cart-drawer__form,
cart-drawer.nrn-cart-loading cart-drawer-items,
cart-drawer.nrn-cart-loading .drawer__footer {
  visibility: visible !important;
}

/* Rewards: text ABOVE with real air; progress bar BEHIND icons, not over them. */
#CartDrawer .cd-rewards-container,
.cd-rewards-container {
  padding: 14px 23px 0 !important;
  background: #ffffff !important;
  position: relative !important;
  overflow: visible !important;
}
#CartDrawer .cd-rewards-container::after,
.cd-rewards-container::after {
  display: none !important;
  content: none !important;
}
#CartDrawer .cd-rewards-text,
.cd-rewards-text {
  position: relative !important;
  z-index: 5 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  display: block !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  line-height: 1.35 !important;
  position: relative !important;
  z-index: 5 !important;
  transform: none !important;
}
#CartDrawer .cd-progress-container,
.cd-progress-container {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 23px !important;
  height: 5px !important;
  overflow: visible !important;
  transform: none !important;
}
#CartDrawer .cd-progress-bar-background,
#CartDrawer .cd-progress-bar,
.cd-progress-bar-background,
.cd-progress-bar {
  height: 5px !important;
  border-radius: 4px !important;
}
#CartDrawer .cd-progress-bar-background,
.cd-progress-bar-background {
  position: relative !important;
  z-index: 1 !important;
  overflow: hidden !important;
}
#CartDrawer .cd-progress-bar,
.cd-progress-bar {
  position: relative !important;
  z-index: 1 !important;
}
#CartDrawer .cd-icon-container-wrapper,
.cd-icon-container-wrapper {
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  margin-top: -22.5px !important;
  padding: 0 3px 14px !important;
  pointer-events: none !important;
}
#CartDrawer .cd-icon-container,
.cd-icon-container,
#CartDrawer .cd-icon-reward,
.cd-icon-reward {
  position: relative !important;
  z-index: 5 !important;
}

/* Mobile cart drawer payment icons: 0.25px smaller again. */
@media screen and (max-width: 749px) {
  #CartDrawer .payment-icons-drawer img,
  #CartDrawer .footer__payment img,
  #CartDrawer .list-payment-lm img,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment__item svg,
  #CartDrawer .list-payment__item .icon,
  #CartDrawer .list-payment__item .icon--full-color {
    height: 28px !important;
    width: auto !important;
  }
}

/* Checkout button remains black in every state and stays slightly wider. */
#CartDrawer .cart__checkout-button,
#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  width: calc(100% + 3px) !important;
  max-width: none !important;
  margin-left: -1.5px !important;
  margin-right: -1.5px !important;
}
#CartDrawer .cart__checkout-button:hover,
#CartDrawer .cart__checkout-button:focus,
#CartDrawer .cart__checkout-button:active,
#CartDrawer-Checkout:hover,
#CartDrawer-Checkout:focus,
#CartDrawer-Checkout:active {
  background: #1a1a1a !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════
   NERIONA CART DRAWER v10 FINAL MICRO FIXES
   - correct drawer payment icons mobile -0.25px
   - icon gap -0.5px
   - reward text +4px away from progress
   - overlay only on LEFT side, never behind drawer
   - checkout text/price mobile -0.5px
   - product price never wraps into two lines
   ═══════════════════════════════════════════════════════ */

:root {
  --nrn-cart-drawer-width-mobile: min(452px, calc(100vw - 5rem));
  --nrn-cart-drawer-width-desktop: 452px;
}

/* Overlay must darken ONLY the left side. No black layer behind the drawer during slide. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0,0,0,.46) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer-Overlay,
  .cart-drawer__overlay {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Drawer itself stays clean white; no shadow/line/fake border on the left. */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  border-left: 0 !important;
  border-inline-start: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background: #fff !important;
}
#CartDrawer .drawer__inner::before,
#CartDrawer .drawer__inner::after,
cart-drawer .drawer__inner::before,
cart-drawer .drawer__inner::after {
  display: none !important;
  content: none !important;
}

/* Rewards: text sits clearly above the progress bar, bar sits behind icons. */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-bottom: 22px !important; /* was 18px in v9: +4px */
  line-height: 1.35 !important;
}
#CartDrawer .cd-progress-container,
.cd-progress-container {
  z-index: 1 !important;
  pointer-events: none !important;
}
#CartDrawer .cd-progress-bar-background,
.cd-progress-bar-background {
  z-index: 1 !important;
}
#CartDrawer .cd-icon-container-wrapper,
.cd-icon-container-wrapper {
  z-index: 3 !important;
  margin-top: -22.5px !important;
}
#CartDrawer .cd-icon-reward,
.cd-icon-reward {
  z-index: 4 !important;
  background-clip: padding-box !important;
}

/* Correct payment icons INSIDE cart drawer on mobile: 0.25px smaller + gap 0.5px tighter. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer ul.list-payment-lm {
    gap: 6px 8px !important; /* snippet was 6.5px 8.5px */
  }

  #CartDrawer .footer__payment .list-payment__item svg,
  #CartDrawer .footer__payment .list-payment__item .icon,
  #CartDrawer .footer__payment .list-payment__item .icon--full-color,
  #CartDrawer .payment-icons-drawer .list-payment__item svg,
  #CartDrawer .payment-icons-drawer .list-payment__item .icon,
  #CartDrawer .payment-icons-drawer .list-payment__item .icon--full-color,
  #CartDrawer .list-payment-lm .list-payment__item svg,
  #CartDrawer .list-payment-lm .list-payment__item .icon,
  #CartDrawer .list-payment-lm .list-payment__item .icon--full-color {
    height: 28px !important; /* v9 was 23.5px: another -0.25px */
    width: auto !important;
  }

  /* Superseded — mobile checkout font-size is now controlled by the
     inline block in snippets/cart-drawer.liquid (currently 18px).
     Left disabled here instead of deleted so the history is clear. */
  /*
  #CartDrawer .cart__checkout-button,
  #CartDrawer-Checkout,
  #CartDrawer .cart__checkout-button * {
    font-size: 17.7px !important;
    letter-spacing: 0.7px !important;
  }
  */
}

/* Product info price: force one clean line, no split like "487,75" + "0". */
#CartDrawer .cart-item__details {
  min-width: 0 !important;
}
#CartDrawer .cart-item__totals,
#CartDrawer .cart-item__price-wrapper {
  min-width: max-content !important;
  width: auto !important;
  flex: 0 0 auto !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#CartDrawer .cart-item__totals .price,
#CartDrawer .cart-item__totals .price *,
#CartDrawer .cart-item__price-wrapper .price,
#CartDrawer .cart-item__price-wrapper .price *,
#CartDrawer .price,
#CartDrawer .price * {
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}
@media screen and (max-width: 749px) {
  #CartDrawer .cart-item__totals .price,
  #CartDrawer .cart-item__totals .price *,
  #CartDrawer .cart-item__price-wrapper .price,
  #CartDrawer .cart-item__price-wrapper .price * {
    font-size: 16px !important;
    line-height: 1.2 !important;
  }
}

/* ═══════════════════════════════════════════════════════
   NERIONA CART DRAWER v11 CLEAN FINAL
   - reward text one-line on mobile
   - drawer payment icons mobile -0.25px + gap -0.5px
   - Mayberry-style dim only LEFT of drawer, never behind drawer
   ═══════════════════════════════════════════════════════ */

:root {
  --nrn-cart-drawer-width-mobile: min(452px, calc(100vw - 5rem));
  --nrn-cart-drawer-width-desktop: 452px;
}

/* Cart drawer must sit above the dim layer; dim layer only covers site content on the left. */
cart-drawer,
.drawer {
  background: transparent !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  position: relative !important;
  z-index: 3 !important;
  background: #fff !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  border-left: 0 !important;
  border-inline-start: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner,
  .drawer__inner {
    width: var(--nrn-cart-drawer-width-desktop) !important;
    max-width: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  z-index: 1 !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0,0,0,.42) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 280ms ease, visibility 280ms ease !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: all !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer-Overlay,
  .cart-drawer__overlay {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Reward headline: always one clean row, never inside the progress bar. */
#CartDrawer .cd-rewards-text,
.cd-rewards-text {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.25 !important;
  margin-bottom: 36px !important;
  font-size: clamp(11.25px, 3.2vw, 14px) !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 14px !important;
  }
}

/* Progress bar remains behind the icons. */
#CartDrawer .cd-progress-container,
.cd-progress-container {
  position: relative !important;
  z-index: 1 !important;
}
#CartDrawer .cd-progress-bar-background,
#CartDrawer .cd-progress-bar,
.cd-progress-bar-background,
.cd-progress-bar {
  position: relative !important;
  z-index: 1 !important;
}
#CartDrawer .cd-icon-container-wrapper,
.cd-icon-container-wrapper {
  position: relative !important;
  z-index: 5 !important;
}
#CartDrawer .cd-icon-reward,
.cd-icon-reward {
  position: relative !important;
  z-index: 6 !important;
}

/* Correct cart-drawer payment icons on mobile: another -0.25px and gap -0.5px. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer .list.list-payment-lm,
  #CartDrawer ul.list-payment-lm {
    gap: 5.5px 7.5px !important;
  }
  #CartDrawer .payment-icons-drawer svg,
  #CartDrawer .payment-icons-drawer .icon,
  #CartDrawer .payment-icons-drawer .icon--full-color,
  #CartDrawer .footer__payment svg,
  #CartDrawer .footer__payment .icon,
  #CartDrawer .footer__payment .icon--full-color,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment-lm .icon,
  #CartDrawer .list-payment-lm .icon--full-color {
    height: 28px !important;
    width: auto !important;
  }
}


/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v12 — real Mayberry-style left dim +
   correct mobile payment icon sizing/gap + one-line reward text
   ═══════════════════════════════════════════════════════ */
:root {
  --nrn-cart-drawer-width-mobile: min(452px, calc(100vw - 5rem));
  --nrn-cart-drawer-width-desktop: 452px;
}

/* The actual dark layer: only the website area LEFT of the drawer.
   This uses the cart-drawer element itself so it works even if the
   theme overlay selector is overwritten elsewhere. */
cart-drawer.drawer,
.drawer {
  background: transparent !important;
  overflow: visible !important;
}
cart-drawer.drawer::before,
.drawer::before {
  content: "" !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.42) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 1 !important;
  transition: opacity 280ms ease, visibility 280ms ease !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
@media screen and (min-width: 750px) {
  cart-drawer.drawer::before,
  .drawer::before {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Keep native overlay functional for click-close, but make it visually identical. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  z-index: 2 !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: transparent !important;
  opacity: 1 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  visibility: visible !important;
  pointer-events: auto !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer-Overlay,
  .cart-drawer__overlay {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Drawer always above the dim layer; no dark layer behind the panel. */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  position: relative !important;
  z-index: 5 !important;
  background: #fff !important;
}

/* Reward headline: force both messages into one row. */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.2 !important;
  font-size: clamp(10.75px, 2.95vw, 13.5px) !important;
}

/* Correct mobile payment icons in CART DRAWER only: -0.25px size and -0.5px gap. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment ul.list-payment-lm,
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer ul.list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer ul.list-payment-lm,
  #CartDrawer .list.list-payment-lm {
    gap: 5px 7px !important;
    column-gap: 7px !important;
    row-gap: 5px !important;
  }
  #CartDrawer .footer__payment .list-payment__item,
  #CartDrawer .payment-icons-drawer .list-payment__item,
  #CartDrawer .list-payment-lm .list-payment__item {
    margin: 0 !important;
    padding: 0 !important;
  }
  
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v13 — final micro tuning
   - payment icons +0.25px and gap +0.25px from v12
   - reward headline larger but still one line
   - left dim appears only after drawer slide-in finishes
   ═══════════════════════════════════════════════════════ */

/* Dim layer: no visible darkening during slide-in; fade in after panel arrives. */
cart-drawer.drawer::before,
.drawer::before {
  transition: opacity 180ms ease 0ms, visibility 180ms ease 0ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  transition: opacity 180ms ease 330ms, visibility 180ms ease 330ms !important;
}

/* Keep click-close area active, but visual dim is handled by ::before above. */
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
}

/* Reward headline: bigger, still forced to one clean row. */
#CartDrawer .cd-rewards-text,
.cd-rewards-text {
  min-width: 0 !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.18 !important;
}
@media screen and (max-width: 749px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: clamp(12.75px, 3.35vw, 15.5px) !important;
    letter-spacing: -0.025em !important;
  }
}
@media screen and (min-width: 750px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 14.5px !important;
    letter-spacing: -0.01em !important;
  }
}

/* Correct CART DRAWER mobile payment icons: +0.25px size and +0.25px gap vs v12. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment ul.list-payment-lm,
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer ul.list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer ul.list-payment-lm,
  #CartDrawer .list.list-payment-lm,
  #CartDrawer .list-payment {
    gap: 5.25px 7.25px !important;
    row-gap: 5.25px !important;
    column-gap: 7.25px !important;
  }
  #CartDrawer .footer__payment .list-payment__item,
  #CartDrawer .payment-icons-drawer .list-payment__item,
  #CartDrawer .list-payment-lm .list-payment__item,
  #CartDrawer .list-payment .list-payment__item {
    margin: 0 !important;
    padding: 0 !important;
  }
  #CartDrawer .footer__payment svg,
  #CartDrawer .footer__payment .icon,
  #CartDrawer .footer__payment .icon--full-color,
  #CartDrawer .payment-icons-drawer svg,
  #CartDrawer .payment-icons-drawer .icon,
  #CartDrawer .payment-icons-drawer .icon--full-color,
  #CartDrawer .list-payment-lm svg,
  #CartDrawer .list-payment-lm .icon,
  #CartDrawer .list-payment-lm .icon--full-color,
  #CartDrawer .list-payment svg,
  #CartDrawer .list-payment .icon,
  #CartDrawer .list-payment .icon--full-color {
    height: 21px !important;
    max-height: 21px !important;
    width: auto !important;
  }
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v14 — exact micro correction
   - dim appears earlier than v13, not instant
   - reward text really +2px, top spacing -2px, bottom spacing +1px
   - mobile payment icon gap +0.25px from v13
   ═══════════════════════════════════════════════════════ */

/* Left dim: v13 was too late (330ms). Start after drawer is mostly in. */
cart-drawer.drawer::before,
.drawer::before {
  transition: opacity 180ms ease 0ms, visibility 180ms ease 0ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  transition: opacity 180ms ease 180ms, visibility 180ms ease 180ms !important;
}

/* Reward top area: 2px less above, 1px more below the text/bar flow. */
#CartDrawer .cd-rewards-container,
.cd-rewards-container {
  padding-top: 11px !important;
}
#CartDrawer .cd-rewards-text,
.cd-rewards-text {
  margin-top: 0 !important;
  padding-top: 0 !important;
  min-width: 0 !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-top: 0 !important;
  margin-bottom: 11px !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.16 !important;
  letter-spacing: -0.035em !important;
}
@media screen and (max-width: 749px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 18px !important;
  }
}
@media screen and (min-width: 750px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 18.5px !important;
  }
}

/* Payment icons mobile: +0.25px MORE spacing vs v13, size unchanged. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment ul.list-payment-lm,
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer ul.list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer ul.list-payment-lm,
  #CartDrawer .list.list-payment-lm,
  #CartDrawer .list-payment {
    gap: 5.5px 7.5px !important;
    row-gap: 5.5px !important;
    column-gap: 7.5px !important;
  }
  #CartDrawer .footer__payment .list-payment__item,
  #CartDrawer .payment-icons-drawer .list-payment__item,
  #CartDrawer .list-payment-lm .list-payment__item,
  #CartDrawer .list-payment .list-payment__item {
    margin: 0 !important;
    padding: 0 !important;
  }
}


/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v15 — FINAL requested correction
   - mobile reward text 1.5px smaller than v14
   - reward side padding 1.5px less
   - much more space below reward text so it never sits in the progress bar
   - left dim starts immediately with drawer movement (not late)
   - payment icon gap +0.25px from v14
   ═══════════════════════════════════════════════════════ */

/* Overlay/dimming: start immediately when drawer opens, no delayed pop-in. */
cart-drawer.drawer::before,
.drawer::before {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 160ms ease 0ms, visibility 0ms linear 160ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 0.38 !important;
  visibility: visible !important;
  transition: opacity 160ms ease 0ms, visibility 0ms linear 0ms !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
}

/* Reward block: less left/right padding, more room below message before bar. */
#CartDrawer .cd-rewards-container,
.cd-rewards-container {
  padding-left: 21.5px !important;
  padding-right: 21.5px !important;
  padding-top: 11px !important;
}
#CartDrawer .cd-rewards-container::after,
.cd-rewards-container::after {
  margin-left: -21.5px !important;
  margin-right: -21.5px !important;
}
#CartDrawer .cd-rewards-text,
.cd-rewards-text {
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
  padding-bottom: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.16 !important;
  letter-spacing: -0.002em !important;
}
@media screen and (max-width: 749px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 18px !important;
  }
}
@media screen and (min-width: 750px) {
  #CartDrawer .cd-rewards-text p,
  #CartDrawer #cd-rewards-msg,
  .cd-rewards-text p,
  #cd-rewards-msg {
    font-size: 20.5px !important;
  }
}
#CartDrawer .cd-progress-container,
.cd-progress-container {
  margin-top: 0 !important;
}

/* Cart drawer payment icons: +0.25px more spacing than v14. */
@media screen and (max-width: 749px) {
  #CartDrawer .footer__payment ul.list-payment-lm,
  #CartDrawer .footer__payment .list-payment-lm,
  #CartDrawer .payment-icons-drawer ul.list-payment-lm,
  #CartDrawer .payment-icons-drawer .list-payment-lm,
  #CartDrawer ul.list-payment-lm,
  #CartDrawer .list.list-payment-lm,
  #CartDrawer .list-payment {
    gap: 5.75px 7.75px !important;
    row-gap: 5.75px !important;
    column-gap: 10px !important;
  }
  #CartDrawer .footer__payment .list-payment__item,
  #CartDrawer .payment-icons-drawer .list-payment__item,
  #CartDrawer .list-payment-lm .list-payment__item,
  #CartDrawer .list-payment .list-payment__item {
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v16 — FINAL overlay timing + reward spacing
   - reward text gets +3px more space below before progress bar
   - left dim is stronger but appears only after drawer slide-in is basically complete
   ═══════════════════════════════════════════════════════ */

/* Reward message: 3px more below text, so it cannot sit inside the progress bar. */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-bottom: 23px !important;
}

/* Left-side dim: not early. Wait until drawer is fully/visibly in place, then fade stronger. */
cart-drawer.drawer::before,
.drawer::before {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 180ms ease 0ms, visibility 0ms linear 180ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 0.52 !important;
  visibility: visible !important;
  transition: opacity 180ms ease 300ms, visibility 0ms linear 300ms !important;
}

/* Keep the native click-close overlay visually clear; only ::before creates the dim. */
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v17 — exact final micro tweak
   - left dim starts when drawer animation is 3/4 complete
   - reward text gets +4px more space before progress bar
   ═══════════════════════════════════════════════════════ */

/* Reward message: +4px more below text vs v16. */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-bottom: 27px !important;
}

/* Drawer slide is 420ms, so 75% = 315ms. Dim starts at that point. */
cart-drawer.drawer::before,
.drawer::before {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 180ms ease 0ms, visibility 0ms linear 180ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 0.52 !important;
  visibility: visible !important;
  transition: opacity 180ms ease 315ms, visibility 0ms linear 315ms !important;
}

.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v18 — REAL PATCH
   - progress text gets +3px more space before progress bar vs v17
   - left dim starts at 60% of drawer animation
   - left dim strength is 62%
   ═══════════════════════════════════════════════════════ */

/* Reward message: +3px more below text vs v17 (27px -> 30px). */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-bottom: 30px !important;
}

/* Drawer slide is 420ms, so 60% = 252ms. Dim starts there and fades to 62%. */
cart-drawer.drawer::before,
.drawer::before {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 180ms ease 0ms, visibility 0ms linear 180ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 0.62 !important;
  visibility: visible !important;
  transition: opacity 180ms ease 252ms, visibility 0ms linear 252ms !important;
}

.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v19 — real overlay + faster animation
   - dim starts at 20% of the new faster slide animation
   - dim strength is a true 70% black overlay
   - drawer animation is 1.25x faster than v18
   ═══════════════════════════════════════════════════════ */

/* Drawer animation: v18 open 390ms / close 300ms → 1.25x faster = 312ms / 240ms. */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  transition: transform 312ms cubic-bezier(.22,.84,.24,1) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transition: transform 240ms cubic-bezier(.4,0,1,1) !important;
}

/* Real left-side dim: only left of drawer, 70% black, visible from 20% of 312ms = ~62ms. */
cart-drawer.drawer::before,
.drawer::before {
  background: rgba(0, 0, 0, 0.70) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 150ms ease 0ms, visibility 0ms linear 150ms !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  background: rgba(0, 0, 0, 0.70) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 150ms ease 62ms, visibility 0ms linear 62ms !important;
}

/* Native overlay remains clickable but visually transparent; ::before does the dimming. */
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v20 — CLEAN ANIMATION + DIM 63%
   - dim reduced from 70% to 63%
   - dim timing/speed from v19 kept
   - ONLY the drawer panel moves; overlay/page never transforms
   - fixes jerky/dragged background objects during slide-in
   ═══════════════════════════════════════════════════════ */

:root {
  --nrn-cart-drawer-width-mobile: min(452px, calc(100vw - 5rem));
  --nrn-cart-drawer-width-desktop: 452px;
  --nrn-cart-open-ms: 312ms;
  --nrn-cart-close-ms: 240ms;
  --nrn-cart-dim-delay: 62ms; /* 20% of 312ms — timing from v19 */
  --nrn-cart-dim-strength: 0.63;
}

/* The shell stays fixed and calm. Never animate/transform the page wrapper. */
cart-drawer.drawer,
.drawer {
  position: fixed !important;
  inset: 0 0 auto auto !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100dvh !important;
  background: transparent !important;
  transform: none !important;
  transition: visibility var(--nrn-cart-open-ms) ease !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 1000 !important;
  contain: layout style paint !important;
}
cart-drawer.drawer.active,
.drawer.active {
  pointer-events: auto !important;
  visibility: visible !important;
}

/* Disable the old pseudo dim layer completely. It could visually fight the panel animation. */
cart-drawer.drawer::before,
.drawer::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Real dim layer: fixed left area only, never under/inside the drawer panel. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 150ms ease 0ms, visibility 0ms linear 150ms !important;
  z-index: 1 !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 150ms ease var(--nrn-cart-dim-delay), visibility 0ms linear var(--nrn-cart-dim-delay) !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer-Overlay,
  .cart-drawer__overlay {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Only the white panel slides. No translate on overlay, no translate on wrapper. */
#CartDrawer {
  position: fixed !important;
  inset: 0 0 0 auto !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100dvh !important;
  background: transparent !important;
  transform: none !important;
  z-index: 3 !important;
  pointer-events: none !important;
  overflow: visible !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  position: relative !important;
  z-index: 4 !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100dvh !important;
  background: #fff !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform var(--nrn-cart-open-ms) cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  perspective: 1000px !important;
  contain: paint !important;
  pointer-events: auto !important;
}
.drawer.active #CartDrawer,
cart-drawer.drawer.active #CartDrawer {
  pointer-events: auto !important;
}
.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transition: transform var(--nrn-cart-close-ms) cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer,
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner,
  .drawer__inner {
    width: var(--nrn-cart-drawer-width-desktop) !important;
    max-width: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v21 — dim restored + reward spacing
   - keep v20 clean panel-only animation
   - restore left dim with fixed pseudo layer, not transformed
   - +2px more space between reward text and progress bar
   ═══════════════════════════════════════════════════════ */

:root {
  --nrn-cart-dim-strength: 0.63;
  --nrn-cart-dim-delay: 62ms;
}

/* Extra spacing under You unlocked / Add additional item text */
#CartDrawer .cd-rewards-text p,
#CartDrawer #cd-rewards-msg,
.cd-rewards-text p,
#cd-rewards-msg {
  margin-bottom: 32px !important;
}

/* Use a fixed pseudo overlay on the shell so the page dims but never moves with the drawer. */
cart-drawer.drawer::before,
.drawer::before {
  content: '' !important;
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  transition: opacity 150ms ease 0ms, visibility 0ms linear 150ms !important;
  z-index: 2 !important;
}
cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transition: opacity 150ms ease var(--nrn-cart-dim-delay), visibility 0ms linear var(--nrn-cart-dim-delay) !important;
}
@media screen and (min-width: 750px) {
  cart-drawer.drawer::before,
  .drawer::before {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Native overlay stays as click target only, transparent. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  z-index: 1 !important;
}
.drawer:not(.active) #CartDrawer-Overlay,
cart-drawer.drawer:not(.active) #CartDrawer-Overlay,
.drawer:not(.active) .cart-drawer__overlay,
cart-drawer.drawer:not(.active) .cart-drawer__overlay {
  pointer-events: none !important;
}

/* Keep the drawer panel above both overlay layers. */
#CartDrawer,
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  z-index: 4 !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v22 — clean moving dim layer
   - dim strength: 54%
   - dim starts after ~5% of drawer movement
   - dim reveals from right to left with the drawer motion
   - only overlay layer transforms; website and drawer shell stay stable
   ═══════════════════════════════════════════════════════ */
:root {
  --nrn-cart-dim-strength: 0.54;
  --nrn-cart-dim-delay: 16ms; /* ~5% of 312ms */
  --nrn-cart-dim-ms: 296ms;
}

/* Shell must stay fixed and never drag page/background content. */
cart-drawer.drawer,
.drawer {
  transform: none !important;
  background: transparent !important;
  overflow: hidden !important;
  contain: layout style paint !important;
}

/* Moving dim layer: reveals from the drawer edge toward the left. */
cart-drawer.drawer::before,
.drawer::before {
  content: '' !important;
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform-origin: right center !important;
  transform: scaleX(0) translateZ(0) !important;
  transition:
    transform var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    opacity var(--nrn-cart-dim-ms) ease var(--nrn-cart-dim-delay),
    visibility 0ms linear calc(var(--nrn-cart-dim-delay) + var(--nrn-cart-dim-ms)) !important;
  will-change: transform, opacity !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  z-index: 2 !important;
}

cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 1 !important;
  visibility: visible !important;
  transform: scaleX(1) translateZ(0) !important;
  transition:
    transform var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    opacity var(--nrn-cart-dim-ms) ease var(--nrn-cart-dim-delay),
    visibility 0ms linear var(--nrn-cart-dim-delay) !important;
}

@media screen and (min-width: 750px) {
  cart-drawer.drawer::before,
  .drawer::before {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Native overlay is only the click target; keep it invisible so it cannot create black flashes. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  background: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  transition: none !important;
  pointer-events: auto !important;
  z-index: 1 !important;
}
.drawer:not(.active) #CartDrawer-Overlay,
cart-drawer.drawer:not(.active) #CartDrawer-Overlay,
.drawer:not(.active) .cart-drawer__overlay,
cart-drawer.drawer:not(.active) .cart-drawer__overlay {
  pointer-events: none !important;
}

/* Keep drawer panel on its own stable layer above moving dim. */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  transform: translate3d(100%, 0, 0) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  z-index: 4 !important;
}
.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

/* ═══════════════════════════════════════════════════════
   NRN CART DRAWER FIX v23 — rebuilt clean attached dim
   - dim strength: 50%
   - dim layer is fixed + clipped, NOT scaled/transformed
   - visible dark area is attached to drawer edge while it slides in
   - website/background never transforms or gets filtered
   ═══════════════════════════════════════════════════════ */
:root {
  --nrn-cart-dim-strength: 0.50;
  --nrn-cart-dim-delay: 0ms;
  --nrn-cart-dim-ms: var(--nrn-cart-open-ms);
}

/* Keep shell and page completely stable. */
cart-drawer.drawer,
.drawer {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100dvh !important;
  background: transparent !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 1000 !important;
  contain: layout style paint !important;
}
cart-drawer.drawer.active,
.drawer.active {
  pointer-events: auto !important;
  visibility: visible !important;
}

/* Kill pseudo overlay variants from older patches. */
cart-drawer.drawer::before,
.drawer::before,
cart-drawer.drawer::after,
.drawer::after {
  content: none !important;
  display: none !important;
}

/* Native overlay becomes the visual dim AND click target.
   It clips from 100% → drawer-width, so its right edge follows the drawer edge.
   No transform/scale = no dragged/verzerrt website content. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 1 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  clip-path: inset(0 100% 0 0) !important;
  -webkit-clip-path: inset(0 100% 0 0) !important;
  transition:
    clip-path var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    -webkit-clip-path var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    visibility 0ms linear calc(var(--nrn-cart-dim-delay) + var(--nrn-cart-dim-ms)) !important;
  will-change: clip-path !important;
  z-index: 1 !important;
}
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay,
.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay {
  visibility: visible !important;
  pointer-events: auto !important;
  clip-path: inset(0 var(--nrn-cart-drawer-width-mobile) 0 0) !important;
  -webkit-clip-path: inset(0 var(--nrn-cart-drawer-width-mobile) 0 0) !important;
  transition:
    clip-path var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    -webkit-clip-path var(--nrn-cart-dim-ms) cubic-bezier(.22,.84,.24,1) var(--nrn-cart-dim-delay),
    visibility 0ms linear 0ms !important;
}
@media screen and (min-width: 750px) {
  .drawer.active #CartDrawer-Overlay,
  cart-drawer.drawer.active #CartDrawer-Overlay,
  .drawer.active .cart-drawer__overlay,
  cart-drawer.drawer.active .cart-drawer__overlay {
    clip-path: inset(0 var(--nrn-cart-drawer-width-desktop) 0 0) !important;
    -webkit-clip-path: inset(0 var(--nrn-cart-drawer-width-desktop) 0 0) !important;
  }
}

/* Drawer panel: the only element that physically slides. */
#CartDrawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100dvh !important;
  background: transparent !important;
  transform: none !important;
  pointer-events: none !important;
  overflow: visible !important;
  z-index: 3 !important;
}
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner,
.drawer__inner {
  position: relative !important;
  z-index: 4 !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100dvh !important;
  background: #fff !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform var(--nrn-cart-open-ms) cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  contain: paint !important;
  pointer-events: auto !important;
}
.drawer.active #CartDrawer,
cart-drawer.drawer.active #CartDrawer {
  pointer-events: auto !important;
}
.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transition: transform var(--nrn-cart-close-ms) cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}
@media screen and (min-width: 750px) {
  #CartDrawer,
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner,
  .drawer__inner {
    width: var(--nrn-cart-drawer-width-desktop) !important;
    max-width: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* =========================================================
   NRN CART DRAWER FIX v24 — SIMPLE CLEAN DIM FINAL
   - Restore the older/simple left dim behavior
   - Dim starts immediately at 0% of opening
   - Total dim strength: 50%
   - No moving/clipped/transformed dim layer
   - Website/background never transforms; only drawer panel slides
   ========================================================= */
cart-drawer {
  --nrn-cart-dim-strength: 0.50 !important;
  --nrn-cart-open-ms: 312ms !important;
  --nrn-cart-close-ms: 260ms !important;
  --nrn-cart-drawer-width-mobile: min(452px, calc(100vw - 5rem)) !important;
  --nrn-cart-drawer-width-desktop: 452px !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  pointer-events: none !important;
  overflow: hidden !important;
  transform: none !important;
  contain: none !important;
  z-index: 9999 !important;
}

cart-drawer .drawer,
#CartDrawer.drawer,
.drawer {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  pointer-events: none !important;
  overflow: hidden !important;
  transform: none !important;
  background: transparent !important;
  box-shadow: none !important;
  contain: none !important;
}

cart-drawer.drawer.active,
cart-drawer .drawer.active,
.drawer.active {
  pointer-events: auto !important;
  visibility: visible !important;
}

/* Kill every old experimental dim layer so nothing sits behind/inside the drawer. */
cart-drawer::before,
cart-drawer::after,
cart-drawer .drawer::before,
cart-drawer .drawer::after,
.drawer::before,
.drawer::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* The native overlay is the ONLY dark layer + click target.
   It covers only the website area left of the drawer, never behind the drawer. */
.cart-drawer__overlay,
#CartDrawer-Overlay {
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile) !important;
  width: auto !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, var(--nrn-cart-dim-strength)) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 10000 !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  filter: none !important;
  will-change: opacity !important;
  transition: opacity 220ms ease 0ms, visibility 0ms linear 220ms !important;
}

.drawer.active .cart-drawer__overlay,
cart-drawer.drawer.active .cart-drawer__overlay,
.drawer.active #CartDrawer-Overlay,
cart-drawer.drawer.active #CartDrawer-Overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 220ms ease 0ms, visibility 0ms linear 0ms !important;
}

@media screen and (min-width: 750px) {
  .cart-drawer__overlay,
  #CartDrawer-Overlay {
    right: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

/* Only the actual white drawer panel slides. Nothing else moves. */
#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: var(--nrn-cart-drawer-width-mobile) !important;
  max-width: var(--nrn-cart-drawer-width-mobile) !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: #fff !important;
  border-left: 0 !important;
  box-shadow: none !important;
  z-index: 10001 !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform var(--nrn-cart-open-ms) cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  contain: layout paint !important;
}

.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner,
cart-drawer.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transition-duration: var(--nrn-cart-close-ms) !important;
  transform: translate3d(100%, 0, 0) !important;
}

@media screen and (min-width: 750px) {
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    width: var(--nrn-cart-drawer-width-desktop) !important;
    max-width: var(--nrn-cart-drawer-width-desktop) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cart-drawer__overlay,
  #CartDrawer-Overlay,
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    transition: none !important;
  }
}

/* =========================================================
   NRN CART DRAWER FIX v25 — GUARANTEED BODY DIM OVERLAY
   - Uses a separate body-level overlay so the dim is always visible
   - 50% darkness, starts immediately when drawer opens
   - Website is never transformed/moved
   - Only drawer panel slides; overlay only fades
   ========================================================= */
body > .nrn-cart-body-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: var(--nrn-cart-drawer-width-mobile, min(452px, calc(100vw - 5rem))) !important;
  width: auto !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.50) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 9998 !important;
  transform: none !important;
  transition: opacity 220ms ease, visibility 0ms linear 220ms !important;
  will-change: opacity !important;
}

body.nrn-cart-dim-active > .nrn-cart-body-overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 220ms ease, visibility 0ms linear 0ms !important;
}

@media screen and (min-width: 750px) {
  body > .nrn-cart-body-overlay {
    right: var(--nrn-cart-drawer-width-desktop, 452px) !important;
  }
}

/* Let the body overlay receive outside clicks; keep drawer panel clickable. */
cart-drawer.drawer.active,
cart-drawer.active,
cart-drawer .drawer.active,
.drawer.active {
  pointer-events: none !important;
}

cart-drawer.drawer.active .drawer__inner,
cart-drawer.active .drawer__inner,
.drawer.active .drawer__inner,
#CartDrawer .drawer__inner {
  pointer-events: auto !important;
}

/* Disable the old inline/native overlay visuals so there is no double overlay or weird layer. */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  background: transparent !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}






/* =========================================================
   NRN CART DRAWER — v26.4 SIMPLE & CLEAN
   ──────────────────────────────────────────────────────────
   Just the two things:
   1) Dim 45% on the left, smooth fade, website shows through darkened
   2) Checkout button forced pure #000000
   NOTHING else. No body height forcing, no touch-action manipulation,
   no html locking, no dvh hacks — those broke the page layout last time.
   ========================================================= */

/* Kill any leftover v25 body-overlay element so it can't paint or block */
body > .nrn-cart-body-overlay,
.nrn-cart-body-overlay {
  display: none !important;
}

/* ── DIM LAYER ── 45% black, fixed on the left of the drawer */
cart-drawer.drawer::before,
.drawer::before {
  content: '' !important;
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  right: min(452px, calc(100vw - 5rem)) !important;
  width: auto !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.45) !important;
  background-color: rgba(0, 0, 0, 0.45) !important;
  background-image: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 260ms cubic-bezier(.32,.72,0,1),
              visibility 0ms linear 260ms !important;
  z-index: 2 !important;
}

cart-drawer.drawer.active::before,
.drawer.active::before {
  opacity: 1 !important;
  visibility: visible !important;
  transition: opacity 320ms cubic-bezier(.32,.72,0,1) 0ms,
              visibility 0ms linear 0ms !important;
}

@media screen and (min-width: 750px) {
  cart-drawer.drawer::before,
  .drawer::before {
    right: 452px !important;
  }
}

/* Native overlay = transparent click target only */
#CartDrawer-Overlay,
.cart-drawer__overlay {
  background: transparent !important;
  background-color: transparent !important;
}

/* ── CHECKOUT BUTTON: pure black, no grey-green ── */
#CartDrawer .cart__checkout-button,
#CartDrawer-Checkout,
#CartDrawer a#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button,
cart-drawer .cart__checkout-button,
cart-drawer #CartDrawer-Checkout,
.cart__checkout-button,
a.cart__checkout-button,
button.cart__checkout-button {
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
  color: #ffffff !important;
  border-color: #000000 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

#CartDrawer .cart__checkout-button:hover,
#CartDrawer .cart__checkout-button:focus,
#CartDrawer .cart__checkout-button:active,
#CartDrawer-Checkout:hover,
#CartDrawer-Checkout:focus,
#CartDrawer-Checkout:active,
.cart-drawer .cart__checkout-button:hover,
.cart-drawer .cart__checkout-button:focus,
.cart-drawer .cart__checkout-button:active,
.cart__checkout-button:hover,
.cart__checkout-button:focus,
.cart__checkout-button:active {
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
  color: #ffffff !important;
}


/* =========================================================
   NRN CART DRAWER v27 — ONE CLEAN FINAL LAYER FIX
   - Body-level backdrop sits ON TOP of the website so background glitches are hidden
   - Drawer panel sits above backdrop
   - Website is never transformed / filtered / moved
   - Background scrolling is locked while cart drawer is open
   ========================================================= */

/* Hard-kill all old dim experiments inside the drawer. */
cart-drawer.drawer::before,
cart-drawer.drawer::after,
.drawer::before,
.drawer::after,
#CartDrawer-Overlay,
.cart-drawer__overlay,
.nrn-cart-body-overlay {
  background: transparent !important;
  background-color: transparent !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* The only visual dim layer. It is created by cart-drawer.js directly under <body>. */
body > .nrn-cart-backdrop-v27 {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.45) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2147483000 !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 160ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 160ms !important;
  will-change: opacity !important;
  contain: paint !important;
}

body.nrn-cart-open-v27 > .nrn-cart-backdrop-v27 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 180ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 0ms !important;
}

/* Lock page/background scroll only while drawer is open. No height forcing = no zoom/white-screen bug. */
html.nrn-cart-scroll-lock-v27,
body.nrn-cart-scroll-lock-v27 {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

/* Host covers screen but never moves the website. */
cart-drawer.drawer {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  contain: none !important;
  z-index: 2147483100 !important;
}
cart-drawer.drawer.active {
  pointer-events: auto !important;
}

/* Container stays fixed/static; only drawer__inner slides. */
#CartDrawer,
cart-drawer .cart-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: visible !important;
  background: transparent !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  z-index: 2147483200 !important;
  contain: none !important;
}

#CartDrawer .drawer__inner,
cart-drawer .drawer__inner {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: #fff !important;
  pointer-events: auto !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 312ms cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-style: flat !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  z-index: 2147483300 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

cart-drawer.drawer.active #CartDrawer .drawer__inner,
cart-drawer.drawer.active .drawer__inner,
.drawer.active #CartDrawer .drawer__inner,
.drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

cart-drawer.is-closing #CartDrawer .drawer__inner,
cart-drawer.is-closing .drawer__inner {
  transition: transform 250ms cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}

@media screen and (min-width: 750px) {
  #CartDrawer,
  cart-drawer .cart-drawer,
  #CartDrawer .drawer__inner,
  cart-drawer .drawer__inner {
    width: 452px !important;
    max-width: 452px !important;
  }
}

/* Drawer internal scroll only — background never scrolls. */
#CartDrawer .drawer__inner {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
#CartDrawer cart-drawer-items {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
#CartDrawer .cart-drawer__footer {
  flex: 0 0 auto !important;
}

/* Keep checkout button pure black. */
#CartDrawer .cart__checkout-button,
#CartDrawer-Checkout,
#CartDrawer a#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button,
cart-drawer .cart__checkout-button,
cart-drawer #CartDrawer-Checkout,
.cart__checkout-button,
a.cart__checkout-button,
button.cart__checkout-button,
#CartDrawer .cart__checkout-button:hover,
#CartDrawer .cart__checkout-button:focus,
#CartDrawer .cart__checkout-button:active,
#CartDrawer-Checkout:hover,
#CartDrawer-Checkout:focus,
#CartDrawer-Checkout:active {
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
  color: #ffffff !important;
  border-color: #000000 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

/* =========================================================
   NRN CART DRAWER v28 — FINAL SMOOTH LAYER + SCROLL FREEZE
   Fixes the last 0.3s background-pull/jitter by freezing the page
   without transform, keeping the backdrop above the website, and
   moving ONLY the drawer panel.
   ========================================================= */

/* stable page width, no scrollbar jump when drawer locks scroll */
html {
  scrollbar-gutter: stable !important;
}

html.nrn-cart-scroll-lock-v27 {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.nrn-cart-scroll-lock-v27 {
  position: fixed !important;
  top: var(--nrn-cart-scroll-y, 0px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  padding-right: var(--nrn-cart-scrollbar-comp, 0px) !important;
  transform: none !important;
  filter: none !important;
}

/* One backdrop, fixed above the website. It hides any underlying paint glitch. */
body > .nrn-cart-backdrop-v27 {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.45) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2147483000 !important;
  transform: translateZ(0) !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 220ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 220ms !important;
  will-change: opacity !important;
  contain: paint !important;
}

body.nrn-cart-open-v27 > .nrn-cart-backdrop-v27 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 220ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 0ms !important;
}

/* Kill every older internal overlay so nothing double-paints or drags. */
cart-drawer.drawer::before,
cart-drawer.drawer::after,
.drawer::before,
.drawer::after,
#CartDrawer-Overlay,
.cart-drawer__overlay,
.nrn-cart-body-overlay {
  background: transparent !important;
  background-color: transparent !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Host is just a fixed click/layout shell. It never animates. */
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body .drawer,
html body .drawer.active {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: hidden !important;
  background: transparent !important;
  pointer-events: none !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: paint style !important;
  isolation: isolate !important;
  z-index: 2147483100 !important;
}
html body cart-drawer.drawer.active {
  pointer-events: auto !important;
}

/* Cart wrapper also never animates. */
html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body #CartDrawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: visible !important;
  background: transparent !important;
  pointer-events: none !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: paint style !important;
  isolation: isolate !important;
  z-index: 2147483200 !important;
}

/* ONLY this white panel slides. */
html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer .drawer__inner,
html body #CartDrawer .drawer__inner,
html body .drawer__inner {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: #fff !important;
  pointer-events: auto !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 312ms cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-style: flat !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  z-index: 2147483300 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active .drawer__inner,
html body .drawer.active #CartDrawer .drawer__inner,
html body .drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

html body cart-drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.is-closing .drawer__inner {
  transition: transform 250ms cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}

@media screen and (min-width: 750px) {
  html body cart-drawer.drawer #CartDrawer,
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer .drawer__inner,
  html body #CartDrawer,
  html body #CartDrawer .drawer__inner {
    width: 452px !important;
    max-width: 452px !important;
  }
}

/* Inside drawer scroll only; page behind cannot scroll. */
html body #CartDrawer .drawer__inner {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
html body #CartDrawer cart-drawer-items {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
html body #CartDrawer .cart-drawer__footer {
  flex: 0 0 auto !important;
}

/* =========================================================
   NRN CART DRAWER v29 — LOOP BLOCK + NO BACKGROUND PULL
   - background clicks cannot reach Add-to-cart while drawer is open
   - no body position:fixed snapshot, so the website cannot be dragged/distorted
   - only the white drawer panel moves
   - animation 1.1x faster than v28
   ========================================================= */

html.nrn-cart-scroll-lock-v27,
body.nrn-cart-scroll-lock-v27 {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.nrn-cart-scroll-lock-v27 {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: auto !important;
  padding-right: var(--nrn-cart-scrollbar-comp, 0px) !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: none !important;
}

body > .nrn-cart-backdrop-v27 {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.45) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2147483000 !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 200ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 200ms !important;
  will-change: opacity !important;
  contain: paint !important;
}

body.nrn-cart-open-v27 > .nrn-cart-backdrop-v27 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 200ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 0ms !important;
}

/* Disable all native/old overlays to avoid double drawer/ghost layers. */
cart-drawer.drawer::before,
cart-drawer.drawer::after,
.drawer::before,
.drawer::after,
#CartDrawer-Overlay,
.cart-drawer__overlay,
.nrn-cart-body-overlay {
  content: none !important;
  display: none !important;
  background: transparent !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  filter: none !important;
}

/* Shell never animates and never paints white behind the panel. */
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body .drawer,
html body .drawer.active,
html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body #CartDrawer {
  background: transparent !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body cart-drawer.drawer,
html body cart-drawer.drawer.active {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  pointer-events: none !important;
  z-index: 2147483100 !important;
  isolation: isolate !important;
  contain: paint style !important;
}
html body cart-drawer.drawer.active { pointer-events: auto !important; }

html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body #CartDrawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  pointer-events: none !important;
  z-index: 2147483200 !important;
  contain: paint style !important;
  isolation: isolate !important;
}

/* ONLY the actual white panel moves. 1.1x faster than v28: 312ms → 284ms. */
html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer .drawer__inner,
html body #CartDrawer .drawer__inner,
html body .drawer__inner {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: #fff !important;
  pointer-events: auto !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 284ms cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-style: flat !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  z-index: 2147483300 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active .drawer__inner,
html body .drawer.active #CartDrawer .drawer__inner,
html body .drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}

html body cart-drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.is-closing .drawer__inner {
  transition: transform 227ms cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}

@media screen and (min-width: 750px) {
  html body cart-drawer.drawer #CartDrawer,
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer .drawer__inner,
  html body #CartDrawer,
  html body #CartDrawer .drawer__inner {
    width: 452px !important;
    max-width: 452px !important;
  }
}

html body #CartDrawer .drawer__inner {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
html body #CartDrawer cart-drawer-items {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
html body #CartDrawer .cart-drawer__footer {
  flex: 0 0 auto !important;
}

/* =========================================================
   NRN CART DRAWER v30 — STABLE OVERLAY + OPEN RELIABILITY
   - fixes v29 sometimes closing/not opening from same pointerup/click
   - backdrop is the only outside-click layer, so page buttons cannot loop
   - page never transforms; only white drawer panel slides
   - background scroll is locked while drawer is open
   ========================================================= */

/* Scroll lock without freezing/transforming the website layout. */
html.nrn-cart-scroll-lock-v27,
body.nrn-cart-scroll-lock-v27 {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
body.nrn-cart-scroll-lock-v27 {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: none !important;
  padding-right: var(--nrn-cart-scrollbar-comp, 0px) !important;
}

/* The guaranteed visible backdrop: above website, below drawer. */
body > .nrn-cart-backdrop-v27 {
  display: block !important;
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: rgba(0, 0, 0, 0.45) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2147483000 !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity 180ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 180ms !important;
  will-change: opacity !important;
  isolation: isolate !important;
  contain: paint !important;
}
body.nrn-cart-open-v27 > .nrn-cart-backdrop-v27 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 180ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 0ms !important;
}

/* Kill all old/native overlay attempts to avoid double/ghost layers. */
cart-drawer.drawer::before,
cart-drawer.drawer::after,
.drawer::before,
.drawer::after,
#CartDrawer-Overlay,
.cart-drawer__overlay,
.nrn-cart-body-overlay {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  background: transparent !important;
  transform: none !important;
  filter: none !important;
}

/* Shell is only a fixed transparent viewport. It never animates/paints. */
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body .drawer,
html body .drawer.active,
html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body #CartDrawer {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: paint style !important;
  isolation: isolate !important;
}
html body cart-drawer.drawer,
html body cart-drawer.drawer.active {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 2147483100 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}
html body cart-drawer.drawer.active { pointer-events: none !important; }

html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body #CartDrawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 2147483200 !important;
  pointer-events: none !important;
  overflow: visible !important;
}

/* ONLY the real white panel moves. */
html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer .drawer__inner,
html body #CartDrawer .drawer__inner {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(452px, calc(100vw - 5rem)) !important;
  max-width: min(452px, calc(100vw - 5rem)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  background: #fff !important;
  pointer-events: auto !important;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 284ms cubic-bezier(.22,.84,.24,1) !important;
  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-style: flat !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  z-index: 2147483300 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active .drawer__inner,
html body .drawer.active #CartDrawer .drawer__inner,
html body .drawer.active .drawer__inner {
  transform: translate3d(0, 0, 0) !important;
}
html body cart-drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.is-closing .drawer__inner {
  transition: transform 227ms cubic-bezier(.4,0,1,1) !important;
  transform: translate3d(100%, 0, 0) !important;
}

@media screen and (min-width: 750px) {
  html body cart-drawer.drawer #CartDrawer,
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer .drawer__inner,
  html body #CartDrawer,
  html body #CartDrawer .drawer__inner {
    width: 452px !important;
    max-width: 452px !important;
  }
}

/* Only the item list scrolls inside the drawer. Page behind cannot scroll. */
html body #CartDrawer .drawer__inner {
  display: flex !important;
  flex-direction: column !important;
}
html body #CartDrawer cart-drawer-items {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
html body #CartDrawer .cart-drawer__footer {
  flex: 0 0 auto !important;
}


/* =========================================================
   NRN CART DRAWER v31 — RELIABLE ATC OPEN + DIM 51
   - Add-to-cart button is never blocked while drawer is closed
   - Backdrop only receives clicks after drawer is active
   - Dim strength hard-set to 51%
   - Website/page never transforms; only drawer panel slides
   ========================================================= */

body > .nrn-cart-backdrop-v27 {
  background: rgba(0, 0, 0, 0.57) !important;
  background-color: rgba(0, 0, 0, 0.57) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  transition: opacity 180ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 180ms !important;
}
body.nrn-cart-open-v27 > .nrn-cart-backdrop-v27 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 180ms cubic-bezier(.32,.72,0,1), visibility 0ms linear 0ms !important;
}

/* Closed drawer shell must not block product page ATC/variant clicks. */
html body cart-drawer.drawer:not(.active),
html body cart-drawer.drawer:not(.active) #CartDrawer,
html body cart-drawer.drawer:not(.active) #CartDrawer-Overlay,
html body cart-drawer.drawer:not(.active) .drawer__inner {
  pointer-events: none !important;
}

/* Active drawer: only the actual drawer panel is interactive; backdrop handles left-side close. */
html body cart-drawer.drawer.active,
html body cart-drawer.drawer.active #CartDrawer {
  pointer-events: none !important;
}
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active .drawer__inner {
  pointer-events: auto !important;
}

/* Keep every website/background container visually untouched during cart animation. */
html,
body,
#MainContent,
.shopify-section,
.product,
.product__info-wrapper,
.product__media-wrapper,
.header-wrapper,
.page-width {
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  perspective: none !important;
}

/* ATC button should not stay grey/disabled after variant changes unless truly disabled. */
product-form [type="submit"]:not([disabled]) {
  opacity: 1 !important;
  filter: none !important;
  cursor: pointer !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v35b — FINAL SCROLL-LOCK OVERRIDE (Mayberry/Bowlift pattern)

   Diagnosis: this file declares `body.nrn-cart-scroll-lock-v27` three times.
   The correct rule (around line 3441) sets `position:fixed; top:var(--nrn-cart-scroll-y)`
   so the page stays visually pinned while the drawer slides. But two later
   rules (around lines 3636 and 3830) override it with `position:static !important`,
   which kills the lock. On mobile Chrome, body:static + overflow:hidden makes
   the URL bar reappear and the visible viewport shifts up — that's the
   "scrollt nach oben" bug.

   Fix: this block is appended LAST so it wins the cascade. Body becomes
   position:fixed at the saved scroll-Y while the drawer is open; on close,
   cart-drawer.js calls window.scrollTo(0, savedY) to restore.
   ═══════════════════════════════════════════════════════════════════════ */

html.nrn-cart-scroll-lock-v27 {
  /* No overflow:hidden on html — it triggers the mobile URL-bar reflow.
     Page-scroll prevention is handled by body being position:fixed. */
}

body.nrn-cart-scroll-lock-v27 {
  position: fixed !important;
  top: var(--nrn-cart-scroll-y, 0px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  padding-right: var(--nrn-cart-scrollbar-comp, 0px) !important;
  /* Hard-cancel any transforms/filters from elsewhere — they'd break the lock. */
  transform: none !important;
  translate: none !important;
  scale: none !important;
  filter: none !important;
  contain: none !important;
}

/* ─── Cart-drawer-items + footer layout (Mayberry) ───
   The inner panel is a flex column. Items grow to fill the slack; footer
   is glued to the bottom. No gap below the footer, no JS height calc. */
html body #CartDrawer .drawer__inner,
html body #CartDrawer .drawer__inner-empty {
  display: flex !important;
  flex-direction: column !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
html body #CartDrawer .drawer__inner > .drawer__header,
html body #CartDrawer .drawer__inner > .drawer__footer,
html body #CartDrawer .drawer__inner > cart-progress-bar,
html body #CartDrawer .drawer__inner > .cd-rewards-container,
html body #CartDrawer .drawer__inner > .cart-timer {
  flex: 0 0 auto !important;
}
html body #CartDrawer .drawer__inner > cart-drawer-items {
  display: block !important;       /* custom-element defaults to inline */
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
html body #CartDrawer .drawer__footer {
  flex: 0 0 auto !important;
  margin-bottom: 0 !important;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v35c — FULL-WIDTH MOBILE DRAWER + WHITE SAFE-AREA STRIP

   1) Mobile (<750px): the drawer fills the ENTIRE screen — no left gap,
      no max-width clamp, no overlay strip on the left. Edge-to-edge.
   2) The drawer__inner extends its white background through the iOS
      safe-area-inset-bottom so the translucent Safari bottom toolbar
      doesn't show the page behind anymore.
   ═══════════════════════════════════════════════════════════════════════ */

@media screen and (max-width: 749px) {
  /* Drawer panel: full width, edge-to-edge */
  html body #CartDrawer .drawer__inner,
  html body #CartDrawer .drawer__inner-empty,
  html body cart-drawer .drawer__inner,
  html body cart-drawer .drawer__inner-empty {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  /* Container that holds the inner panel — also full width */
  html body #CartDrawer,
  html body cart-drawer .cart-drawer {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
  }
  /* Hide the overlay/backdrop click-zone on the left (drawer is full
     width now, no left strip to show through). Backdrop only behind
     drawer for visual dimming on slide-in. */
  html body #CartDrawer-Overlay,
  html body cart-drawer #CartDrawer-Overlay,
  html body cart-drawer .cart-drawer__overlay {
    width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
  }
}

/* Solid white through the iOS safe-area strip (under the translucent
   Safari URL bar). Background extends past the footer's content
   padding so nothing of the page behind ever peeks through.
   This works because the drawer__inner already has white bg and
   100dvh height — we just guarantee no element below the footer
   leaves a transparent gap. */
html body #CartDrawer .drawer__inner,
html body #CartDrawer .drawer__inner-empty,
html body cart-drawer .drawer__inner,
html body cart-drawer .drawer__inner-empty {
  background: #ffffff !important;
}
html body #CartDrawer .drawer__footer,
html body #CartDrawer .cart-drawer__footer,
html body cart-drawer .drawer__footer,
html body cart-drawer .cart-drawer__footer {
  background: #ffffff !important;
}
/* The cart-drawer host fills the viewport — give it a white floor too
   so even if a child has a gap, the safe-area zone stays white instead
   of showing the dimmed page behind via the translucent Safari toolbar. */
html body cart-drawer.drawer.active::before,
html body cart-drawer.active::before {
  content: "" !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: env(safe-area-inset-bottom, 0px) !important;
  background: #ffffff !important;
  z-index: 2147483099 !important;
  pointer-events: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v35d — HARD RESET: drawer fills the entire mobile viewport, edge-to-edge.
   No left gap, no overlay strip, no width clamp, no border-radius, nothing.

   Specificity matters here: every selector uses ID + class stacking so it
   beats the existing (0,3,1) rules like `cart-drawer.drawer.active .drawer__inner`.
   The selectors below target every state (idle, .active, .is-closing,
   .is-empty, .nrn-cart-loading) and every container (#CartDrawer,
   cart-drawer.drawer, .drawer__inner, .drawer__inner-empty).
   ═══════════════════════════════════════════════════════════════════════ */

@media screen and (max-width: 749px) {

  /* The cart-drawer host element — full viewport */
  html body cart-drawer.drawer,
  html body cart-drawer.drawer.active,
  html body cart-drawer.drawer.is-closing,
  html body cart-drawer.drawer.is-empty {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
  }

  /* Inner container #CartDrawer — full viewport */
  html body cart-drawer.drawer #CartDrawer,
  html body cart-drawer.drawer.active #CartDrawer,
  html body cart-drawer.drawer.is-closing #CartDrawer,
  html body #CartDrawer.cart-drawer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: 100dvh !important;
  }

  /* The white panel that slides in — edge-to-edge, no border, no shadow,
     no radius. Slides in from the right (translateX 100% → 0). */
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
  html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty,
  html body #CartDrawer.cart-drawer .drawer__inner,
  html body #CartDrawer.cart-drawer .drawer__inner-empty {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    border: 0 !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #ffffff !important;
    transform: translate3d(100%, 0, 0) !important;
    transition: transform 320ms cubic-bezier(0.32, 0.72, 0, 1) !important;
  }
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
  html body #CartDrawer.cart-drawer.active .drawer__inner,
  html body .drawer.active #CartDrawer.cart-drawer .drawer__inner {
    transform: translate3d(0, 0, 0) !important;
  }
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
    transform: translate3d(100%, 0, 0) !important;
    transition: transform 240ms cubic-bezier(0.4, 0, 1, 1) !important;
  }

  /* Overlay/backdrop — drawer is full-width now, no left strip to dim.
     Hide them completely. The body-fixed scroll-lock is the only thing
     keeping the page behind in place. */
  html body cart-drawer.drawer #CartDrawer-Overlay,
  html body cart-drawer.drawer.active #CartDrawer-Overlay,
  html body cart-drawer.drawer.is-closing #CartDrawer-Overlay,
  html body cart-drawer #CartDrawer-Overlay,
  html body #CartDrawer-Overlay,
  html body cart-drawer .cart-drawer__overlay,
  html body cart-drawer.drawer .cart-drawer__overlay {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  /* Body-level backdrop (from cart-drawer.js _ensureNrnBackdropV27) — also hide */
  html body > .nrn-cart-backdrop-v27 {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* iOS Safari safe-area floor — white strip under the translucent URL bar.
   On full-width drawer this must extend the white floor edge-to-edge. */
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer.active::before,
  html body cart-drawer.active::before {
    content: "" !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: env(safe-area-inset-bottom, 0px) !important;
    background: #ffffff !important;
    z-index: 2147483099 !important;
    pointer-events: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v35e — Faster, smoother slide animation. 320ms → 260ms with a slightly
   gentler ease-out so the panel "settles" instead of snapping. Closing is
   240ms → 220ms with a sharper ease-in for a quick exit. The selectors
   match the v35d hard-reset specificity so this wins.
   ═══════════════════════════════════════════════════════════════════════ */

html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
  transition: transform 260ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
  transition: transform 220ms cubic-bezier(0.55, 0, 0.7, 0.2) !important;
}

/* Loading-state dim while content is being swapped — gentle 0.55 opacity,
   smooth fade when the new content arrives. No translateY pulse. */
html body cart-drawer.drawer.nrn-cart-loading #CartDrawer .drawer__inner > *:not(.drawer__header):not(.drawer__fixed-header) {
  opacity: 0.55 !important;
  transition: opacity 160ms ease !important;
  pointer-events: none !important;
}
html body cart-drawer.drawer:not(.nrn-cart-loading) #CartDrawer .drawer__inner > *:not(.drawer__header):not(.drawer__fixed-header) {
  opacity: 1 !important;
  transition: opacity 200ms ease !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   v35h REAL — Mobile rewards text + faster ATC-to-drawer open.
   - Rewards text: +0.5px from v35g, more letter spacing, +1px bottom gap.
   - Drawer visible open transition: slightly faster (245ms).
   ═══════════════════════════════════════════════════════════════════════ */
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer #CartDrawer .cd-rewards-text p,
  html body cart-drawer.drawer.active #CartDrawer .cd-rewards-text p,
  html body #CartDrawer .cd-rewards-text p,
  html body .cd-rewards-text p {
    font-size: 18.25px !important;
    letter-spacing: 0.06em !important;
    word-spacing: 0.14em !important;
    margin-bottom: 22px !important;
    line-height: 1.22 !important;
  }
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty {
    transition: transform 245ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   v35i — Race-proof faster drawer + mobile rewards text update
   - Mobile rewards: +0.75px from v35h and letter-spacing 0.08em.
   - Drawer open/close transition slightly faster.
   ═══════════════════════════════════════════════════════════════════════ */
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer #CartDrawer .cd-rewards-text p,
  html body cart-drawer.drawer.active #CartDrawer .cd-rewards-text p,
  html body #CartDrawer .cd-rewards-text p,
  html body .cd-rewards-text p {
    font-size: 19px !important;
    letter-spacing: 0.08em !important;
    word-spacing: 0.05em !important;
    margin-bottom: 22px !important;
    line-height: 1.22 !important;
  }

  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty {
    transition: transform 225ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
  }

  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
    transition: transform 195ms cubic-bezier(0.55, 0, 0.7, 0.2) !important;
  }
}
html body #CartDrawer .cd-rewards-text p,
html body #CartDrawer #cd-rewards-msg {
  margin-bottom: 38px !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   BUG FIX: Mobile white gap below cart drawer
   - overscroll-behavior:none on html+body prevents iOS rubber-band bounce
     that reveals the page background beneath the drawer
   - cart-drawer host gets explicit white background
   - ::after creates a fixed white floor 60px below screen bottom —
     physically impossible for any gap to show through
   ═══════════════════════════════════════════════════════════════════════ */
@media screen and (max-width: 749px) {
  html.nrn-cart-scroll-lock-v27,
  body.nrn-cart-scroll-lock-v27 {
    overscroll-behavior: none !important;
    -webkit-overflow-scrolling: auto !important;
  }

  cart-drawer,
  #CartDrawer {
    background: #ffffff !important;
  }

  cart-drawer::after {
    content: '';
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: -60px;
    height: 60px;
    background: #ffffff;
    z-index: 9999;
    pointer-events: none;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v36 — HARD FIX: Kein Raus-Scrollen unten aus dem Cart Drawer.
   Mobile Safari rubber-band bounce wird auf allen Ebenen blockiert.
   ═══════════════════════════════════════════════════════════════════════ */

/* 1) Die cart-drawer-items Scroll-Box: overscroll:none blockiert den Bounce
      komplett (kein contain, kein auto — nur none). touch-action:pan-y
      hält den Touch-Stream in der Scroll-Box, kein Event-Propagation
      zum document. */
html body #CartDrawer cart-drawer-items,
html body cart-drawer cart-drawer-items,
cart-drawer-items {
  overscroll-behavior: none !important;
  overscroll-behavior-y: none !important;
  -webkit-overflow-scrolling: auto !important;
  touch-action: pan-y !important;
}

/* 2) Der drawer__inner (Panel): overflow:hidden auf allen Achsen.
      height + max-height auf 100dvh — kein Element kann über den
      Viewport hinauswachsen. */
html body #CartDrawer .drawer__inner,
html body cart-drawer .drawer__inner,
html body #CartDrawer .drawer__inner-empty,
html body cart-drawer .drawer__inner-empty {
  overflow: hidden !important;
  overscroll-behavior: none !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: unset !important;
}

/* 3) Der cart-drawer Host: position:fixed + overflow:hidden, kein clip
      nach unten möglich. */
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body cart-drawer.drawer.is-closing {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

/* 4) Wenn scroll-lock aktiv: html + body kein overscroll und kein
      -webkit-overflow-scrolling:touch (das erlaubt Momentum-Scroll
      über den sichtbaren Bereich hinaus). */
html.nrn-cart-scroll-lock-v27 {
  overscroll-behavior: none !important;
  -webkit-overflow-scrolling: auto !important;
  overflow: hidden !important;
}
body.nrn-cart-scroll-lock-v27 {
  overscroll-behavior: none !important;
  -webkit-overflow-scrolling: auto !important;
}

/* ═══════════════════════════════════════════════════════════════════════

/* ═══════════════════════════════════════════════════════════════════════
   v37 FINAL — Gap unten im Cart Drawer auf Chrome Android eliminieren.

   URSACHE: height:100dvh ändert sich wenn die Nav-Bar ein-/ausblendet.
   Während der Animation wächst das Panel über den sichtbaren Bereich
   hinaus → weißer Gap unten, man kann rausscrollen.

   FIX: Kein height-Wert auf dem Host und Panel — stattdessen
   top:0 + bottom:0. Das klebt direkt an den aktuellen Viewport-Kanten,
   egal was die Nav-Bar macht. Kein height-Recalc, keine Animation-Lücke.
   ═══════════════════════════════════════════════════════════════════════ */

/* Host-Element: top+bottom statt height */
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body cart-drawer.drawer.is-closing,
html body cart-drawer.drawer.is-empty {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  /* NO height/max-height — top+bottom anchors are enough and don't lag */
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

/* Inner panel: top+bottom statt height, für mobile */
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
  html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty,
  html body #CartDrawer .drawer__inner,
  html body #CartDrawer .drawer__inner-empty {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: 100vw !important;
    max-width: 100vw !important;
    /* NO height — let top+bottom define the height */
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    display: flex !important;
    flex-direction: column !important;
  }
}

/* Desktop: panel behält height:100% (relativ zum fixed Host) */
@media screen and (min-width: 750px) {
  html body #CartDrawer .drawer__inner,
  html body cart-drawer .drawer__inner,
  html body #CartDrawer .drawer__inner-empty,
  html body cart-drawer .drawer__inner-empty {
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
}

/* cart-drawer-items bleibt scroll-container, füllt den verfügbaren Platz */
html body #CartDrawer cart-drawer-items,
html body cart-drawer cart-drawer-items {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: none !important;
  -webkit-overflow-scrolling: auto !important;
  touch-action: pan-y !important;
}

/* Sticky ATC: bottom:0 klebt immer an der sichtbaren Unterkante */
.nrn-sticky-atc {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  /* Weißer Floor unter dem sichtbaren Inhalt bis zum echten Bildschirmrand */
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
}
.nrn-sticky-atc::after {
  content: '' !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: calc(env(safe-area-inset-bottom, 0px) + 2px) !important;
  background: #ffffff !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v38 FINAL — Chrome Android Nav-Bar Gap: ECHTER Fix.

   URSACHE: Das Panel hat top:0 + bottom:0 + height:100dvh gleichzeitig.
   Bei position:fixed mit expliziter height ignoriert der Browser bottom:0.
   Wenn die Nav-Bar verschwindet und dvh wächst, wächst das Panel über
   den sichtbaren Bereich hinaus → Gap unten, Drawer verschoben.

   FIX: height:auto auf Host + Panel. top:0 + bottom:0 definieren die
   Größe komplett — kein dvh, kein vh, keine Berechnungen. Das Panel
   klebt immer exakt an den aktuellen sichtbaren Viewport-Kanten.
   ═══════════════════════════════════════════════════════════════════════ */

html body cart-drawer,
html body cart-drawer.drawer,
html body cart-drawer.drawer.active,
html body cart-drawer.drawer.is-closing,
html body cart-drawer.drawer.is-empty {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

html body cart-drawer.drawer #CartDrawer,
html body cart-drawer.drawer.active #CartDrawer,
html body cart-drawer.drawer.is-closing #CartDrawer,
html body #CartDrawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
}

html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
html body #CartDrawer .drawer__inner,
html body #CartDrawer .drawer__inner-empty {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v39 — QUANTITY STEPPER LEFT-CLIP FIX + FOOTER BENEFITS NOTE +
         FASTER/SMOOTHER SLIDE-IN + HARD SCROLL CONTAINMENT
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1) Quantity stepper: never clipped on the left ──
   Root cause: .cart-item__totals is flex row-reverse. When the price +
   stepper exceed the cell width, flex overflow goes to the LEFT and the
   drawer's overflow-x:hidden cuts the minus button off. Fix: the stepper
   and all its wrappers are rigid (flex:0 0 auto, min-width), the price
   wrapper is the only thing allowed to shrink, and the stepper itself is
   border-box so the 1px border + radius always render fully. */
.cart-drawer .cart-item__totals,
#CartDrawer .cart-item__totals {
  min-width: 0 !important;
  max-width: 100% !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}
.cart-drawer .cart-item__price-wrapper,
#CartDrawer .cart-item__price-wrapper {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
.cart-drawer .cart-item__quantity,
#CartDrawer .cart-item__quantity,
.cart-drawer .cart-item__quantity quantity-popover,
.cart-drawer .cart-item__quantity .quantity-popover-wrapper,
.cart-drawer .cart-item__quantity .cart-item__quantity-wrapper,
.cart-drawer .cart-item__quantity .quantity-popover-container,
#CartDrawer .cart-item__quantity quantity-popover,
#CartDrawer .cart-item__quantity .quantity-popover-wrapper,
#CartDrawer .cart-item__quantity .cart-item__quantity-wrapper,
#CartDrawer .cart-item__quantity .quantity-popover-container {
  flex: 0 0 auto !important;
  min-width: 96px !important;
  max-width: 96px !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
}
.cart-drawer .cart-item__quantity .quantity,
#CartDrawer .cart-item__quantity .quantity {
  box-sizing: border-box !important;
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  border: 1px solid rgba(var(--color-foreground), 0.12) !important;
  border-radius: 7px !important;
  overflow: hidden !important;
}
.cart-drawer .cart-item__quantity .quantity__button:first-child,
#CartDrawer .cart-item__quantity .quantity__button:first-child {
  margin-left: 0 !important;
}
.cart-drawer .cart-item__quantity .quantity__button:last-child,
#CartDrawer .cart-item__quantity .quantity__button:last-child {
  margin-right: 0 !important;
}
.cart-drawer .cart-item__quantity .quantity__input,
#CartDrawer .cart-item__quantity .quantity__input {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: 36px !important;
  padding: 0 !important;
}

/* ── 2) Footer benefits note (replaces the old "Shipping / Free" row) ──
   One centered, quiet line. Now sits directly below the Trustpilot row,
   so it only needs a small amount of breathing room above/below instead
   of the larger gap it used when it separated the item list from the
   totals block. */
.cart-drawer__footer .cd-footer-benefits,
#CartDrawer .cd-footer-benefits {
  margin: 0 !important;
  padding: 6px 0 4px !important;
  text-align: center !important;
}
.cart-drawer__footer .cd-footer-benefits__text,
#CartDrawer .cd-footer-benefits__text {
  margin: 0 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: 0.007em !important;
  word-spacing: 0.112em !important;
  line-height: 1.35 !important;
  color: rgba(26, 26, 26, 0.94) !important;
  white-space: nowrap !important;
  overflow: visible !important;
}
@media screen and (max-width: 749px) {
  .cart-drawer__footer .cd-footer-benefits__text,
  #CartDrawer .cd-footer-benefits__text {
    font-size: 15px !important;
  }
}
@media screen and (min-width: 750px) {
  .cart-drawer__footer .cd-footer-benefits__text,
  #CartDrawer .cd-footer-benefits__text {
    font-size: 16px !important;
  }
}

/* ── 3) Slide-in: 50ms faster, minimally smoother settle ──
   Open transition durations reduced by 50ms (mobile 225→175ms, desktop
   260→210ms) with the Apple-style ease-out for a softer landing.
   Close timings stay untouched (re-declared after so they keep winning). */
html body cart-drawer.drawer #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty {
  transition: transform 210ms cubic-bezier(0.32, 0.72, 0, 1) !important;
}
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
  html body cart-drawer.drawer #CartDrawer .drawer__inner-empty,
  html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty {
    transition: transform 175ms cubic-bezier(0.32, 0.72, 0, 1) !important;
  }
}
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
  transition: transform 220ms cubic-bezier(0.55, 0, 0.7, 0.2) !important;
}
@media screen and (max-width: 749px) {
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
  html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
    transition: transform 195ms cubic-bezier(0.55, 0, 0.7, 0.2) !important;
  }
}

/* ── 4) Hard scroll containment — nothing scrolls "out" of the drawer ──
   The scroll lock is now applied by JS BEFORE the slide-in starts, so the
   page behind can never move during/after opening. These rules back that
   up: every non-scrolling part of the drawer refuses pan gestures, and
   the items list is the single contained scroll surface. */
html body #CartDrawer .drawer__footer,
html body #CartDrawer .drawer__header,
html body #CartDrawer .cd-rewards-container,
html body cart-drawer .drawer__footer,
html body cart-drawer .drawer__header,
html body cart-drawer .cd-rewards-container {
  overscroll-behavior: none !important;
  touch-action: manipulation !important;
}
html body #CartDrawer cart-drawer-items,
html body cart-drawer cart-drawer-items {
  overscroll-behavior: none !important;
  overscroll-behavior-y: none !important;
  touch-action: pan-y !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v42 ANTI-FLASH — kill the "content flashes once, disappears, THEN the
   drawer slides in" glitch.

   Root cause: with the many historical .drawer__inner transform rules in
   this file, the closed-state transform that actually wins is unpredictable,
   so for one frame the panel can paint at its on-screen destination (content
   visible) before the off-screen transform commits — then it jumps off and
   slides back in. That single painted frame is the flash.

   Fix (transform-independent): the panel is INVISIBLE whenever the drawer is
   not .active. The instant .active is added it becomes visible and slides in
   via the existing transform transition (opacity/visibility are NOT in that
   transition, so they flip instantly — no fade, perfectly clean slide). The
   host (cart-drawer.drawer) already has overflow:hidden, so the now-visible
   panel at its off-screen start position stays clipped until it slides in.
   This block is appended LAST so it wins the cascade.
   ═══════════════════════════════════════════════════════════════════════ */
html body cart-drawer.drawer:not(.active):not(.is-closing) #CartDrawer .drawer__inner,
html body cart-drawer.drawer:not(.active):not(.is-closing) #CartDrawer .drawer__inner-empty {
  visibility: hidden !important;
  opacity: 0 !important;
}
html body cart-drawer.drawer.active #CartDrawer .drawer__inner,
html body cart-drawer.drawer.active #CartDrawer .drawer__inner-empty,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner,
html body cart-drawer.drawer.is-closing #CartDrawer .drawer__inner-empty {
  visibility: visible !important;
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   HARD GUARANTEE — rewards/upsell bar always shows when the cart has items.
   Appended LAST so it beats any legacy rule anywhere above (this file has
   accumulated many historical layout fixes and some could theoretically
   collapse/hide a sibling of .drawer__header). This makes the bar's
   visibility unconditional whenever the drawer is not in its empty state.
   ═══════════════════════════════════════════════════════════════════════ */
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container,
html body #CartDrawer .drawer__inner:not(.is-empty) > .cd-rewards-container {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  position: relative !important;
  pointer-events: auto !important;
  flex: 0 0 auto !important;
}
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-bar-block,
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-progress-container,
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-icon-container-wrapper,
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-rewards-text {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-icon-container-wrapper {
  display: flex !important;
}
html body cart-drawer:not(.is-empty) #CartDrawer .cd-rewards-container .cd-icon-container {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
