/* ULTRA-FAST TICKER RENDERING OPTIMIZATIONS */
/* ========================================== */

/* Hardware acceleration for smooth animations */
.ticker-card {
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}

/* Optimize rendering performance */
.ticker-card * {
  transform: translateZ(0);
}

/* Ultra-fast loading animations */
.spinner-logo {
  animation: ultra-spin 1s linear infinite;
  will-change: transform;
}

@keyframes ultra-spin {
  from { transform: rotate(0deg) translateZ(0); }
  to { transform: rotate(360deg) translateZ(0); }
}

/* Progressive loading indicators */
.loading-progress {
  transition: width 0.3s ease;
  will-change: width;
}

/* Optimize hover effects */
.hover-glow {
  transition: all 0.2s ease;
  will-change: transform, box-shadow;
}

.hover-glow:hover {
  transform: translateY(-2px) translateZ(0);
  box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

/* Ultra-fast sentiment badges */
.sentiment-badge {
  transition: all 0.15s ease;
  will-change: transform, opacity;
}

.sentiment-badge:hover {
  transform: scale(1.05) translateZ(0);
}

/* Optimize volume bars */
.volume-bar {
  will-change: width;
  transform: translateZ(0);
}

.volume-fill {
  transition: width 0.3s ease;
  will-change: width;
}

/* Ultra-fast metric cards */
.metric-card {
  will-change: transform;
  transform: translateZ(0);
}

.metric-value {
  transition: color 0.2s ease;
  will-change: color;
}

/* Optimize text rendering */
.text-light, .text-muted, .fw-bold {
  text-rendering: optimizeSpeed;
  font-smooth: never;
  -webkit-font-smoothing: none;
}

/* Ultra-fast skeleton loading */
.skeleton-loading {
  background: linear-gradient(90deg, #2a2a2a 25%, #3a3a3a 50%, #2a2a2a 75%);
  background-size: 200% 100%;
  animation: skeleton-loading 1.5s infinite;
  will-change: background-position;
}

@keyframes skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Optimize container rendering */
#tickers-progressive-container {
  contain: layout style paint;
  will-change: contents;
}

/* Ultra-fast error states */
.error-card {
  transition: opacity 0.2s ease;
  will-change: opacity;
}

/* Optimize image loading */
.ticker-card img {
  image-rendering: optimizeSpeed;
  will-change: opacity;
  transition: opacity 0.2s ease;
}

/* Ultra-fast responsive design */
@media (max-width: 768px) {
  .ticker-card {
    transform: translateZ(0) scale(0.98);
  }
}

/* Performance monitoring styles */
.performance-indicator {
  position: fixed;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.8);
  color: #00ff00;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
  z-index: 9999;
  font-family: monospace;
} 