.episode-progress-container {
            width: 100%;
            position: relative;
            top: 1px;
        }
        
        .episode-progress {
            width: 100%;
            height: 4px;
            background-color: #cecdcd;
            /*! border-radius: 2px; */
            overflow: hidden;
            position: relative;
            border-top-left-radius: 2px;
            border-top-right-radius: 2px;
        }
        
        .episode-progress-bar {
            height: 100%;
            background: linear-gradient(90deg, #c60001, #f00);
            width: 0%;
            transition: width 0.3s ease;
            float: left;
        }
        
        .episode-progress.completed .episode-progress-bar {
            background: #4caf50;
        }
        
        .episode-progress-percent {
            position: absolute;
            right: 0;
            top: -18px;
            font-size: 11px;
            color: #cd0b0c;
            font-weight: bold;
        }
        
        .episode-progress.completed .episode-progress-percent {
            color: #4caf50;
        }
        
        .episode-progress-tooltip {
            position: absolute;
            bottom: 100%;
            left: 0;
            background: rgba(0,0,0,0.8);
            color: white;
            padding: 4px 8px;
            border-radius: 4px;
            font-size: 12px;
            opacity: 0;
            transition: opacity 0.2s;
            pointer-events: none;
            transform: translateX(-50%);
            white-space: nowrap;
            z-index: 10;
            margin-bottom: 5px;
        }
        
        .episode-progress:hover .episode-progress-tooltip {
            opacity: 1;
        }
body.night-theme .episode-progress-bar {
  background: linear-gradient(90deg, #32b900, #21ff00);
}
body.night-theme .episode-progress-percent {
  color: rgb(22, 202, 7);
}
body.night-theme .episode-progress {
  background-color: #b1b1b1;
}