.streamverse-player { position: relative; background: #000; max-width: 100%; overflow: hidden; } .streamverse-player video { width: 100%; height: auto; display: block; } .streamverse-player .sv-controls { position: absolute; inset: 0; color: #fff; transition: opacity 0.5s ease; pointer-events: none; } .streamverse-player .sv-controls * { pointer-events: auto; } .streamverse-player.hide-controls .sv-controls { opacity: 0; } .streamverse-player .sv-title { position: absolute; top: 10px; left: 10px; background: rgba(0,0,0,0.5); padding: 6px 12px; border-radius: 8px; font-size: 15px; } .streamverse-player .sv-center-controls { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; gap: 20px; align-items: center; } .streamverse-player .sv-bottom-controls { position: absolute; bottom: 40px; right: 15px; display: flex; gap: 12px; } .streamverse-player .sv-timer { position: absolute; bottom: 10px; left: 10px; background: rgba(0,0,0,0.6); color: #fff; padding: 4px 10px; border-radius: 6px; font-size: 14px; font-family: sans-serif; pointer-events: none; user-select: none; z-index: 20; } .streamverse-player .sv-toast { position: absolute; bottom: 80px; right: 15px; background: #006400; color: #fff; padding: 6px 12px; border-radius: 6px; font-size: 14px; box-shadow: 0 0 8px #006400; } .streamverse-player .sv-seekbar { position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 15px; display: flex; align-items: center; gap: 6px; } .streamverse-player .sv-seek-start, .streamverse-player .sv-seek-end { font-size: 14px; color: #ccc; } .streamverse-player .sv-seek-track { flex-grow: 1; height: 6px; background: #ccc; position: relative; cursor: pointer; border-radius: 4px; overflow: hidden; } .streamverse-player .sv-seek-fill { background: #006400; height: 100%; width: 0; } .streamverse-player .sv-seek-handle { position: absolute; top: 50%; transform: translate(-50%, -50%); background: #fff; border-radius: 50%; width: 12px; height: 12px; left: 0; border: 2px solid #006400; } button { background: transparent; color: #006400; border: none; padding: 6px 10px; font-size: 18px; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; } button:hover { transform: scale(1.1); box-shadow: 0 0 6px #006400; } .sv-play { font-size: 86px; color: #006400; } .sv-skip { font-size: 28px; color: #006400; } .sv-speed, .sv-quality, .sv-fullscreen, .sv-share, .sv-download { font-size: 18px; color: #006400; } /* ✅ Download Button Style */ .sv-download { background: transparent; border: none; padding: 6px 10px; font-size: 18px; color: #006400; } /* Responsive Tweaks */ @media (min-width: 768px) { .streamverse-player .sv-seekbar { padding: 5px 15%; } .streamverse-player .sv-bottom-controls { right: 10%; } }