﻿/* Custom Enhancements and Animations for Litquidity Clone */

/* Google Fonts Fallback for IvyPresto Headline */
@import url(https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400..700;1,6..72,400..700&display=swap);

/* Ensure body transition is responsive */
body {
  opacity: 1 !important;
}

/* Floating animation for decorative stickers */
@keyframes floatSticker {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-12px) rotate(2deg);
  }
}

[data-float] {
  animation: floatSticker 5s ease-in-out infinite;
  will-change: transform;
}

.home-hero_media--arrow[data-float] { animation-delay: 0s; animation-duration: 5.2s; }
.home-hero_media--coin[data-float] { animation-delay: 0.7s; animation-duration: 4.8s; }
.home-hero_media--diamond[data-float] { animation-delay: 1.4s; animation-duration: 6.1s; }
.home-hero_media--dollar-sign[data-float] { animation-delay: 0.3s; animation-duration: 5.5s; }
.home-hero_media--mail[data-float] { animation-delay: 1.8s; animation-duration: 4.5s; }
.home-hero_media--pie-chart[data-float] { animation-delay: 1.1s; animation-duration: 5.8s; }
.home-hero_media--rocket[data-float] { animation-delay: 0.5s; animation-duration: 5.0s; }

.site-footer_media--coin[data-float] { animation-delay: 0.2s; animation-duration: 5s; }
.site-footer_media--coins[data-float] { animation-delay: 1.1s; animation-duration: 5.4s; }
.site-footer_media--dollar-sign[data-float] { animation-delay: 0.6s; animation-duration: 4.7s; }
.site-footer_media--pen[data-float] { animation-delay: 1.5s; animation-duration: 6.2s; }
.site-footer_media--pie-chart[data-float] { animation-delay: 0.9s; animation-duration: 5.1s; }
.site-footer_media--washcoin[data-float] { animation-delay: 1.7s; animation-duration: 4.9s; }

/* Infinite Ticker Continuous Scroller */
.scroller-component_list {
  display: flex !important;
  flex-shrink: 0;
  width: max-content;
  animation: tickerMarquee 40s linear infinite !important;
}

.scroller-component:hover .scroller-component_list {
  animation-play-state: paused !important;
}

@keyframes tickerMarquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Toast alert notification for copying link */
.toast-notice {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  background-color: var(--color-dark-green, #23352f);
  color: var(--color-mint, #d2faaa);
  padding: 0.875rem 1.5rem;
  border-radius: 0.5rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  font-family: var(--font-primary, sans-serif);
  font-weight: 600;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  z-index: 99999;
  transform: translateY(100px);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
  pointer-events: none;
}

.toast-notice.show {
  transform: translateY(0);
  opacity: 1;
}

/* Category filter buttons active styling */
.cat-component--active {
  background-color: var(--color-dark-green, #23352f) !important;
  color: var(--color-mint, #d2faaa) !important;
}

/* Ensure mobile menu open state is fluid */
html.state--menu-open {
  overflow: hidden;
}

html.state--menu-open .mobile-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.mobile-menu {
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}

/* Subscription overlay modal */
html.state--subscription-overlay-open {
  overflow: hidden;
}

html.state--subscription-overlay-open .subscription-overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html.state--subscription-overlay-open .subscription-overlay_mask {
  opacity: 0.6 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.subscription-overlay {
  transition: opacity 0.3s ease, visibility 0.3s;
}

.subscription-overlay_mask {
  transition: opacity 0.3s ease, visibility 0.3s;
}
