.vst-promo {
  font-family: var(--promo-font);
  background: var(--promo-background);
  color: var(--promo-text);
  border-radius: var(--promo-radius);
  overflow: hidden;
  position: relative;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  isolation: isolate;
  line-height: 1.5;
}
.vst-promo * {
  box-sizing: border-box;
}
.vst-promo-body {
  padding: 30px;
  position: relative;
}
.vst-promo-eyebrow {
  display: block;
  font-size: 10px;
  letter-spacing: 2px;
  font-weight: 750;
  color: var(--promo-accent);
}
.vst-promo .vst-promo-title {
  font-family: inherit !important;
  color: var(--promo-text) !important;
  font-size: 26px !important;
  font-weight: 700;
  line-height: 1.15 !important;
  margin: 12px 0 !important;
  overflow-wrap: anywhere;
}
.vst-promo .vst-promo-message {
  font-size: 14px;
  line-height: 1.6;
  margin: 12px 0 18px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--promo-text);
}
.vst-promo-discount {
  font-family: system-ui, sans-serif;
  font-size: clamp(42px, 10vw, 76px);
  font-weight: 850;
  letter-spacing: -4px;
  line-height: 1.15;
  color: var(--promo-accent);
  margin: 18px 0 6px;
  overflow-wrap: anywhere;
}
.vst-promo .vst-promo-code {
  width: 100%;
  display: block;
  border: 1px dashed var(--promo-accent);
  color: var(--promo-text);
  background: transparent;
  padding: 12px;
  margin: 16px 0 8px;
  border-radius: 6px;
  text-align: center;
  font:
    600 17px/1.4 system-ui,
    sans-serif;
  letter-spacing: 2px;
}
.vst-promo .vst-promo-expiry,
.vst-promo .vst-promo-fine {
  display: block;
  font-size: 11px;
  color: var(--promo-text);
  opacity: 0.75;
  line-height: 1.5;
}
.vst-promo .vst-promo-fine {
  margin-top: 16px;
}
.vst-promo-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 18px;
}
.vst-promo .vst-promo-actions .vst-live-primary {
  background: var(--promo-accent) !important;
  border: 1px solid var(--promo-accent) !important;
  color: var(--promo-button-text) !important;
}
.vst-promo .vst-promo-actions .vst-live-secondary {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--promo-text) !important;
  opacity: 0.8;
}
.vst-promo .vst-promo-actions button,
.vst-promo .vst-promo-actions a {
  padding: 12px 14px;
  border-radius: 7px;
  font:
    600 13px/1.5 system-ui,
    sans-serif;
  min-height: 44px;
  text-decoration: none;
  cursor: pointer;
}
.vst-promo button:disabled {
  opacity: 0.6;
}
.vst-promo-visual {
  display: none;
}
.vst-promo-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vst-promo--minimal .vst-promo-discount {
  font-size: 35px;
  letter-spacing: -1px;
}
.vst-promo--minimal .vst-promo-body {
  text-align: left;
}
.vst-promo--coupon:before,
.vst-promo--coupon:after {
  content: '';
  position: absolute;
  width: 130px;
  height: 130px;
  border: 25px solid var(--promo-accent);
  opacity: 0.09;
  border-radius: 50%;
  right: -70px;
  top: -65px;
  z-index: -1;
}
.vst-promo--coupon:after {
  left: -80px;
  top: auto;
  bottom: 0;
  width: 160px;
  height: 160px;
}
.vst-promo--coupon .vst-promo-title {
  max-width: 300px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.vst-promo--celebration .vst-promo-visual {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  height: 160px;
  background: var(--promo-accent);
  overflow: hidden;
}
.vst-promo--celebration .vst-promo-body {
  padding-top: 24px;
}
.vst-promo--celebration .vst-promo-discount {
  margin: 8px 0;
}
.vst-promo-gift {
  position: relative;
  width: 94px;
  height: 74px;
  background: #fff4da;
  transform: rotate(-8deg);
  box-shadow: 8px 12px 0 #00000014;
  border-radius: 3px;
  margin-top: 28px;
}
.vst-promo-gift:before {
  content: '';
  position: absolute;
  top: -9px;
  left: -6px;
  width: 106px;
  height: 20px;
  background: #fff9e9;
  border-radius: 3px;
  box-shadow: 0 3px 0 #0000000c;
}
.vst-promo-ribbon {
  position: absolute;
  left: 39px;
  top: -9px;
  width: 17px;
  height: 83px;
  background: #d75327;
}
.vst-promo-bow:before,
.vst-promo-bow:after {
  content: '';
  position: absolute;
  border: 8px solid #ffd76f;
  width: 28px;
  height: 22px;
  border-radius: 50% 50% 0 50%;
  top: -38px;
  left: 13px;
  transform: rotate(15deg);
}
.vst-promo-bow:after {
  left: 43px;
  transform: scaleX(-1) rotate(15deg);
}
.vst-promo-confetti {
  position: absolute;
  width: 8px;
  height: 15px;
  background: #fff2c6;
  top: 25px;
  left: calc(8% + var(--i) * 10%);
  transform: rotate(calc(var(--i) * 37deg));
  opacity: 0.65;
}
.vst-promo-confetti:nth-child(even) {
  top: 110px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
}
.vst-promo--split {
  display: grid;
  grid-template-columns: 35% minmax(0, 1fr);
}
.vst-promo--split .vst-promo-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--promo-accent);
  min-height: 100%;
  color: var(--promo-button-text);
}
.vst-promo-visual-label {
  font:
    800 43px/1.1 system-ui,
    sans-serif;
  overflow-wrap: anywhere;
  padding: 12px;
  letter-spacing: -2px;
}
.vst-promo--split .vst-promo-body {
  padding: 28px 20px;
  text-align: left;
}
.vst-promo--split .vst-promo-discount {
  display: none;
}
.vst-promo--split .vst-promo-title {
  font-size: 23px !important;
}
.vst-promo--midnight {
  border: 1px solid var(--promo-accent);
}
.vst-promo--midnight .vst-promo-body {
  margin: 8px;
  border: 1px solid color-mix(in srgb, var(--promo-accent) 35%, transparent);
  padding: 28px 20px;
}
.vst-promo--midnight .vst-promo-eyebrow {
  letter-spacing: 3px;
}
.vst-promo--midnight .vst-promo-title {
  font-weight: 400;
  font-size: 30px !important;
}
.vst-promo--midnight .vst-promo-discount {
  font-weight: 350;
  letter-spacing: -3px;
}
.vst-promo--ticket .vst-promo-body {
  padding-top: 26px;
  border-top: 10px solid var(--promo-accent);
}
.vst-promo--ticket .vst-promo-code {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  padding: 18px 0;
}
.vst-promo--ticket .vst-promo-eyebrow {
  letter-spacing: 4px;
}
.vst-promo--ticket .vst-promo-discount {
  font-family: Georgia, serif;
  font-style: italic;
  font-weight: 700;
}
.vst-promo--minimal:has(.vst-promo-visual img) .vst-promo-visual,
.vst-promo--coupon:has(.vst-promo-visual img) .vst-promo-visual,
.vst-promo--midnight:has(.vst-promo-visual img) .vst-promo-visual,
.vst-promo--ticket:has(.vst-promo-visual img) .vst-promo-visual {
  display: block;
  height: 150px;
}
.vst-live-popup.vst-live-designed {
  padding: 0;
  border: 0;
  border-radius: var(--popup-radius, 18px);
  width: min(480px, calc(100vw - 32px));
  background: transparent;
}
.vst-live-designed .vst-live-popup-status:empty {
  display: none;
}
@media (max-width: 420px) {
  .vst-promo-body {
    padding: 24px;
  }
  .vst-promo--split {
    grid-template-columns: 30% minmax(0, 1fr);
  }
  .vst-promo--split .vst-promo-body {
    padding: 22px 14px;
  }
  .vst-promo-visual-label {
    font-size: 32px;
  }
}

.vst-promo-discount--words {
  font-size: 38px;
  letter-spacing: -1.5px;
}
