.javo-wave-surface {
    overflow: hidden !important;
    isolation: isolate;
    contain: paint;
}

.javo-wave-surface[data-javo-wave-positioned="true"] {
    position: relative;
}

.javo-wave-ripple {
    position: absolute;
    z-index: 0;
    display: block;
    width: var(--javo-wave-size, 2.5rem);
    height: var(--javo-wave-size, 2.5rem);
    left: var(--javo-wave-x, 50%);
    top: var(--javo-wave-y, 50%);
    border-radius: 9999px;
    background: var(--javo-wave-color, rgba(255, 255, 255, 0.34));
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0);
    opacity: 0.72;
    animation: javoWaveRipple 620ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.javo-wave-surface > :not(.javo-wave-ripple, .jv-header-menu-badge) {
    position: relative;
    z-index: 1;
}

.javo-wave-surface > .jv-header-menu-badge {
    position: absolute;
    z-index: 2;
}

@keyframes javoWaveRipple {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 0.62;
    }

    70% {
        opacity: 0.28;
    }

    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .javo-wave-ripple {
        animation-duration: 1ms;
    }
}