/*
 * The one stylesheet in this template that was written rather than captured, and it is
 * separate from `a1capital-original.css` for exactly that reason: the captured sheet is the
 * reference's own and must stay byte-identical apart from asset paths, so anything authored
 * here cannot live in it.
 *
 * It exists because the reference's price strip is a TradingView iframe. Its markup is
 * cross-origin, so there is nothing to copy — this reproduces what the strip looks like,
 * measured from the reference at 1440px: a full-width black bar 46px tall, items separated by
 * a thin vertical rule, uppercase bold label, a bullet, the price, then the change in green or
 * red, scrolling right to left because the content is wider than the bar.
 */

.tradingview-widget-container {
  width: 100%;
  height: 46px;
  overflow: hidden;
  background: #000;
}

.tradingview-widget-container__widget {
  height: 46px;
  overflow: hidden;
}

.a1-ticker-track {
  display: flex;
  width: max-content;
  height: 46px;
  animation: a1-ticker-scroll 40s linear infinite;
}

.a1-ticker-group {
  display: flex;
  align-items: center;
  height: 46px;
}

.a1-ticker-item {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 46px;
  padding: 0 24px;
  border-left: 1px solid #2a2a2a;
  font-family: -apple-system, BlinkMacSystemFont, "Trebuchet MS", Roboto, Ubuntu, sans-serif;
  font-size: 14px;
  white-space: nowrap;
  color: #d1d4dc;
}

.a1-ticker-label {
  font-weight: 600;
  color: #fff;
  text-transform: uppercase;
}

.a1-ticker-dot {
  color: #787b86;
  font-size: 11px;
}

.a1-ticker-price {
  color: #fff;
}

.a1-ticker-up {
  color: #26a69a;
}

.a1-ticker-down {
  color: #ef5350;
}

@keyframes a1-ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .a1-ticker-track { animation: none; }
}
