/* Live exchange ticker — below navbar (GrowPips-style) */

body.has-exchange-ticker {
  --site-top-offset: calc(var(--header-height) + var(--ticker-height));
}

.exchange-ticker {
  position: fixed;
  top: var(--header-height);
  left: 0;
  right: 0;
  z-index: 999;
  height: var(--ticker-height);
  display: flex;
  align-items: stretch;
  background: #0f2847;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.exchange-ticker__label {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0 1rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent);
  background: rgba(11, 31, 58, 0.85);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  z-index: 2;
}

.exchange-ticker__live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.5);
  animation: ticker-pulse 2s ease infinite;
}

@keyframes ticker-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45); }
  50% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
}

.exchange-ticker__viewport {
  flex: 1;
  overflow: hidden;
  position: relative;
  mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}

.exchange-ticker__track {
  display: flex;
  align-items: center;
  width: max-content;
  min-height: var(--ticker-height);
  animation: ticker-scroll 55s linear infinite;
  will-change: transform;
}

.exchange-ticker__track:hover {
  animation-play-state: paused;
}

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

.exchange-ticker__group {
  display: flex;
  align-items: center;
}

.exchange-ticker__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 1.35rem;
  white-space: nowrap;
  font-size: 0.8125rem;
  color: var(--color-text-on-dark);
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.exchange-ticker__symbol {
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
}

.exchange-ticker__name {
  color: var(--color-muted-on-dark);
  font-size: 0.75rem;
  display: none;
}

.exchange-ticker__price {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.exchange-ticker__change {
  font-size: 0.75rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
}

.exchange-ticker__change.is-up {
  color: #4ade80;
  background: rgba(74, 222, 128, 0.12);
}

.exchange-ticker__change.is-down {
  color: #f87171;
  background: rgba(248, 113, 113, 0.12);
}

.exchange-ticker__change.is-flat {
  color: var(--color-muted-on-dark);
  background: rgba(255, 255, 255, 0.06);
}

.exchange-ticker.is-loading .exchange-ticker__item {
  opacity: 0.55;
}

@media (min-width: 768px) {
  .exchange-ticker__name {
    display: inline;
  }
}

@media (max-width: 576px) {
  .exchange-ticker__label span:last-child {
    display: none;
  }

  .exchange-ticker__item {
    padding: 0 1rem;
    font-size: 0.75rem;
  }
}