.broadcast-ticker {
  position: relative;
  height: 40px;
  overflow: hidden;
  display: none;
  align-items: center;
  direction: ltr;
  border-bottom: 1px solid rgba(249, 207, 124, .64);
  background: linear-gradient(180deg, #3b2c19, #191a14 55%, #302718);
  box-shadow: inset 0 1px rgba(255, 229, 160, .62), inset 0 -1px rgba(0, 0, 0, .55);
  color: #ffebbd;
}

.broadcast-ticker::before,
.broadcast-ticker::after {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  width: min(50px, 9%);
  pointer-events: none;
  content: "";
}
.broadcast-ticker::before { left: 0; background: linear-gradient(90deg, #221e15, transparent); }
.broadcast-ticker::after { right: 0; background: linear-gradient(270deg, #221e15, transparent); }

.broadcast-ticker-track {
  width: max-content;
  display: flex;
  flex: none;
  align-items: center;
  animation: broadcast-ticker-scroll 40s linear infinite;
  will-change: transform;
}
.broadcast-ticker-group {
  display: flex;
  flex: none;
  align-items: center;
  gap: 26px;
  padding-inline: 26px 0;
  white-space: nowrap;
  direction: ltr;
  font: 800 13px/1.5 "Noto Sans Arabic", sans-serif;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .8), 0 0 11px rgba(253, 190, 74, .22);
}
.broadcast-ticker-group span { direction: rtl; unicode-bidi: isolate; }
.broadcast-ticker-group i {
  color: #f6c86d;
  font: normal 12px/1 system-ui, sans-serif;
  text-shadow: 0 0 9px rgba(255, 195, 91, .6);
}

@keyframes broadcast-ticker-scroll {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}
.broadcast-ticker:hover .broadcast-ticker-track { animation-play-state: paused; }

/* Show the strip only while an actual stream is being loaded or shown. */
body.cinema-home .watch-stage:has(>.player-shell:is([data-state='loading'],[data-state='ready'],[data-state='playing'])) > .broadcast-ticker { display: flex; }

@media (max-width: 580px) {
  .broadcast-ticker { height: 36px; }
  .broadcast-ticker-group { gap: 18px; padding-inline-start: 18px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .broadcast-ticker { height: auto; min-height: 36px; }
  .broadcast-ticker-track { width: 100%; animation: none; will-change: auto; }
  .broadcast-ticker-group { flex-wrap: wrap; white-space: normal; gap: 6px 14px; padding: 7px 14px; }
  .broadcast-ticker-group + .broadcast-ticker-group { display: none; }
}
