body {
    background-color: #151515; /* Very dark navy background */
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.game-card, .channel-card {
    background-color: #161b22; /* Lighter charcoal for cards */
    border: 1px solid #30363d; /* Subtle gray border */
}
.nav-bg {
    background-color: #151515;
}

.live-pulse-border {
    animation: live-glow-pulse 2s infinite !important;
    border-width: 2px !important;
    position: relative;
    z-index: 10;
}

@keyframes live-glow-pulse {
    0% {
        border-color: rgba(239, 68, 68, 0.5);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
    }
    50% {
        border-color: rgba(239, 68, 68, 1);
        box-shadow: 0 0 15px 2px rgba(239, 68, 68, 0.3);
    }
    100% {
        border-color: rgba(239, 68, 68, 0.5);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
    }
}

.accent-pulse {
    background: #ef4444 !important; /* Turns the green bar RED */
    animation: accent-opacity-pulse 2s infinite !important;
}

@keyframes accent-opacity-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.shaka-spinner svg circle {
  stroke: #22c55e !important;
}

/* Target the Live button container */
.jw-text-live {
    background-color: red !important;
    color: white !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
    margin: 0 4px !important;
}

/* If you want to style it when it's NOT live (has jw-dvr-live class) */
/* Force "Not Live" button to grey */
div.jw-icon.jw-text-live.jw-dvr-live {
  background-color: grey !important;
  color: white !important;
  font-weight: normal !important;
  border-radius: 4px !important;
  padding: 4px 10px !important;
  text-transform: uppercase !important;
}

/* Optional hover effect */
div.jw-icon.jw-text-live.jw-dvr-live:hover {
  background-color: #666 !important;
}

/* Reset the "Live" style explicitly if needed */
div.jw-icon.jw-text-live:not(.jw-dvr-live) {
  background-color: red !important;
  color: white !important;
  font-weight: bold !important;
}


/* Alternative: More specific selector */
.jw-controlbar .jw-button-container .jw-text-live {
    background-color: red !important;
    color: white !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
}

/* Progress (played) - covers both new timesegment and old classes */
.jw-slider-container .jw-timesegment-bar.jw-progress,
.jw-slider-container .jw-timesegment-bar.jw-timesegment-progress,
.jw-slider-container .jw-reset .jw-old-progress,
div.jw-slider-container > .jw-reset.jw-old-progress {
  background-color: #e10600 !important;      /* solid red */
  background-image: none !important;         /* remove gradients if any */
  box-shadow: none !important;
}

/* Buffered portion (lighter, translucent red) */
.jw-slider-container .jw-timesegment-bar.jw-buffer,
.jw-slider-container .jw-timesegment-bar.jw-timesegment-buffered,
.jw-slider-container .jw-reset .jw-old-buffer,
div.jw-slider-container > .jw-reset.jw-old-buffer {
  background-color: rgba(225,16,0,0.28) !important;
  background-image: none !important;
}

/* Rail / background (unplayed) — keep neutral so red stands out */
.jw-slider-container .jw-timesegment-bar.jw-rail,
.jw-slider-container .jw-timesegment-bar.jw-timesegment-background {
  background-color: #2b2b2b !important;
  opacity: 1 !important;
}

/* Tooltip time-thumb might have its own background — keep it neutral */
.jw-slider-container .jw-time-thumb {
  background-color: transparent !important;
}

/* Ultra-specific fallback for inline-styled bars */
.jw-slider-container [style*="jw-old-progress"],
.jw-slider-container [style*="jw-old-buffer"],
.jw-slider-container [style*="jw-timesegment-progress"] {
  background-color: #e10600 !important;
}

/* Custom watermark normally visible
/* button.bmpui-ui-watermark {
  background-image: url("/static/images/bg.png") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
} */

/* Hide watermark in fullscreen mode */
/* .bmpui-ui-state-fullscreen button.bmpui-ui-watermark,
.bmpui-fullscreen button.bmpui-ui-watermark {
  display: none !important;
} */

button.bmpui-ui-watermark {
  display: none !important;
}

/* Additional selectors to ensure it's hidden everywhere */
.bmpui-ui-watermark {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Hide in fullscreen mode */
.bmpui-ui-state-fullscreen button.bmpui-ui-watermark,
.bmpui-fullscreen button.bmpui-ui-watermark {
  display: none !important;
}


.card-header {
    background: linear-gradient(135deg, #1f2937, #111827);
    border-bottom: 2px solid #22c55e;
}
.card-footer {
    background: linear-gradient(135deg, #111827, #1f2937);
    border-top: 2px solid #22c55e;
}

.game-card,
.nba-card,
.stream-card {
    cursor: pointer;
    transition: all 0.3s ease;
}

.game-card:hover,
.nba-card:hover,
.stream-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(34, 197, 94, 0.3);
    border-color: #22c55e;
}