/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

#live-tags-list [aria-current="true"] {
  background-color: #dcfce7;
  color: #1f2937;
  border-radius: 0.25rem;
  animation: live-tag-pulse 2.4s ease-in-out infinite;
}

#live-tags-list [aria-current="true"] [data-live-speaker-name] {
  background-color: #ffffff;
  outline: none;
}

@keyframes live-tag-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.18);
  }

  50% {
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  #live-tags-list [aria-current="true"] {
    animation: none;
  }
}

.live-tags-spacer {
  height: 0;
  overflow-anchor: none;
  pointer-events: none;
}