diff --git a/src/features/media/baseVideoPlayer.js b/src/features/media/baseVideoPlayer.js index 81f438c..46bfc01 100644 --- a/src/features/media/baseVideoPlayer.js +++ b/src/features/media/baseVideoPlayer.js @@ -345,6 +345,20 @@ class BaseVideoPlayer { progressFilled: !!this.controls.progressFilled, hasStyle: this.controls.progressFilled ? 'width: ' + this.controls.progressFilled.style.width : 'N/A' }); + + // DEBUG: Check actual rendered styles + if (this.controls.progressFilled) { + const computed = window.getComputedStyle(this.controls.progressFilled); + console.log('🎬 Computed styles:', { + width: computed.width, + height: computed.height, + background: computed.background, + display: computed.display, + visibility: computed.visibility, + opacity: computed.opacity + }); + } + this.lastLoggedTime = Math.floor(this.videoElement.currentTime); } diff --git a/src/styles/porn-cinema.css b/src/styles/porn-cinema.css index 6d8740b..ec01135 100644 --- a/src/styles/porn-cinema.css +++ b/src/styles/porn-cinema.css @@ -1115,29 +1115,34 @@ body.cinema-mode { .progress-container { margin-bottom: 15px; + background: lime !important; /* BRIGHT GREEN - should be unmissable */ + padding: 10px !important; + border: 5px solid red !important; } .progress-bar { position: relative; - height: 12px; - background: rgba(255, 255, 255, 0.3); + height: 20px !important; /* Even bigger */ + background: blue !important; /* BRIGHT BLUE background */ border-radius: 6px; cursor: pointer; margin-bottom: 8px; transition: height 0.2s ease; + border: 2px solid orange !important; } .progress-bar:hover { - height: 16px; + height: 24px !important; } .progress-filled { - height: 100%; - background: linear-gradient(90deg, #ff6b9d, #c471ed); + height: 100% !important; + background: magenta !important; /* BRIGHT MAGENTA fill */ border-radius: 6px; width: 0%; transition: width 0.1s ease; position: relative; + border: 1px solid yellow !important; } .progress-thumb {