/* UTM V2 topbar information ticker */
.topbar{
  gap:18px;
}

.environment-badge,
.topbar-actions{
  flex:0 0 auto;
}

.topbar-ticker{
  min-width:0;
  flex:1 1 auto;
  height:38px;
  display:flex;
  align-items:center;
  border-left:1px solid rgba(255,255,255,.06);
  border-right:1px solid rgba(255,255,255,.06);
  overflow:hidden;
}

.ticker-window{
  position:relative;
  width:100%;
  overflow:hidden;
  mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
}

.ticker-track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:utmTickerScroll 34s linear infinite;
}

.ticker-group{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  white-space:nowrap;
}

.ticker-item{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 18px;
  color:#8d99a8;
  font-size:10px;
  line-height:1;
}

.ticker-item strong{
  color:var(--brand-gold-bright,#c09a55);
  font-size:8px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.ticker-item.ticker-meeting strong{
  color:var(--accent,#d7ff4f);
}

.ticker-item.ticker-win strong{
  color:var(--brand-blue-bright,#73e0ff);
}

.ticker-separator{
  color:rgba(255,255,255,.16);
  font-size:6px;
}

.topbar-ticker:hover .ticker-track,
.topbar-ticker:focus-within .ticker-track{
  animation-play-state:paused;
}

@keyframes utmTickerScroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

@media(max-width:1180px){
  .topbar{gap:12px;padding-inline:20px}
  .environment-badge{font-size:9px}
  .search-trigger{min-width:176px}
  .ticker-item{padding-inline:14px}
}

@media(max-width:980px){
  .topbar-ticker{display:none}
}

@media(prefers-reduced-motion:reduce){
  .ticker-track{
    animation:none;
    transform:none;
  }
  .ticker-window{
    overflow-x:auto;
    mask-image:none;
    -webkit-mask-image:none;
    scrollbar-width:none;
  }
  .ticker-window::-webkit-scrollbar{display:none}
  .ticker-group[aria-hidden="true"]{display:none}
}
