.adv-video-container { position: relative; width: 100%; display: flex; overflow: hidden; }
.adv-video-height-mode-fixed .adv-video-container { aspect-ratio: auto !important; }
.adv-video-stretch-yes .adv-video-container { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

.adv-video-player-wrapper { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; }
.adv-video-container iframe, .adv-video-container video { width: 100%; height: 100%; border: none; margin: 0; padding: 0; display: block; object-fit: cover; }

/* Overlay */
.adv-video-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;
    background-repeat: no-repeat;
    pointer-events: none; /* Let clicks pass to btn */
    display: block;
}
.adv-video-overlay::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none;
}

/* Play Button Engine */
.adv-video-play-button {
    position: absolute; z-index: 20; /* Keep above video and overlay */
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; width: 60px; height: 60px; background-color: rgba(255,0,0,0.8);
    transition: all 0.3s;
    cursor: pointer;
    
    /* Default variables */
    --pulse-color: rgba(255,255,255,0.4);
    --pulse-size: 15px;
    --play-offset-x: 0px;
    --play-offset-y: 0px;

    /* Base transforms */
    transform: var(--preset-transform, none);
}

.adv-video-play-icon { display: flex; color: #fff; font-size: 20px; align-items: center; justify-content: center; }
.adv-video-play-icon svg { fill: #fff; width: 1em; height: 1em; }

/* Preset Mapping applied natively via classes */

/* Top Left */
.adv-video-play-pos-top-left .adv-video-play-button {
    top: var(--play-offset-y, 0); 
    left: var(--play-offset-x, 0);
    --preset-transform: none;
}

/* Top Center */
.adv-video-play-pos-top-center .adv-video-play-button {
    top: var(--play-offset-y, 0); 
    left: 50%;
    --preset-transform: translateX(calc(-50% + var(--play-offset-x, 0)));
}

/* Top Right */
.adv-video-play-pos-top-right .adv-video-play-button {
    top: var(--play-offset-y, 0); 
    right: 0;
    --preset-transform: translateX(calc(-1 * var(--play-offset-x, 0)));
}

/* Center Left */
.adv-video-play-pos-center-left .adv-video-play-button {
    top: 50%; 
    left: var(--play-offset-x, 0);
    --preset-transform: translateY(calc(-50% + var(--play-offset-y, 0)));
}

/* Center */
.adv-video-play-pos-center .adv-video-play-button {
    top: 50%; 
    left: 50%;
    --preset-transform: translate(calc(-50% + var(--play-offset-x, 0)), calc(-50% + var(--play-offset-y, 0)));
}

/* Center Right */
.adv-video-play-pos-center-right .adv-video-play-button {
    top: 50%; 
    right: 0;
    --preset-transform: translate(calc(-1 * var(--play-offset-x, 0)), calc(-50% + var(--play-offset-y, 0)));
}

/* Bottom Left */
.adv-video-play-pos-bottom-left .adv-video-play-button {
    bottom: 0; 
    left: var(--play-offset-x, 0);
    --preset-transform: translateY(calc(-1 * var(--play-offset-y, 0)));
}

/* Bottom Center */
.adv-video-play-pos-bottom-center .adv-video-play-button {
    bottom: 0; 
    left: 50%;
    --preset-transform: translate(calc(-50% + var(--play-offset-x, 0)), calc(-1 * var(--play-offset-y, 0)));
}

/* Bottom Right */
.adv-video-play-pos-bottom-right .adv-video-play-button {
    bottom: 0; 
    right: 0;
    --preset-transform: translate(calc(-1 * var(--play-offset-x, 0)), calc(-1 * var(--play-offset-y, 0)));
}

/* Animations */
@keyframes advPulse { 
    0% { box-shadow: 0 0 0 0 var(--pulse-color); } 
    70% { box-shadow: 0 0 0 var(--pulse-size) transparent; } 
    100% { box-shadow: 0 0 0 0 transparent; } 
}
@keyframes advZoom { 0%, 100% { transform: var(--preset-transform) scale(1); } 50% { transform: var(--preset-transform) scale(1.1); } }
@keyframes advBounce { 
    0%, 20%, 50%, 80%, 100% { transform: var(--preset-transform) translateY(0); } 
    40% { transform: var(--preset-transform) translateY(-10px); } 
    60% { transform: var(--preset-transform) translateY(-5px); } 
}
@keyframes advRipple { 0% { transform: scale(0.8); opacity: 1; } 100% { transform: scale(1.2); opacity: 0; } }
@keyframes advGlow { 0% { box-shadow: 0 0 5px rgba(255,255,255,0.5); } 50% { box-shadow: 0 0 20px rgba(255,255,255,1); } 100% { box-shadow: 0 0 5px rgba(255,255,255,0.5); } }

.adv-video-anim-pulse { animation: advPulse 2s infinite; }
.adv-video-anim-zoom { animation: advZoom 2s infinite; }
.adv-video-anim-bounce { animation: advBounce 2s infinite; }
.adv-video-anim-ripple::after { content: ''; position: absolute; top: 0; left: 0; border: 2px solid rgba(255,255,255,0.5); border-radius: 50%; width: 100%; height: 100%; animation: advRipple 1.5s infinite; }
.adv-video-anim-glow { animation: advGlow 2s infinite; }

/* ==========================================================================
   Mute Button Engine (NEW)
   ========================================================================== */
.adv-video-mute-button {
    position: absolute; z-index: 21; /* Sit above the play button too, just in case */
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; width: 40px; height: 40px;
    cursor: pointer;
    transition: all 0.3s;

    /* Glassmorphism defaults - fully overridable from the Elementor panel */
    background-color: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);

    /* Default variables */
    --mute-offset-x: 0px;
    --mute-offset-y: 0px;

    transform: var(--preset-mute-transform, none);
}

.adv-video-mute-icon { display: flex; color: #fff; font-size: 16px; align-items: center; justify-content: center; }
.adv-video-mute-icon svg { fill: #fff; width: 1em; height: 1em; }

/* Position Presets - Mute Button (own namespace, independent of the play button) */

/* Top Left */
.adv-video-mute-pos-top-left .adv-video-mute-button {
    top: var(--mute-offset-y, 0);
    left: var(--mute-offset-x, 0);
    --preset-mute-transform: none;
}

/* Top Center */
.adv-video-mute-pos-top-center .adv-video-mute-button {
    top: var(--mute-offset-y, 0);
    left: 50%;
    --preset-mute-transform: translateX(calc(-50% + var(--mute-offset-x, 0)));
}

/* Top Right */
.adv-video-mute-pos-top-right .adv-video-mute-button {
    top: var(--mute-offset-y, 0);
    right: 0;
    --preset-mute-transform: translateX(calc(-1 * var(--mute-offset-x, 0)));
}

/* Center Left */
.adv-video-mute-pos-center-left .adv-video-mute-button {
    top: 50%;
    left: var(--mute-offset-x, 0);
    --preset-mute-transform: translateY(calc(-50% + var(--mute-offset-y, 0)));
}

/* Center */
.adv-video-mute-pos-center .adv-video-mute-button {
    top: 50%;
    left: 50%;
    --preset-mute-transform: translate(calc(-50% + var(--mute-offset-x, 0)), calc(-50% + var(--mute-offset-y, 0)));
}

/* Center Right */
.adv-video-mute-pos-center-right .adv-video-mute-button {
    top: 50%;
    right: 0;
    --preset-mute-transform: translate(calc(-1 * var(--mute-offset-x, 0)), calc(-50% + var(--mute-offset-y, 0)));
}

/* Bottom Left */
.adv-video-mute-pos-bottom-left .adv-video-mute-button {
    bottom: 0;
    left: var(--mute-offset-x, 0);
    --preset-mute-transform: translateY(calc(-1 * var(--mute-offset-y, 0)));
}

/* Bottom Center */
.adv-video-mute-pos-bottom-center .adv-video-mute-button {
    bottom: 0;
    left: 50%;
    --preset-mute-transform: translate(calc(-50% + var(--mute-offset-x, 0)), calc(-1 * var(--mute-offset-y, 0)));
}

/* Bottom Right (default) */
.adv-video-mute-pos-bottom-right .adv-video-mute-button {
    bottom: 0;
    right: 0;
    --preset-mute-transform: translate(calc(-1 * var(--mute-offset-x, 0)), calc(-1 * var(--mute-offset-y, 0)));
}