/* ==================== NEURAL BACKGROUND ==================== */
#neural-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0.4;
}

body.light-theme #neural-bg {
    opacity: 0.2;
}

/* ==================== AI AURA ==================== */
.ai-aura {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(ellipse at 30% 20%, rgba(139, 92, 246, 0.15) 0%, transparent 50%),
                radial-gradient(ellipse at 70% 80%, rgba(6, 182, 212, 0.1) 0%, transparent 50%),
                radial-gradient(ellipse at 50% 50%, rgba(244, 114, 182, 0.05) 0%, transparent 50%);
    animation: auraPulse 8s ease-in-out infinite;
}

@keyframes auraPulse {
    0%, 100% { opacity: 0.8; }
    50% { opacity: 1; }
}

/* Neural Background Animation Script
   Add this to each page:
   
   const canvas = document.getElementById('neural-bg');
   const ctx = canvas.getContext('2d');
   
   function resize() {
       canvas.width = window.innerWidth;
       canvas.height = window.innerHeight;
   }
   resize();
   window.addEventListener('resize', resize);
   
   const nodes = [];
   for (let i = 0; i < 50; i++) {
       nodes.push({
           x: Math.random() * canvas.width,
           y: Math.random() * canvas.height,
           vx: (Math.random() - 0.5) * 0.5,
           vy: (Math.random() - 0.5) * 0.5,
           size: Math.random() * 2 + 1
       });
   }
   
   function animate() {
       ctx.fillStyle = 'rgba(10, 10, 15, 0.1)';
       ctx.fillRect(0, 0, canvas.width, canvas.height);
       
       nodes.forEach(node => {
           node.x += node.vx;
           node.y += node.vy;
           if (node.x < 0 || node.x > canvas.width) node.vx *= -1;
           if (node.y < 0 || node.y > canvas.height) node.vy *= -1;
           ctx.beginPath();
           ctx.arc(node.x, node.y, node.size, 0, Math.PI * 2);
           ctx.fillStyle = '#8b5cf6';
           ctx.fill();
       });
       
       for (let i = 0; i < nodes.length; i++) {
           for (let j = i + 1; j < nodes.length; j++) {
               const dx = nodes[i].x - nodes[j].x;
               const dy = nodes[i].y - nodes[j].y;
               const dist = Math.sqrt(dx * dx + dy * dy);
               if (dist < 150) {
                   ctx.beginPath();
                   ctx.moveTo(nodes[i].x, nodes[i].y);
                   ctx.lineTo(nodes[j].x, nodes[j].y);
                   ctx.strokeStyle = `rgba(139, 92, 246, ${0.2 * (1 - dist / 150)})`;
                   ctx.stroke();
               }
           }
       }
       requestAnimationFrame(animate);
   }
   animate();
*/