.tv-guide .guide-program-container .guide-program {
  position: relative;
  top: 2px;
  padding: 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border-radius: 8px;
  background: linear-gradient(to right, #2d2d2f, #1f1f20);
  /* Default background */
  color: #fff;
  transition: all 0.2s ease-out;
}

.tv-guide .guide-program-container .guide-program.live {
  background: linear-gradient(to right, #3ba882, #245043);
}

.tv-guide .guide-program-container .guide-program:hover {
  filter: brightness(1.2);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3), 0 4px 12px rgba(0, 0, 0, 0.3);
}

.tv-guide .guide-program-container .guide-program.live:hover {
  background: linear-gradient(to right, #2e9e80, #206e5e);
}

.tv-guide .guide-program-container .guide-program.not-live:hover {
  background: linear-gradient(to right, #2f3f3a, #1e2926);
}

/* Ensure channel logo is always on top */
.tv-guide .channel-logo {
  z-index: 30;
  position: relative;
  position: sticky !important;
  left: 0;
  z-index: 30;
}

/* Make sure the main scrolling container establishes the right stacking context */
.tv-guide {
  position: relative;
}

/* Hide bottom horizontal scrollbar for the guide's virtualized list only */
.tv-guide .guide-list-outer {
  /* Allow horizontal scrolling but hide the scrollbar visually */
  overflow-x: auto !important;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}

/* Also hide scrollbars visually across browsers for the outer container */
.tv-guide .guide-list-outer::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}
