/* ============================================
   Trading Background Animation
   ============================================ */

/* Animated gradient background */
body::before {
  content: '';
  position: fixed;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  z-index: 0;
  background: 
    radial-gradient(circle at 20% 30%, rgba(255, 102, 0, 0.2) 0%, transparent 30%),
    radial-gradient(circle at 80% 70%, rgba(255, 102, 0, 0.15) 0%, transparent 30%),
    radial-gradient(circle at 50% 50%, rgba(255, 102, 0, 0.1) 0%, transparent 40%);
  pointer-events: none;
  animation: rotate-orbs 30s linear infinite;
}

@keyframes rotate-orbs {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Trading grid overlay */
.trading-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.trading-grid {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.15;
  background-image: 
    repeating-linear-gradient(0deg, transparent, transparent 49px, #ff6600 49px, #ff6600 50px),
    repeating-linear-gradient(90deg, transparent, transparent 49px, #ff6600 49px, #ff6600 50px);
}

/* Floating particles container */
.trading-particles {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Chart gradient at bottom */
.trading-chart {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 500px;
  opacity: 0.12;
  background: linear-gradient(to top, #ff6600 0%, transparent 100%);
  animation: chart-pulse 4s ease-in-out infinite;
}

@keyframes chart-pulse {
  0%, 100% {
    opacity: 0.12;
    transform: scaleY(1);
  }
  50% {
    opacity: 0.2;
    transform: scaleY(1.05);
  }
}

/* Candlestick bars animation */
@keyframes candlestick {
  0%, 100% {
    transform: scaleY(0.5);
    opacity: 0.2;
  }
  50% {
    transform: scaleY(1);
    opacity: 0.3;
  }
}

/* Particle float animation */
@keyframes float-particle {
  0% {
    transform: translateY(0) translateX(0) scale(0.5);
    opacity: 0;
  }
  5% {
    opacity: 0.9;
  }
  95% {
    opacity: 0.9;
  }
  100% {
    transform: translateY(-100vh) translateX(100px) scale(1.2);
    opacity: 0;
  }
}

/* Subtle card float */
.deal-card,
.firm-header,
.affiliate-section,
.faq-section {
  animation: subtle-float 6s ease-in-out infinite;
}

.deal-card:nth-child(2n) {
  animation-delay: 1s;
}

.deal-card:nth-child(3n) {
  animation-delay: 2s;
}

@keyframes subtle-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-3px);
  }
}

/* Light theme adjustments */
[data-theme="light"] .trading-grid {
  opacity: 0.08;
}

[data-theme="light"] .trading-chart {
  opacity: 0.06;
}

[data-theme="light"] body::before {
  background: 
    radial-gradient(circle at 20% 30%, rgba(255, 102, 0, 0.1) 0%, transparent 30%),
    radial-gradient(circle at 80% 70%, rgba(255, 102, 0, 0.08) 0%, transparent 30%),
    radial-gradient(circle at 50% 50%, rgba(255, 102, 0, 0.05) 0%, transparent 40%);
}