/*
╔═══════════════════════════════════════════════════════════════╗
║         NEURAL CSS ENGINE - Theme Collection                  ║
║              Multiple Themes for Vencord                      ║
╚═══════════════════════════════════════════════════════════════╝

INSTALLATION:
1. Install Neural CSS Engine Pro extension
2. Copy theme CSS you want
3. Vencord: Settings > Themes > CSS Editor > Paste > Apply

*/

/* ================================================================
   THEME 1: NEURAL VOID - Dark Minimalist
   ================================================================ */
.neural-void-theme {
    --neural-enabled: true;
    --neural-overlay-opacity: 0.08;
    --neural-iridescent-strength: 0.5;
    --neural-morph-strength: 0.3;
    --neural-fresnel-power: 6.0;
    --neural-animation-speed: 12s;
    
    --neural-iri-1: #1a1a2e;
    --neural-iri-2: #16213e;
    --neural-iri-3: #0f3460;
    --neural-iri-4: #e94560;
    --neural-iri-5: #533483;
    --neural-iri-6: #0a0a0f;
    --neural-iri-7: #1a1a2e;
}

.neural-void-overlay {
    background: 
        radial-gradient(ellipse at 20% 80%, var(--neural-iri-4) 0%, transparent 40%),
        radial-gradient(ellipse at 80% 20%, var(--neural-iri-3) 0%, transparent 50%);
    animation: voidPulse 6s ease-in-out infinite;
}

@keyframes voidPulse {
    0%, 100% { opacity: 0.06; transform: scale(1); }
    50% { opacity: 0.12; transform: scale(1.05); }
}


/* ================================================================
   THEME 2: NEURAL HOLOGRAPHIC - Chrome Effect  
   ================================================================ */
.neural-holo-theme {
    --neural-enabled: true;
    --neural-overlay-opacity: 0.15;
    --neural-iridescent-strength: 1.0;
    --neural-fresnel-power: 3.0;
    --neural-path-trace: true;
    --neural-animation-speed: 5s;
    
    --neural-iri-1: #ff3366;
    --neural-iri-2: #33ffcc;
    --neural-iri-3: #ffff33;
    --neural-iri-4: #ff33ff;
    --neural-iri-5: #33ffff;
    --neural-iri-6: #ffffff;
    --neural-iri-7: #ff6633;
}

.neural-holo-shimmer {
    position: fixed;
    top: -100%;
    left: -100%;
    width: 300%;
    height: 300%;
    background: conic-gradient(
        from 0deg,
        transparent,
        var(--neural-iri-1),
        var(--neural-iri-2),
        var(--neural-iri-3),
        var(--neural-iri-4),
        var(--neural-iri-5),
        var(--neural-iri-6),
        transparent
    );
    opacity: 0.1;
    pointer-events: none;
    z-index: 9999;
    animation: holoShimmer 8s linear infinite;
}

@keyframes holoShimmer {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.neural-holo-chrome {
    text-shadow: 
        0 0 10px var(--neural-iri-1),
        0 0 20px var(--neural-iri-2),
        0 0 30px var(--neural-iri-3);
    animation: chromeText 3s ease-in-out infinite;
}

@keyframes chromeText {
    0%, 100% { 
        text-shadow: 
            0 0 10px var(--neural-iri-1),
            0 0 20px var(--neural-iri-2),
            0 0 30px var(--neural-iri-3);
    }
    50% {
        text-shadow: 
            0 0 20px var(--neural-iri-2),
            0 0 40px var(--neural-iri-3),
            0 0 60px var(--neural-iri-1);
    }
}


/* ================================================================
   THEME 3: NEURAL MATRIX - Green Digital Rain
   ================================================================ */
.neural-matrix-theme {
    --neural-enabled: true;
    --neural-overlay-opacity: 0.25;
    --neural-iridescent-strength: 0.6;
    --neural-animation-speed: 4s;
    
    --neural-iri-1: #00ff00;
    --neural-iri-2: #00cc00;
    --neural-iri-3: #009900;
    --neural-iri-4: #00ff66;
    --neural-iri-5: #33ff33;
    --neural-iri-6: #006600;
    --neural-iri-7: #003300;
}

.neural-matrix-rain {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9990;
    overflow: hidden;
    opacity: 0.15;
}

.neural-matrix-column {
    position: absolute;
    top: -100%;
    font-family: monospace;
    font-size: 14px;
    color: var(--neural-iri-1);
    text-shadow: 0 0 10px var(--neural-iri-1);
    writing-mode: vertical-rl;
    animation: matrixFall linear infinite;
}

@keyframes matrixFall {
    0% { transform: translateY(-100%); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(100vh); opacity: 0; }
}


/* ================================================================
   THEME 4: NEURAL PLASMA - Organic Flowing
   ================================================================ */
.neural-plasma-theme {
    --neural-enabled: true;
    --neural-overlay-opacity: 0.18;
    --neural-iridescent-strength: 0.9;
    --neural-morph-strength: 0.5;
    --neural-animation-speed: 6s;
    
    --neural-iri-1: #ff0066;
    --neural-iri-2: #ff6600;
    --neural-iri-3: #ffff00;
    --neural-iri-4: #00ff66;
    --neural-iri-5: #00ffff;
    --neural-iri-6: #6600ff;
    --neural-iri-7: #ff0066;
}

.neural-plasma-bg {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9995;
    opacity: 0.2;
    background: 
        radial-gradient(ellipse 80% 50% at 20% 40%, var(--neural-iri-1) 0%, transparent 50%),
        radial-gradient(ellipse 60% 80% at 70% 60%, var(--neural-iri-3) 0%, transparent 50%),
        radial-gradient(ellipse 50% 50% at 50% 80%, var(--neural-iri-5) 0%, transparent 50%);
    filter: blur(40px);
    animation: plasmaFlow 10s ease-in-out infinite;
}

@keyframes plasmaFlow {
    0%, 100% { 
        transform: scale(1) rotate(0deg);
        filter: blur(40px) hue-rotate(0deg);
    }
    25% {
        transform: scale(1.1) rotate(2deg);
        filter: blur(50px) hue-rotate(30deg);
    }
    50% {
        transform: scale(0.95) rotate(-1deg);
        filter: blur(35px) hue-rotate(60deg);
    }
    75% {
        transform: scale(1.05) rotate(1deg);
        filter: blur(45px) hue-rotate(90deg);
    }
}


/* ================================================================
   THEME 5: NEURAL NEON CITY - Cyberpunk
   ================================================================ */
.neural-neoncity-theme {
    --neural-enabled: true;
    --neural-overlay-opacity: 0.12;
    --neural-iridescent-strength: 1.0;
    --neural-fresnel-power: 2.5;
    --neural-path-trace: true;
    --neural-animation-speed: 3s;
    
    --neural-iri-1: #ff0000;  /* Red neon */
    --neural-iri-2: #ff00ff;  /* Magenta */
    --neural-iri-3: #00ffff;  /* Cyan */
    --neural-iri-4: #ffff00;  /* Yellow */
    --neural-iri-5: #ff6600;  /* Orange */
    --neural-iri-6: #00ff00;  /* Green */
    --neural-iri-7: #6600ff;  /* Purple */
}

.neural-neon-sign {
    position: fixed;
    bottom: 20%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 24px;
    font-weight: bold;
    color: var(--neural-iri-1);
    text-shadow: 
        0 0 5px var(--neural-iri-1),
        0 0 10px var(--neural-iri-1),
        0 0 20px var(--neural-iri-1),
        0 0 40px var(--neural-iri-2);
    animation: neonFlicker 0.5s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 9999;
}

@keyframes neonFlicker {
    0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
        text-shadow: 
            0 0 5px var(--neural-iri-1),
            0 0 10px var(--neural-iri-1),
            0 0 20px var(--neural-iri-1),
            0 0 40px var(--neural-iri-2);
    }
    20%, 24%, 55% {
        text-shadow: none;
        color: #333;
    }
}

.neural-rain-reflection {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9991;
    background: 
        linear-gradient(transparent 50%, rgba(0, 255, 255, 0.03) 50%);
    background-size: 100% 4px;
    animation: rainMove 0.2s linear infinite;
}

@keyframes rainMove {
    0% { background-position: 0 0; }
    100% { background-position: 0 20px; }
}