/**
 * BCM Dynamic Ads - Plugin Styles
 * Optimized for Bus Conversion Magazine
 */

/* Prevent FOUC: keep sidebar ads out of layout until JS finishes flatten/trim.
   Do NOT use visibility:hidden — children with visibility:visible still paint. */
#bcm-ads-container:not(.bcm-ads-ready),
.bcm-dynamic-ads-container:not(.bcm-ads-ready) {
	display: none !important;
}

#bcm-ads-container.bcm-ads-ready,
.bcm-dynamic-ads-container.bcm-ads-ready {
	display: block !important;
}

/* Sidebar spacing between stacked ads */
#bcm-ads-container > .bcm-dynamic-ad-wrapper:not(:last-child),
#ads-ctn #bcm-ads-container > .bcm-dynamic-ad-wrapper:not(:last-child) {
    margin-bottom: 20px !important;
}

/* One ad slot per wrapper in the sidebar (pre-flatten only). */
#bcm-ads-container:not(.bcm-ads-ready) > .bcm-dynamic-ad-wrapper > .busco-target ~ .busco-target,
#bcm-ads-container:not(.bcm-ads-ready) > .bcm-dynamic-ad-wrapper > .ad-item ~ .ad-item,
#bcm-ads-container:not(.bcm-ads-ready) > .bcm-dynamic-ad-wrapper > .ad-item ~ .busco-target,
#bcm-ads-container:not(.bcm-ads-ready) > .bcm-dynamic-ad-wrapper > .busco-target ~ .ad-item {
	display: none !important;
}

/* BCM Ad column container */
#ads-ctn, .bcm-dynamic-ads {
    position: relative;
    height: auto;
    overflow: hidden;
}

/* Individual ad wrapper - supports both BCM and new classes */
.dynamic-ad-wrapper, .busco-highlight-wrapper, .bcm-dynamic-ad-wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
    flex-shrink: 0; /* Bricks #adsList is flex — never squash creatives to fit max-height */
    height: auto;
    max-height: none;
    transition: opacity 0.3s ease-in-out;
    /* Margin is now applied dynamically via JavaScript based on admin settings */
}

/* Bricks sidebar column: children must keep natural height; trim removes extras. */
#adsList > .bcm-dynamic-ad-wrapper,
#adsList > .ad-item,
#adsList > .busco-highlight-wrapper {
    flex-shrink: 0 !important;
    height: auto !important;
    max-height: none !important;
}

/* Ensure ads don't break the layout */
.dynamic-ad-wrapper > *, .busco-highlight-wrapper > *, .bcm-dynamic-ad-wrapper > * {
    max-width: 100%;
    height: auto;
}

/* Loading state */
.dynamic-ad-wrapper.loading, .busco-highlight-wrapper.loading {
    opacity: 0.5;
    pointer-events: none;
}

/* Error state for failed ad loads */
.dynamic-ad-wrapper.error, .busco-highlight-wrapper.error {
    display: none;
}

/* Placeholder styling for fallback ads */
.ad-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border: 1px dashed #dee2e6;
    color: #6c757d;
    font-size: 14px;
    text-align: center;
    border-radius: 4px;
    min-height: 367px; /* BCM standard ad height */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Advanced Ads specific styling */
.dynamic-ad-wrapper .advads-ad, .busco-highlight-wrapper .advads-ad {
    width: 100% !important;
    max-width: 100% !important;
}

/* BCM specific ad styling */
.busco-highlight-wrapper .ad-item, .bcm-dynamic-ad-wrapper .ad-item {
    width: 100%;
    height: auto;
}

/* BCM ads should adapt to their actual content height */
#ads-ctn .dynamic-ad-wrapper, #ads-ctn .busco-highlight-wrapper, #ads-ctn .bcm-dynamic-ad-wrapper {
    min-height: auto; /* Let ads use their natural height for better spacing */
}

/* Override any conflicting margins on ad elements */
#ads-ctn .bcm-dynamic-ad-wrapper .busco-highlight-wrapper,
#ads-ctn .bcm-dynamic-ad-wrapper .ad-item {
    margin: 0 !important;
    padding: 0;
}

/* BCM post content styling */
#post-content {
    position: relative;
}

/* Main container layout support */
#main-container {
    position: relative;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #ads-ctn, .bcm-dynamic-ads {
        margin-top: 20px;
    }
    
    .dynamic-ad-wrapper, .busco-highlight-wrapper {
        margin-bottom: 20px !important;
    }
}

@media (max-width: 480px) {
    .dynamic-ad-wrapper, .busco-highlight-wrapper {
        margin-bottom: 15px !important;
    }
    
    .ad-placeholder {
        min-height: 250px;
        font-size: 12px;
    }
}

/* Oxygen Builder specific adjustments */
.oxy-post #ads-ctn {
    position: relative;
    z-index: 1;
}

/* Ensure proper spacing in Oxygen layouts */
.ct-section #ads-ctn {
    height: auto;
    min-height: 200px;
}

/* Handle sticky ads if needed */
.dynamic-ad-wrapper.sticky, .busco-highlight-wrapper.sticky {
    position: sticky;
    top: 20px;
    z-index: 100;
}

/* Animation for ad insertion */
@keyframes fadeInAd {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dynamic-ad-wrapper.fade-in, .busco-highlight-wrapper.fade-in {
    animation: fadeInAd 0.4s ease-out;
}

/* Ensure smooth transitions */
.dynamic-ad-wrapper *, .busco-highlight-wrapper * {
    box-sizing: border-box;
}

/* Fix for common ad display issues */
.dynamic-ad-wrapper iframe, .busco-highlight-wrapper iframe {
    max-width: 100% !important;
    height: auto !important;
}

.dynamic-ad-wrapper img, .busco-highlight-wrapper img {
    max-width: 100% !important;
    height: auto !important;
}

/* WordPress admin bar compatibility */
body.admin-bar .dynamic-ad-wrapper.sticky,
body.admin-bar .busco-highlight-wrapper.sticky {
    top: 52px; /* Adjust for admin bar */
}

@media screen and (max-width: 782px) {
    body.admin-bar .dynamic-ad-wrapper.sticky,
    body.admin-bar .busco-highlight-wrapper.sticky {
        top: 46px; /* Adjust for mobile admin bar */
    }
}

/* Debug mode styling (for development) */
body.bcm-debug .dynamic-ad-wrapper,
body.bcm-debug .busco-highlight-wrapper {
    border: 2px solid #007cba;
    background: rgba(0, 124, 186, 0.1);
    position: relative;
}

body.bcm-debug .dynamic-ad-wrapper::before,
body.bcm-debug .busco-highlight-wrapper::before {
    content: 'Ad #' counter(ad-counter);
    counter-increment: ad-counter;
    position: absolute;
    top: 0;
    left: 0;
    background: #007cba;
    color: white;
    padding: 2px 6px;
    font-size: 10px;
    z-index: 10;
    font-family: monospace;
}

body.bcm-debug #ads-ctn {
    counter-reset: ad-counter;
}

/* Print styles - hide ads when printing */
@media print {
    #ads-ctn,
    .bcm-dynamic-ads,
    .dynamic-ad-wrapper,
    .busco-highlight-wrapper {
        display: none !important;
    }
}