/**
 * Advertisement Container Styles
 * Optimized for Google AdSense and manual ad placement
 */

/* Base Ad Container - Empty, ready for AdSense */
.ax-ad-container {
    display: block;
    margin: 1rem auto;
    background: transparent;
    position: relative;
    text-align: center;
}

.ax-adsense-ready {
    /* Container is empty and ready for ad code */
    min-height: 100px;
}

.ax-adsense-container {
    /* Container with AdSense code */
    overflow: hidden;
}

/* Standard Google AdSense Sizes */

/* Medium Rectangle (300x250) - Most common */
.ax-ad-medium-rectangle {
    width: 100%;
    max-width: 300px;
    min-height: 250px;
    margin: 1rem auto;
}

/* Large Rectangle (336x280) */
.ax-ad-large-rectangle {
    width: 100%;
    max-width: 336px;
    min-height: 280px;
    margin: 1rem auto;
}

/* Leaderboard (728x90) - Desktop banner */
.ax-ad-leaderboard {
    width: 100%;
    max-width: 728px;
    min-height: 90px;
    margin: 1rem auto;
}

/* Skyscraper (300x600) - Sidebar */
.ax-ad-skyscraper {
    width: 100%;
    max-width: 300px;
    min-height: 600px;
    margin: 1rem auto;
}

/* Responsive Auto Ads */
.ax-ad-responsive {
    width: 100%;
    min-height: 100px;
}

/* AdSense Ins Element Styling */
.ax-ad-container ins.adsbygoogle {
    display: block !important;
    text-align: center;
}

/* Ensure AdSense ads are visible */
.ax-adsense-container ins.adsbygoogle {
    min-height: inherit;
}

/* Empty Placeholder Container */
.ad-container.ad-placeholder-empty {
    width: 100%;
    min-height: 100px;
    background: transparent;
    border: none;
    padding: 0;
    margin: 1rem 0;
}

/* Responsive adjustments for ad containers */
@media (max-width: 768px) {
    /* On mobile, use responsive sizing */
    .ax-ad-leaderboard {
        max-width: 100%;
        min-height: 90px;
    }
    
    .ax-ad-skyscraper {
        max-width: 100%;
        min-height: 300px; /* Reduced height on mobile */
    }
    
    .ax-ad-medium-rectangle,
    .ax-ad-large-rectangle {
        max-width: 100%;
        min-height: 250px;
    }
    
    .ax-ad-container {
        margin: 0.75rem auto;
    }
}

/* Ensure ads don't break layout */
.ax-ad-container {
    clear: both;
    page-break-inside: avoid;
}

/* Print styles - hide ads */
@media print {
    .ax-ad-container,
    .ad-container {
        display: none !important;
    }
}
