/* Sports-first UX shared styles. Small — most layout is Tailwind. */

[dir="rtl"] .rtl-scroll { direction: rtl; }

/* Live dot — works on any background */
.pulse-live::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #ef4444;
  border-radius: 9999px;
  margin-inline-end: 6px;
  animation: acux-pulse 1.2s infinite;
  vertical-align: middle;
}
@keyframes acux-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.35; }
}

.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Club/league crests — graceful loading + neutral placeholder when absent */
.crest {
  display: inline-block;
  object-fit: contain;
  vertical-align: middle;
  background: transparent;
  flex-shrink: 0;
}
.crest-placeholder {
  display: inline-block;
  border-radius: 9999px;
  background: rgb(229 231 235); /* gray-200 */
  flex-shrink: 0;
}
.dark .crest-placeholder { background: rgb(55 65 81); /* gray-700 */ }

/* EPG grid */
.epg-grid {
  display: grid;
  gap: 1px;
  background: rgb(229 231 235); /* gray-200 */
}
.dark .epg-grid { background: rgb(55 65 81); /* gray-700 */ }

.epg-grid-cell {
  background: white;
  padding: .5rem .6rem;
  min-height: 3.5rem;
  overflow: hidden;
}
.dark .epg-grid-cell { background: rgb(31 41 55); /* gray-800 */ }

/* "Now" column — a subtle brand-accent tint */
.epg-grid-cell.is-now {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.12) 0%, rgba(16, 185, 129, 0.04) 100%);
}

/* Now vertical marker — drawn by the JS as a positioned child */
.epg-now-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #10b981;
  box-shadow: 0 0 6px rgba(16, 185, 129, 0.6);
  pointer-events: none;
}