/*
 * OPTIONAL RSVP FLOWER BURST
 * Set submitFlowerBurst to false in rsvp-config.js, or remove this file,
 * to disable the confirmation animation without changing the website.
 */

.submit-flower-burst {
  position: fixed;
  inset: 0;
  z-index: 95;
  overflow: hidden;
  pointer-events: none;
}

.submit-flower {
  --submit-flower-size: 4rem;
  --submit-flower-color: var(--blue);
  --submit-flower-center: var(--paper);
  --submit-flower-x: 0rem;
  --submit-flower-y: 0rem;
  --submit-flower-rotation: 0deg;
  position: absolute;
  left: var(--submit-flower-left);
  top: var(--submit-flower-top);
  width: var(--submit-flower-size);
  height: var(--submit-flower-size);
  color: var(--submit-flower-color);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0.72) rotate(var(--submit-flower-rotation));
  filter: blur(0.1px);
}

.submit-flower svg {
  width: 100%;
  height: 100%;
  display: block;
}

@media (prefers-reduced-motion: reduce) {
  html:not(.submit-flower-burst-test) .submit-flower-burst {
    display: none;
  }
}