/* AdSense Override CSS - Ensure proper ad container styling */

/* Remove the forced display rules - let JavaScript handle visibility */
/* Just ensure the containers maintain their structure */

/* Ensure AdSense iframes and content are visible */
.adsbygoogle {
    /* Let AdSense control display - don't force it */
    visibility: visible !important;
}

/* Make sure ad containers maintain their size */
#sidebar-ad-left,
#sidebar-ad-right {
    width: 200px !important;
    min-height: 600px !important;
}

#mobile-ad-bottom {
    width: 100% !important;
    max-width: 600px !important;
    min-height: 90px !important;
}

/* Ensure iframes inside ads are visible */
.adsbygoogle iframe {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Style for empty ad containers (white boxes) */
.sidebar-ad-left,
.sidebar-ad-right,
.mobile-ad-bottom {
    background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
    border: 1px solid rgba(246, 195, 68, 0.2);
    border-radius: 8px;
    overflow: hidden;
}

/* Add loading animation for empty ads */
.adsbygoogle:empty {
    position: relative;
    background: linear-gradient(90deg, 
        rgba(255,255,255,0.05) 0%, 
        rgba(255,255,255,0.1) 50%, 
        rgba(255,255,255,0.05) 100%);
    background-size: 200% 100%;
    animation: adLoading 2s ease-in-out infinite;
}

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

/* Once ads load, remove the background */
.adsbygoogle:not(:empty) {
    background: transparent !important;
    animation: none !important;
}