/**
 * BoTrade.ai: ad network - Frontend Styles
 * 
 * Critical CSS for layout stabilization.
 * These styles are designed to be minimal and non-visible.
 * 
 * @package BoTrade_Ad_Network
 * @author BoTrade.ai
 */

/* ==========================================================================
   CSS Custom Properties
   ========================================================================== */

:root {
    --botrade-ad-min-height: 50px;
    --botrade-ad-height: 250px;
    --botrade-sidebar-ad-height: 250px;
    --botrade-content-ad-height: 280px;
}

@media (min-width: 768px) {
    :root {
        --botrade-ad-min-height: 90px;
        --botrade-ad-height: 280px;
    }
}

/* ==========================================================================
   Core Stabilization
   ========================================================================== */

/* Stabilized containers */
[data-botrade-stabilized] {
    contain: layout style paint;
    content-visibility: auto;
}

/* Ad space containers */
.botrade-ad-space {
    display: block;
    position: relative;
    overflow: hidden;
    contain: layout style paint;
    content-visibility: auto;
    background: transparent;
    transition: min-height 0.15s ease-out, height 0.15s ease-out;
}

/* Prevent collapse when empty */
.botrade-ad-space:empty::before {
    content: '';
    display: block;
    min-height: inherit;
}

/* ==========================================================================
   Google AdSense Stabilization
   ========================================================================== */

.adsbygoogle,
ins.adsbygoogle,
[data-ad-client] {
    display: block;
    contain: layout style paint;
    content-visibility: auto;
    min-height: var(--botrade-ad-min-height);
    contain-intrinsic-size: auto var(--botrade-ad-height);
}

/* Filled ads */
ins.adsbygoogle[data-ad-status="filled"] {
    min-height: auto !important;
}

/* Unfilled ads - collapse gracefully */
ins.adsbygoogle[data-ad-status="unfilled"] {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
}

/* ==========================================================================
   Google Ad Manager Stabilization
   ========================================================================== */

[id^="div-gpt-ad"],
[data-google-query-id],
.gpt-ad {
    display: block;
    contain: layout style paint;
    content-visibility: auto;
    min-height: var(--botrade-ad-min-height);
    contain-intrinsic-size: auto var(--botrade-ad-height);
}

/* ==========================================================================
   Ezoic Stabilization
   ========================================================================== */

.ezoic-ad,
[id^="ezoic-pub-ad"],
.ez-video-wrap {
    display: block;
    contain: layout style paint;
    content-visibility: auto;
    min-height: var(--botrade-ad-min-height);
}

/* ==========================================================================
   MediaVine Stabilization
   ========================================================================== */

.mv-ad-box,
[id^="mediavine-"],
.adunitwrap {
    display: block;
    contain: layout style paint;
    content-visibility: auto;
    min-height: var(--botrade-ad-min-height);
}

/* ==========================================================================
   AdThrive Stabilization
   ========================================================================== */

.adthrive-ad,
[id^="adthrive_"] {
    display: block;
    contain: layout style paint;
    content-visibility: auto;
    min-height: var(--botrade-ad-min-height);
}

/* ==========================================================================
   Anchor Ad Stabilization
   ========================================================================== */

[data-anchor-status],
[class*="anchor-ad"],
.adsbygoogle[data-anchor-status] {
    position: fixed !important;
    z-index: 9998 !important;
    contain: layout style;
}

/* Bottom anchor */
[data-anchor-status="displayed"] {
    bottom: 0;
    left: 0;
    right: 0;
}

/* ==========================================================================
   Vignette/Interstitial Stabilization
   ========================================================================== */

[data-vignette-loaded],
[class*="vignette"],
.adsbygoogle[data-vignette-loaded] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 99999 !important;
}

/* ==========================================================================
   Filled Ad States
   ========================================================================== */

[data-botrade-filled="true"] {
    min-height: auto !important;
    contain-intrinsic-size: unset;
}

[data-botrade-unfilled="true"] {
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* ==========================================================================
   Context-Specific Stabilization
   ========================================================================== */

/* Sidebar ads */
.sidebar [data-botrade-stabilized],
aside [data-botrade-stabilized],
.widget-area [data-botrade-stabilized],
#secondary [data-botrade-stabilized] {
    min-height: var(--botrade-sidebar-ad-height);
    contain-intrinsic-size: auto var(--botrade-sidebar-ad-height);
    margin-bottom: 1rem;
}

/* In-content ads */
article [data-botrade-stabilized],
.entry-content [data-botrade-stabilized],
.post-content [data-botrade-stabilized],
.page-content [data-botrade-stabilized] {
    margin: 1.5rem 0;
    min-height: var(--botrade-content-ad-height);
    contain-intrinsic-size: auto var(--botrade-content-ad-height);
}

/* Header/footer ads */
header [data-botrade-stabilized],
footer [data-botrade-stabilized] {
    margin: 0.5rem 0;
}

/* ==========================================================================
   Full-Width Ads
   ========================================================================== */

.botrade-ad-space[data-type="full-width"],
[data-full-width-responsive="true"] {
    width: 100%;
    max-width: 100vw;
}

/* Break out of container for full width */
.entry-content .botrade-ad-space[data-type="full-width"],
.post-content .botrade-ad-space[data-type="full-width"] {
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    width: 100vw;
}

/* ==========================================================================
   Animation Dampening
   ========================================================================== */

/* Prevent layout-shifting animations during load */
[data-botrade-stabilized]:not([data-botrade-filled]) * {
    animation-duration: 0.001s !important;
    transition-duration: 0.001s !important;
}

/* Restore animations after fill */
[data-botrade-stabilized][data-botrade-filled] * {
    animation-duration: unset !important;
    transition-duration: unset !important;
}

/* ==========================================================================
   Spacing & Flow Protection
   ========================================================================== */

/* Prevent stacking */
.botrade-ad-space+.botrade-ad-space {
    margin-top: 1rem;
}

/* Grid protection */
.botrade-protected-grid {
    display: grid;
    grid-template-rows: auto;
}

/* Flex protection */
.botrade-protected-flex {
    display: flex;
    flex-direction: column;
}

/* Content flow */
.botrade-content-flow {
    contain: content;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */

@media (max-width: 480px) {
    :root {
        --botrade-ad-min-height: 50px;
        --botrade-ad-height: 250px;
        --botrade-sidebar-ad-height: 250px;
        --botrade-content-ad-height: 250px;
    }

    .botrade-ad-space[data-type="horizontal"] {
        min-height: 100px;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    :root {
        --botrade-ad-min-height: 90px;
        --botrade-ad-height: 280px;
    }
}

@media (min-width: 769px) {
    .botrade-ad-space[data-type="vertical"] {
        min-height: 600px;
    }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {

    .botrade-ad-space,
    .adsbygoogle,
    [id^="div-gpt-ad"],
    .ezoic-ad,
    .mv-ad-box,
    .adthrive-ad {
        display: none !important;
    }
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .botrade-ad-space {
        transition: none !important;
    }
}