/* --- 1. THE SMOOTHED PSYCHEDELIC LOOP --- */
body::before {
    content: "";
    position: fixed;
    top: -50px; 
    left: -50px; 
    width: calc(100% + 100px);
    height: calc(100vh + 100px);
    z-index: -10;
    
    background: linear-gradient(90deg, 
        #590d82 0%,   /* Deep Purple */
        #ff00cc 25%,  /* Neon Pink */
        #00f7ff 50%,  /* Cyan */
        #3300ff 75%,  /* Blue */
        #590d82 100%  /* Loop back */
    );
    
    background-size: 200% 100%; 
    animation: infiniteScroll 20s linear infinite;
    filter: blur(80px); 
    transform: scale(1.1);
}

@keyframes infiniteScroll {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* --- 2. MAKE THEME TRANSPARENT (Essential) --- */
/* We keep !important here only to hide the white theme background */
body, .site, .site-content, .ast-container, 
.entry-content, .site-header, .main-header-bar,
.footer-adv, .site-footer, .wp-site-blocks, #page {
    background-color: transparent !important;
    background-image: none !important;
}

/* --- 3. GLASS CONTAINERS (UNLOCKED) --- */
/* We removed all !important tags from layout properties here.
   Now the WordPress Editor settings will win. */
.uagb-section__inner-wrap,         
.wp-block-group__inner-container, 
.ast-container .entry-content,     
.wp-block-columns,
.wp-block-group {                
    /* Style - Keep these to maintain the look */
    background-color: rgba(0, 0, 0, 0.6) !important; 
    backdrop-filter: blur(10px); 
    -webkit-backdrop-filter: blur(10px);
    border-radius: 20px;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
    
    /* Layout - UNLOCKED (No !important) */
    /* This sets a default, but your Editor changes will override it */
    padding: 20px; 
    width: 100%;
}

/* Stop Full Width Sections from shifting, but allow resizing */
.alignfull, .alignwide {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    background: transparent !important;
}

/* --- 4. TEXT COLORS --- */
/* We keep !important here so text is always readable on dark backgrounds */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
    text-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

p, li, span, a {
    color: #f0f0f0 !important;
}

/* Buttons */
.wp-block-button__link, button {
    background-color: #ff00cc !important;
    color: #fff !important;
    border-radius: 50px !important;
    padding: 12px 24px !important;
    box-shadow: 0 0 15px #ff00cc; 
    border: none !important;
}

/* --- 5. HEADER SPACING --- */
/* We keep this to prevent the header overlap, 
   but you can override it with a 'Spacer' block if needed. */
.main-header-bar {
    background-color: rgba(0,0,0,0.6) !important;
    border-bottom: none !important;
}

@media (min-width: 769px) {
    .site-content {
        padding-top: 120px; /* Default desktop spacing */
    }
}

@media (max-width: 768px) {
    .site-content {
        padding-top: 80px; /* Default mobile spacing */
    }
}