/* ========================================
   CRITICAL: Animated backgrounds
   Loaded via Django {% static %} - works without Vite
   ======================================== */

/* Fallbacks for CSS vars when only this file loads */
:root {
    --primary: #7C4DFF;
    --accent: #FF4081;
    --success: #00E676;
    --gold: #FFD700;
}

/* === ALL PAGES: Body gradient + animation === */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(ellipse at 10% 20%, rgba(124, 77, 255, 0.28) 0%, transparent 50%),
        radial-gradient(ellipse at 90% 80%, rgba(255, 64, 129, 0.2) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 50%, rgba(0, 230, 118, 0.12) 0%, transparent 60%);
    animation: bgShift 15s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: -1;
}

@keyframes bgShift {
    0% { transform: scale(1) rotate(0deg); }
    100% { transform: scale(1.1) rotate(3deg); }
}

/* === NON-AUTH: Floating blobs container === */
.floating-elements {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.floating-element {
    position: absolute;
    background: rgba(124, 77, 255, 0.18);
    border-radius: 50%;
    animation: float 15s infinite linear;
    will-change: transform;
}

@keyframes float {
    0% { transform: translate3d(0, 0, 0) rotate(0deg); }
    100% { transform: translate3d(0, -100px, 0) rotate(360deg); }
}

/* Auth pages: background/particles/grid — in auth.css (Vite bundle), not here */

/* Mobile: hide blobs for performance */
@media (max-width: 768px) {
    .floating-elements {
        display: none;
    }
}

/* Note: background animations kept for prefers-reduced-motion - they are subtle/decorative */