

.RainbowGlowHover{
    
    border-radius: var(--border-radius);



    position: relative;    
}

.RainbowGlowHover:hover::before, .RainbowGlowHover:hover::after{
    padding: var(--padding);
    border-radius: calc(var(--border-radius) + (var(--padding) / 2));
    animation: spin 2s linear infinite;
    background-image: conic-gradient(from var(--angle), #EC09E6, #0497F2, #3CFF00, #FFFF00, #EC09E6);



    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.RainbowGlowHover:hover::before{
    filter: blur(2rem);
    opacity: .8;
}





@property --angle{
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}
@keyframes spin{
    from{
        --angle: 0deg;
    }
    to{
        --angle: 360deg
    }
}







