/* Wrapper for positioning overlay */
.svp-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

/* Default video style */
.svp-wrapper video {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0px; /* Customize */
    background: black;
}

/* Overlay play button (centered) */
.svp-overlay-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 68px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

/* Triangle play icon inside the circle */
.svp-overlay-play::before {
    content: "";
    position: absolute;
    left: 26px;
    top: 18px;
    width: 0;
    height: 0;
    border-left: 20px solid white;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
}

/* Disabled by default (hidden) */
.svp-overlay-play {
    display: none;
}

/* If overlay is enabled (via shortcode), make it visible */
.svp-wrapper[data-overlay="true"] .svp-overlay-play {
    display: block;
}

/* Hide native big play button in WebKit (Safari, Chrome, iOS Safari) */
video::-webkit-media-controls-start-playback-button {
    display: none !important;
    -webkit-appearance: none;
}

/* Hide native big play button in Safari macOS */
video::-webkit-media-controls-overlay-play-button {
    display: none !important;
}

/* Hide native big play button in Firefox */
video::-moz-media-controls {
    display: none !important;
}

/* Optional: hide ALL media overlay buttons across browsers */
video::-webkit-media-controls-enclosure {
    overflow: hidden;
}