/* theme.css - Theme-specific styling like backgrounds, blobs, layout properties */

body {
    background-color: var(--bg-dark, #030a03);
}

/* Animated Background Blobs */
.blob {
    position: absolute;
    width: 50vw;
    height: 50vw;
    max-width: 500px;
    max-height: 500px;
    background: radial-gradient(circle, var(--primary-glow-dim) 0%, rgba(45, 122, 79, 0) 70%);
    border-radius: 50%;
    filter: blur(60px);
    z-index: -1;
    animation: move 20s infinite alternate;
    pointer-events: none; /* Make sure they don't block clicks */
}

@keyframes move {
    from { transform: translate(-10%, -10%) scale(1); }
    to { transform: translate(10%, 10%) scale(1.1); }
}

.blob-1 { 
    top: -10%; 
    left: -10%; 
    animation-delay: 0s; 
}

.blob-2 { 
    bottom: -10%; 
    right: -10%; 
    animation-delay: -5s; 
    background: radial-gradient(circle, rgba(45, 122, 79, 0.1) 0%, rgba(45, 122, 79, 0) 70%); 
}

.blob-3 { 
    top: 40%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    animation-delay: -10s; 
    width: 60vw; 
    height: 60vw;
    max-width: 600px; 
    max-height: 600px; 
}