/*
Theme Name: GoDIEP Theme
Theme URI: https://www.godiep.com/
Template: buddyboss-theme
Author: Ganes Solutions
Author URI: https://www.ganessolutions.com/
Version: 1.0.0.1745909678
Updated: 2025-04-29 06:54:38

*/

:root {
    --clr-primary: var(--wp--preset--color--vivid-purple);       /* #9b51e0 */
    --clr-secondary: var(--wp--preset--color--metallic-red);     /* #b02b2c */
    --clr-tertiary: var(--wp--preset--color--maximum-yellow-red);/* #edae44 */
    --clr-green: #27ae60; /* Manually added green (emerald-like) */
}

.gradient_wrapper {
    transition: 0.5s ease-in-out all;
    opacity: 1;
    z-index: 98;
    position: fixed;
    pointer-events: none;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.gradient-left {
    position: absolute;
    z-index: 98;
    width: 1000px;
    height: 1000px;
    left: -55%;
    top: -170px;
    mix-blend-mode: multiply;
    background-image: radial-gradient(circle, var(--clr-primary) 0%, rgba(255, 255, 255, 0) 40%);
    animation: moveGradient-left 10s linear infinite, fadeGradient 5s forwards ease-in-out;
}

.gradient-right {
    position: absolute;
    z-index: 99;
    width: 800px;
    height: 800px;
    right: -10%;
    top: 0;
    mix-blend-mode: multiply;
    background:
        radial-gradient(circle at 100% 50%, var(--clr-primary) 8%, rgba(255, 255, 255, 0) 25%),
        radial-gradient(circle at 100% 30%, var(--clr-secondary) 10%, rgba(255, 255, 255, 0) 20%),
        radial-gradient(circle at 100% 15%, var(--clr-green) 5%, rgba(255, 255, 255, 0) 30%),
        radial-gradient(circle at 75% 45%, var(--clr-tertiary) 1%, rgba(255, 255, 255, 0) 25%);
    animation: moveGradient-right ease-in-out 10s infinite, fadeGradient 5s forwards ease-in-out;
}

/* Animations */
@keyframes moveGradient-left {
    0% { transform: translate(0, 0); }
    50% { transform: translate(20px, 20px); }
    100% { transform: translate(0, 0); }
}

@keyframes moveGradient-right {
    0% { transform: translate(0, 0); }
    50% { transform: translate(-20px, -20px); }
    100% { transform: translate(0, 0); }
}

@keyframes fadeGradient {
    from { opacity: 0; }
    to { opacity: 1; }
}