.scrollbar-none::-webkit-scrollbar {
  display: none;
}

.scrollbar-none {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fadeIn 0.2s ease-out;
}

.drawer-open {
  transform: translateX(0);
}

.drawer-closed {
  transform: translateX(100%);
}

.rounded-squircle {
  border-radius: 25%;
}

.game-item.active .game-icon-border {
  border-color: #dc2626;
}

.game-item.active .game-checkmark {
  opacity: 1;
}

.game-item.active .game-title {
  font-weight: bold;
  color: #dc2626;
}

.criteria-valid {
  color: #16a34a;
}

.criteria-valid svg {
  display: inline-block;
}

.criteria-invalid {
  color: #9ca3af;
}

.criteria-invalid svg {
  display: none;
}

.toast-enter {
  transform: translateX(100%);
  opacity: 0;
}

.toast-enter-active {
  transform: translateX(0);
  opacity: 1;
  transition: all 0.3s ease-out;
}

.toast-exit {
  transform: translateX(0);
  opacity: 1;
}

.toast-exit-active {
  transform: translateX(100%);
  opacity: 0;
  transition: all 0.3s ease-in;
}

.denom-item.active {
  border-color: #dc2626;
  background-color: #fef2f2;
  box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.1),
    0 2px 4px -1px rgba(220, 38, 38, 0.06);
}

.special-offer-item.active {
  outline: 2px solid #dc2626;
  outline-offset: -2px;
  background-color: #fef2f2;
}

.coupon-item.active {
  border-color: #dc2626;
  background-color: #fef2f2;
}

.coupon-item.active .coupon-radio-inner {
  transform: scale(1);
}

#auth-modal,
#terms-modal,
#promo-popup-overlay {
  transition: opacity 0.3s ease;
}

.filter-btn.active {
  background-color: #dc2626;
  color: white;
  border-color: #dc2626;
}