/* Custom CSS Overrides - Pari Betting Theme */

/* Utility: visually hidden */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Truncate text */
.text-truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.text-truncate-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Badge styles */
.badge-live {
  background: rgba(76, 175, 80, 0.15);
  color: var(--pari-green);
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}
.badge-hot {
  background: rgba(244, 67, 54, 0.15);
  color: var(--pari-red);
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}

/* Shimmer loading effect */
.shimmer {
  background: linear-gradient(90deg, var(--pari-dark-card) 25%, #2a2a3e 50%, var(--pari-dark-card) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Custom scrollbar for webkit */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--pari-black); }
::-webkit-scrollbar-thumb { background: var(--pari-border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--pari-text-secondary); }

/* Overlay gradient for cards */
.overlay-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50%;
  background: linear-gradient(to top, rgba(6,6,6,0.9), transparent);
  pointer-events: none;
}

/* Pulse animation for live indicator */
.pulse-live::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--pari-green);
  border-radius: 50%;
  margin-right: 4px;
  animation: pulse 1.5s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}