/* Cart drawer "More below" and "More above": zero-height rows stuck to the
   bottom and top of the scrolling item list, each carrying its fade and
   pill over the list. */
.bde-mini-cart .woocommerce-mini-cart > .xr-cart-more {
  position: sticky;
  flex: none;
  height: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.bde-mini-cart .woocommerce-mini-cart > .xr-cart-more--below {
  bottom: 0;
}

.bde-mini-cart .woocommerce-mini-cart > .xr-cart-more--above {
  top: 0;
  z-index: 1;
}

.bde-mini-cart .woocommerce-mini-cart > .xr-cart-more.is-visible {
  opacity: 1;
}

.bde-mini-cart .xr-cart-more::before {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  height: 72px;
}

.bde-mini-cart .xr-cart-more--below::before {
  bottom: 0;
  background: linear-gradient(rgba(244, 241, 233, 0), var(--xr-c-paper, #F4F1E9) 85%);
}

.bde-mini-cart .xr-cart-more--above::before {
  top: 0;
  background: linear-gradient(var(--xr-c-paper, #F4F1E9) 15%, rgba(244, 241, 233, 0));
}

.bde-mini-cart .xr-cart-more__pill {
  position: absolute;
  bottom: 12px;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 7px 14px;
  color: var(--xr-c-ink, #1B1A17);
  font-family: var(--xr-font-body);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: var(--xr-c-yellow, #F5B93B);
  border: 2px solid var(--xr-c-ink, #1B1A17);
  border-radius: 999px;
  cursor: pointer;
  translate: -50% 0;
  transform-origin: 50% 100%;
}

.bde-mini-cart .xr-cart-more--above .xr-cart-more__pill {
  top: 12px;
  bottom: auto;
}

.bde-mini-cart .xr-cart-more.is-visible .xr-cart-more__pill {
  pointer-events: auto;
  animation:
    xr-cart-more-hop 0.7s ease-in-out 0.3s 2,
    xr-cart-more-ring 1.8s ease-in-out 2;
}

/* A chevron drawn from two borders, pointing down (up for "More above"). */
.bde-mini-cart .xr-cart-more__pill::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-right: 2.5px solid currentColor;
  border-bottom: 2.5px solid currentColor;
  transform: rotate(45deg);
}

.bde-mini-cart .xr-cart-more--above .xr-cart-more__pill::after {
  margin-top: 4px;
  transform: rotate(-135deg);
}

.bde-mini-cart .xr-cart-more__pill:hover {
  background: var(--xr-c-ink, #1B1A17);
  color: var(--xr-c-yellow, #F5B93B);
}

.bde-mini-cart .xr-cart-more__pill:focus-visible {
  outline: 2px solid var(--xr-c-orange, #E8762C);
  outline-offset: 3px;
}

@keyframes xr-cart-more-hop {
  0%,
  100% {
    transform: translateY(0) scale(1, 1);
  }
  15% {
    transform: translateY(0) scale(1.08, 0.9);
  }
  45% {
    transform: translateY(-10px) scale(0.96, 1.05);
  }
  75% {
    transform: translateY(0) scale(1.05, 0.94);
  }
}

@keyframes xr-cart-more-ring {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(245, 185, 59, 0.6);
  }
  50% {
    box-shadow: 0 0 0 7px rgba(245, 185, 59, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bde-mini-cart .xr-cart-more.is-visible .xr-cart-more__pill {
    animation: none;
    box-shadow: 0 0 0 4px rgba(245, 185, 59, 0.45);
  }
}

/* Android Chrome can leave a toolbar-high strip under the drawer when the
   page locks scrolling, showing the page behind it. Paint the footer color
   below the drawer instead of making it taller, which would push the
   checkout button behind the toolbar. */
.bde-mini-cart .bde-mini-cart-offcanvas-body {
  box-shadow: 0 50vh 0 0 var(--xr-c-paper-2, #EFEBDF);
}