/* Seasonal decorations are moved to document.body by class-yatoon-frontend.php.
 * This sheet is enqueued after the production booking core, so the viewport
 * layer and emoji do not depend on the debug-only frontend.css file. */
.yatoon-effect-viewport-layer {
  position: fixed !important; inset: 0 !important; display: block !important;
  width: 100vw !important; height: 100vh !important; overflow: hidden !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  background: transparent !important; pointer-events: none !important;
  z-index: 2147483000 !important;
}
.yatoon-effect-viewport-layer > span { position: absolute !important; top: -2rem !important; pointer-events: none !important; user-select: none !important; }
.yatoon-effect-viewport-layer .yatoon-pumpkin-emoji {
  display: block !important; left: var(--yatoon-pumpkin-left) !important;
  width: var(--yatoon-pumpkin-size) !important; height: var(--yatoon-pumpkin-size) !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; box-shadow: none !important; text-shadow: none !important;
  color: initial !important; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
  font-size: var(--yatoon-pumpkin-size) !important; font-style: normal !important; font-weight: normal !important;
  line-height: 1 !important; white-space: nowrap !important;
  animation: yatoon-viewport-pumpkins var(--yatoon-pumpkin-duration) ease-in-out var(--yatoon-pumpkin-delay) infinite !important;
}
.yatoon-effect-viewport-layer .yatoon-pumpkin-emoji::before,
.yatoon-effect-viewport-layer .yatoon-pumpkin-emoji::after { content: none !important; display: none !important; }
.yatoon-pumpkin-emoji:nth-child(1) { --yatoon-pumpkin-left: 13%; --yatoon-pumpkin-size: 20px; --yatoon-pumpkin-duration: 25s; --yatoon-pumpkin-delay: -6s; }
.yatoon-pumpkin-emoji:nth-child(2) { --yatoon-pumpkin-left: 38%; --yatoon-pumpkin-size: 17px; --yatoon-pumpkin-duration: 29s; --yatoon-pumpkin-delay: -17s; }
.yatoon-pumpkin-emoji:nth-child(3) { --yatoon-pumpkin-left: 65%; --yatoon-pumpkin-size: 22px; --yatoon-pumpkin-duration: 27s; --yatoon-pumpkin-delay: -11s; }
.yatoon-pumpkin-emoji:nth-child(4) { --yatoon-pumpkin-left: 88%; --yatoon-pumpkin-size: 16px; --yatoon-pumpkin-duration: 31s; --yatoon-pumpkin-delay: -23s; }
@keyframes yatoon-viewport-pumpkins {
  0% { transform: translate3d(0,-2rem,0) rotate(-10deg); }
  24% { transform: translate3d(-28px,21vh,0) rotate(18deg); }
  49% { transform: translate3d(33px,48vh,0) rotate(-14deg); }
  75% { transform: translate3d(-25px,73vh,0) rotate(22deg); }
  100% { transform: translate3d(20px,calc(100vh + 2rem),0) rotate(-8deg); }
}
.yatoon-effect-viewport-layer .yatoon-bat {
  left: var(--yatoon-bat-left) !important; width: 19px !important; height: 11px !important;
  background: rgba(91,42,134,.52) !important; border: 0 !important; border-radius: 0 !important;
  clip-path: polygon(0 35%,20% 42%,35% 18%,50% 40%,65% 18%,80% 42%,100% 35%,86% 67%,70% 60%,50% 100%,30% 60%,14% 67%) !important;
  animation: yatoon-viewport-bats var(--yatoon-bat-duration) ease-in-out var(--yatoon-bat-delay) infinite !important;
}
.yatoon-bat:nth-child(1) { --yatoon-bat-left: 10%; --yatoon-bat-duration: 24s; --yatoon-bat-delay: -6s; }
.yatoon-bat:nth-child(2) { --yatoon-bat-left: 29%; --yatoon-bat-duration: 28s; --yatoon-bat-delay: -18s; opacity: .7; }
.yatoon-bat:nth-child(3) { --yatoon-bat-left: 52%; --yatoon-bat-duration: 26s; --yatoon-bat-delay: -12s; }
.yatoon-bat:nth-child(4) { --yatoon-bat-left: 73%; --yatoon-bat-duration: 30s; --yatoon-bat-delay: -22s; opacity: .66; }
.yatoon-bat:nth-child(5) { --yatoon-bat-left: 89%; --yatoon-bat-duration: 27s; --yatoon-bat-delay: -9s; opacity: .62; }
@keyframes yatoon-viewport-bats {
  0% { transform: translate3d(0,-2rem,0) rotate(-15deg); }
  20% { transform: translate3d(38px,17vh,0) rotate(16deg); }
  43% { transform: translate3d(-31px,39vh,0) rotate(-10deg); }
  68% { transform: translate3d(42px,64vh,0) rotate(18deg); }
  100% { transform: translate3d(-28px,calc(100vh + 2rem),0) rotate(-13deg); }
}
.yatoon-effect-viewport-layer .yatoon-snowflake {
  left: var(--yatoon-snow-left) !important; color: rgba(183,139,74,.68) !important;
  font-size: var(--yatoon-snow-size) !important; line-height: 1 !important;
  animation: yatoon-viewport-snow var(--yatoon-snow-duration) linear var(--yatoon-snow-delay) infinite !important;
}
.yatoon-snowflake:nth-child(1) { --yatoon-snow-left: 8%; --yatoon-snow-size: 13px; --yatoon-snow-duration: 17s; --yatoon-snow-delay: -3s; }
.yatoon-snowflake:nth-child(2) { --yatoon-snow-left: 22%; --yatoon-snow-size: 10px; --yatoon-snow-duration: 21s; --yatoon-snow-delay: -12s; }
.yatoon-snowflake:nth-child(3) { --yatoon-snow-left: 39%; --yatoon-snow-size: 16px; --yatoon-snow-duration: 19s; --yatoon-snow-delay: -8s; }
.yatoon-snowflake:nth-child(4) { --yatoon-snow-left: 56%; --yatoon-snow-size: 11px; --yatoon-snow-duration: 23s; --yatoon-snow-delay: -15s; }
.yatoon-snowflake:nth-child(5) { --yatoon-snow-left: 71%; --yatoon-snow-size: 14px; --yatoon-snow-duration: 18s; --yatoon-snow-delay: -5s; }
.yatoon-snowflake:nth-child(6) { --yatoon-snow-left: 84%; --yatoon-snow-size: 9px; --yatoon-snow-duration: 24s; --yatoon-snow-delay: -18s; }
.yatoon-snowflake:nth-child(7) { --yatoon-snow-left: 94%; --yatoon-snow-size: 12px; --yatoon-snow-duration: 20s; --yatoon-snow-delay: -10s; }
@keyframes yatoon-viewport-snow {
  0% { transform: translate3d(0,-2rem,0) rotate(0); }
  22% { transform: translate3d(26px,18vh,0) rotate(100deg); }
  46% { transform: translate3d(-22px,42vh,0) rotate(215deg); }
  71% { transform: translate3d(30px,67vh,0) rotate(315deg); }
  100% { transform: translate3d(-16px,calc(100vh + 2rem),0) rotate(430deg); }
}
.yatoon-effect-viewport-layer[data-yatoon-template="festive-red"][data-yatoon-color-scheme="dark"] .yatoon-snowflake { color: rgba(255,247,243,.8) !important; }
@media (prefers-color-scheme: dark) { .yatoon-effect-viewport-layer[data-yatoon-template="festive-red"][data-yatoon-color-scheme="follow-system"] .yatoon-snowflake { color: rgba(255,247,243,.8) !important; } }
.yatoon-effect-viewport-layer .yatoon-leaf {
  left: var(--yatoon-leaf-left) !important; font-size: var(--yatoon-leaf-size) !important;
  line-height: 1 !important; opacity: .78 !important;
  animation: yatoon-viewport-leaves var(--yatoon-leaf-duration) ease-in-out var(--yatoon-leaf-delay) infinite !important;
}
.yatoon-leaf:nth-child(1) { --yatoon-leaf-left: 7%; --yatoon-leaf-size: 17px; --yatoon-leaf-duration: 19s; --yatoon-leaf-delay: -4s; }
.yatoon-leaf:nth-child(2) { --yatoon-leaf-left: 21%; --yatoon-leaf-size: 13px; --yatoon-leaf-duration: 23s; --yatoon-leaf-delay: -16s; }
.yatoon-leaf:nth-child(3) { --yatoon-leaf-left: 36%; --yatoon-leaf-size: 19px; --yatoon-leaf-duration: 21s; --yatoon-leaf-delay: -9s; }
.yatoon-leaf:nth-child(4) { --yatoon-leaf-left: 52%; --yatoon-leaf-size: 14px; --yatoon-leaf-duration: 25s; --yatoon-leaf-delay: -20s; }
.yatoon-leaf:nth-child(5) { --yatoon-leaf-left: 67%; --yatoon-leaf-size: 18px; --yatoon-leaf-duration: 20s; --yatoon-leaf-delay: -7s; }
.yatoon-leaf:nth-child(6) { --yatoon-leaf-left: 81%; --yatoon-leaf-size: 12px; --yatoon-leaf-duration: 24s; --yatoon-leaf-delay: -13s; }
.yatoon-leaf:nth-child(7) { --yatoon-leaf-left: 94%; --yatoon-leaf-size: 16px; --yatoon-leaf-duration: 22s; --yatoon-leaf-delay: -18s; }
@keyframes yatoon-viewport-leaves {
  0% { transform: translate3d(0,-2rem,0) rotate(0); }
  25% { transform: translate3d(32px,24vh,0) rotate(95deg); }
  50% { transform: translate3d(-28px,50vh,0) rotate(205deg); }
  76% { transform: translate3d(34px,76vh,0) rotate(305deg); }
  100% { transform: translate3d(-20px,calc(100vh + 2rem),0) rotate(420deg); }
}
@media (prefers-reduced-motion: reduce) { .yatoon-effect-viewport-layer { display: none !important; } }

/* Keep decorations visible throughout scrolling on mobile and desktop. */
.yatoon-effect-viewport-layer { clip-path: none !important; opacity: .8; }
@media (max-width: 600px) { .yatoon-effect-viewport-layer { opacity: .65; } }