/* Gift card calls to action and the shared Digital / Envelope switch. */
html body #lsl-main-header .lsl-gift-button,
html body #lsl-voucher-promo-en .gift-link {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: #d93850;
  background: #d93850;
  color: #fff;
  transition: background-color .2s ease, border-color .2s ease;
}

html body #lsl-main-header .lsl-gift-button:hover,
html body #lsl-main-header .lsl-gift-button:focus-visible,
html body #lsl-voucher-promo-en .gift-link:hover,
html body #lsl-voucher-promo-en .gift-link:focus-visible {
  border-color: #b82239;
  background: #b82239;
  color: #fff;
}

html body #lsl-main-header .lsl-gift-button::after,
html body #lsl-voucher-promo-en .gift-link::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: -30%;
  bottom: -30%;
  left: -55%;
  width: 40%;
  pointer-events: none;
  transform: skewX(-22deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.08) 25%, rgba(255,255,255,.5) 50%, rgba(255,255,255,.08) 75%, transparent);
  animation: lsl-gift-shine 5.5s ease-in-out infinite;
}

@keyframes lsl-gift-shine {
  0% { left: -55%; }
  20%, 100% { left: 125%; }
}

html body #lsl-voucher-promo-en .gift-controls {
  width: 100%;
}

html body #lsl-voucher-promo-en .gift-switcher {
  display: grid;
  width: min(100%, 440px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 0;
  padding: 0;
  border: 1px solid #17171b;
}

html body #lsl-voucher-promo-en .gift-tab {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  background: transparent;
  color: #17171b;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .06em;
  text-align: center;
  text-transform: uppercase;
}

html body #lsl-voucher-promo-en .gift-tab::before {
  display: none;
}

html body #lsl-voucher-promo-en .gift-tab[aria-selected="true"] {
  background: #1c1c22;
  color: #fff;
}

html body #lsl-voucher-promo-en .gift-arrow {
  display: none;
}

@media (max-width: 640px) {
  html body #lsl-voucher-promo-en .gift-switcher {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #lsl-main-header .lsl-gift-button::after,
  html body #lsl-voucher-promo-en .gift-link::after {
    animation: none;
    display: none;
  }
}