/* Seasonal overlay styles */
.seasonal-particles {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  overflow: hidden;
}

.seasonal-particles span {
  position: absolute;
  top: -6%;
  display: inline-block;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .18));
  animation-name: seasonFall;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform;
}

@keyframes seasonFall {
  0% {
    transform: translateY(0) translateX(0) rotate(0deg);
  }

  50% {
    transform: translateY(55vh) translateX(3vw) rotate(180deg);
  }

  100% {
    transform: translateY(112vh) translateX(-2vw) rotate(360deg);
  }
}

/* Greeting toast */
.seasonal-toast {
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translate(-50%, -120%);
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 999px;
  background: linear-gradient(135deg, #149ddd, #37b3ed);
  color: #fff;
  font-family: 'Poppins', 'Noto Sans Thai', sans-serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .2px;
  box-shadow: 0 10px 30px rgba(20, 157, 221, .45);
  cursor: pointer;
  opacity: 0;
  transition: transform .5s cubic-bezier(.2, .9, .3, 1.2), opacity .5s;
  white-space: nowrap;
  max-width: 92vw;
}

.seasonal-toast.seasonal-toast-show {
  transform: translate(-50%, 0);
  opacity: 1;
}

.seasonal-toast.seasonal-toast-out {
  transform: translate(-50%, -120%);
  opacity: 0;
}

.seasonal-toast-icon {
  font-size: 20px;
  line-height: 1;
}

/* Per-holiday toast gradients */
.season-tint-halloween {
  background: linear-gradient(135deg, #6b21a8, #f97316);
  box-shadow: 0 10px 30px rgba(107, 33, 168, .5);
}

.season-tint-christmas {
  background: linear-gradient(135deg, #166534, #dc2626);
  box-shadow: 0 10px 30px rgba(22, 101, 52, .5);
}

.season-tint-valentine {
  background: linear-gradient(135deg, #e11d48, #f472b6);
  box-shadow: 0 10px 30px rgba(225, 29, 72, .45);
}

.season-tint-newyear,
.season-tint-newyearseve {
  background: linear-gradient(135deg, #4338ca, #f59e0b);
  box-shadow: 0 10px 30px rgba(67, 56, 202, .5);
}

.season-tint-songkran {
  background: linear-gradient(135deg, #0284c7, #22d3ee);
  box-shadow: 0 10px 30px rgba(2, 132, 199, .45);
}

.season-tint-mothersday {
  background: linear-gradient(135deg, #db2777, #f9a8d4);
  box-shadow: 0 10px 30px rgba(219, 39, 119, .45);
}

.season-tint-fathersday {
  background: linear-gradient(135deg, #1e40af, #38bdf8);
  box-shadow: 0 10px 30px rgba(30, 64, 175, .45);
}

.season-tint-loykrathong {
  background: linear-gradient(135deg, #0f766e, #f59e0b);
  box-shadow: 0 10px 30px rgba(15, 118, 110, .45);
}

.season-tint-chakri,
.season-tint-coronation,
.season-tint-constitution,
.season-tint-chulalongkorn {
  background: linear-gradient(135deg, #1e3a8a, #334155);
  box-shadow: 0 10px 30px rgba(30, 58, 138, .45);
}

.season-tint-kingsbday,
.season-tint-queensbday {
  background: linear-gradient(135deg, #1d4ed8, #facc15);
  box-shadow: 0 10px 30px rgba(29, 78, 216, .45);
}

@media (max-width: 575px) {
  .seasonal-toast {
    font-size: 13px;
    padding: 10px 16px;
    top: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .seasonal-particles {
    display: none;
  }
}