/* =========================================================
   COMPONENT: Footer Ticker Bar
   ========================================================= */

.ticker-bar {
  gap: var(--space-lg);
  padding: 0 var(--space-md);
  font-family: var(--font-mono);
  font-size: var(--font-size-xs);
}

.ticker-item {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  white-space: nowrap;
  flex-shrink: 0;
}
.ticker-symbol {
  color: var(--text-secondary);
  font-weight: 600;
}
.ticker-price {
  color: var(--text-primary);
  font-weight: 600;
}
.ticker-change {
  padding: 1px 4px;
  border-radius: 2px;
  font-size: var(--font-size-xs);
}
.ticker-change.up {
  color: var(--accent-green);
  background: var(--accent-green-dim);
}
.ticker-change.down {
  color: var(--accent-red);
  background: var(--accent-red-dim);
}

/* Marquee animation for overflow */
.ticker-track {
  display: flex;
  gap: var(--space-lg);
  animation: ticker-scroll 60s linear infinite;
}
@keyframes ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@media (max-width: 640px) {
  .ticker-bar { gap: var(--space-md); padding: 0 var(--space-sm); }
  .ticker-track { gap: var(--space-md); }
  .ticker-item { gap: 4px; }
}