/* Default theme variables on the wrapper container */
.elementor-widget-image {
    --rgb-color-1: #ff007f;
    --rgb-color-2: #00f0ff;
    --rgb-color-3: #7000ff;
    --rgb-glow-spread: 15px;
    --rgb-speed: 4s;
    --rgb-thickness: 4px;
    --rgb-radius: 12px;
}

/* Active class applied in editor and frontend when switcher is 'yes' */
.rgb-frame-active-b942ec02-yes .elementor-image {
    position: relative !important;
    display: inline-block !important;
    max-width: 100% !important;
    z-index: 1 !important;
    box-sizing: border-box !important;
    padding: var(--rgb-thickness) !important;
    border-radius: var(--rgb-radius) !important;
    overflow: hidden !important;
}

/* Background rotating conic gradient frame */
.rgb-frame-active-b942ec02-yes .elementor-image::before {
    content: '' !important;
    position: absolute !important;
    top: -50% !important;
    left: -50% !important;
    width: 200% !important;
    height: 200% !important;
    background: conic-gradient(
        var(--rgb-color-1), 
        var(--rgb-color-2), 
        var(--rgb-color-3), 
        var(--rgb-color-1)
    ) !important;
    animation: rgb-rotate-b942ec02 var(--rgb-speed) linear infinite !important;
    z-index: -2 !important;
    border-radius: var(--rgb-radius) !important;
}

/* Outer RGB Glowing shadow */
.rgb-frame-active-b942ec02-yes .elementor-image::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: conic-gradient(
        var(--rgb-color-1), 
        var(--rgb-color-2), 
        var(--rgb-color-3), 
        var(--rgb-color-1)
    ) !important;
    z-index: -1 !important;
    filter: blur(var(--rgb-glow-spread)) !important;
    opacity: 0.8 !important;
    border-radius: inherit !important;
    animation: rgb-rotate-b942ec02 var(--rgb-speed) linear infinite !important;
}

/* Force inner image corner radiuses to match perfectly */
.rgb-frame-active-b942ec02-yes .elementor-image img {
    border-radius: calc(var(--rgb-radius) - var(--rgb-thickness)) !important;
    display: block !important;
    width: 100% !important;
    position: relative !important;
    z-index: 2 !important;
}

@keyframes rgb-rotate-b942ec02 {
    100% {
        transform: rotate(360deg);
    }
}