.cacdfe {
    --cacdfe-thickness: 6px;
    --cacdfe-start-radius: 100px;
    --cacdfe-finish-radius: 100px;
    --cacdfe-track-color: #d1d5db;
    --cacdfe-fill-image: linear-gradient(90deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #8b5cf6, #ec4899, #8b5a2b);
    --cacdfe-origin-start: 0%;
    --cacdfe-origin-finish: 100%;
    --cacdfe-clip-start: 0%;
    --cacdfe-clip-finish: 100%;
    --cacdfe-layer-z: 99999;
    position: relative;
    display: flex;
    width: 100%;
    line-height: 0;
    pointer-events: none;
}

.cacdfe-force-foreground,
.cacdfe-layer-wrapper,
.cacdfe-layer-container {
    z-index: var(--cacdfe-layer-z, 99999) !important;
}

.cacdfe-layer-wrapper {
    pointer-events: none !important;
}

.cacdfe-force-foreground {
    position: relative;
    isolation: isolate;
}

.cacdfe-track {
    position: relative;
    overflow: hidden;
    background: var(--cacdfe-track-color);
}

.cacdfe-horizontal .cacdfe-track {
    width: 100%;
    height: var(--cacdfe-thickness);
    border-radius: var(--cacdfe-start-radius) var(--cacdfe-finish-radius) var(--cacdfe-finish-radius) var(--cacdfe-start-radius);
}

.cacdfe-vertical .cacdfe-track {
    width: var(--cacdfe-thickness);
    height: 220px;
    border-radius: var(--cacdfe-start-radius) var(--cacdfe-start-radius) var(--cacdfe-finish-radius) var(--cacdfe-finish-radius);
}

.cacdfe-fill {
    position: absolute;
    inset: 0;
    display: block;
    background-image: var(--cacdfe-fill-image);
    background-repeat: no-repeat;
    will-change: clip-path;
}

.cacdfe-horizontal .cacdfe-fill {
    clip-path: inset(0 var(--cacdfe-clip-finish) 0 var(--cacdfe-clip-start));
}

.cacdfe-vertical .cacdfe-fill {
    clip-path: inset(var(--cacdfe-clip-start) 0 var(--cacdfe-clip-finish) 0);
}

.elementor-editor-active .cacdfe-horizontal .cacdfe-track.cacdfe-previewing .cacdfe-fill {
    animation: cacdfe-preview-horizontal 900ms cubic-bezier(.22, 1, .36, 1) forwards;
}

.elementor-editor-active .cacdfe-vertical .cacdfe-track.cacdfe-previewing .cacdfe-fill {
    animation: cacdfe-preview-vertical 900ms cubic-bezier(.22, 1, .36, 1) forwards;
}

@keyframes cacdfe-preview-horizontal {
    from {
        clip-path: inset(0 var(--cacdfe-origin-finish) 0 var(--cacdfe-origin-start));
    }

    to {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes cacdfe-preview-vertical {
    from {
        clip-path: inset(var(--cacdfe-origin-start) 0 var(--cacdfe-origin-finish) 0);
    }

    to {
        clip-path: inset(0 0 0 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cacdfe {
        --cacdfe-clip-start: 0% !important;
        --cacdfe-clip-finish: 0% !important;
    }

    .elementor-editor-active .cacdfe-track.cacdfe-previewing .cacdfe-fill {
        animation: none;
    }
}