/* =============================================================================
 * Ad-slot CLS reservation (engine-universal, theme-independent)
 *
 * Reserves min-height per canonical ad position per breakpoint so that
 * ad units loading after first paint do NOT trigger Cumulative Layout
 * Shift. Covers BOTH render paths the ad-management plugin emits:
 *   .ad-container.ad-{position}                (AdSense direct-code path)
 *   .mv-ad-target[data-pos="{position}"]       (Journey / Mediavine anchor)
 *
 * Why universal (not per-theme): every site using the ad-management plugin
 * benefits identically; ad sizing is a function of the ad-network unit, not
 * the site theme. Themes still own typography, spacing scale, colors.
 *
 * Sizes pick the SMALLEST commonly-served unit for each position so the
 * slot never shrinks after a fill (which is the CLS-causing direction).
 * Larger fills GROW the slot, which is layout-shift below but acceptable
 * (and unavoidable for variable ad sizes); reserving at the small floor
 * is the standard CWV-conscious posture.
 *
 * 9 positions x 3 breakpoints. Positions defined in
 * AdManagementPlugin::getCanonicalPositions() (8 canonical + content-inline,
 * added 2026-05-30 for editor-placed ad-slot blocks via theme-studio L5).
 *
 * NEVER emits user-visible content (no ::before/::after { content: ... }).
 * The "Advertisement" label is owned by AdManagementPlugin::renderAd()
 * and gated by the ads.show_label config flag, NOT by CSS. (S859 lesson.)
 * ============================================================================= */

/* ---- Common reset for every reserved slot ---- */
.ad-container,
.mv-ad-target {
    display: block;
    box-sizing: border-box;
    /* contain prevents Mediavine's late-inserted iframes from forcing
       any unexpected reflow outside the slot's own box. */
    contain: layout;
}

/* ---- Desktop default (>= 1024px): the rules outside any media query
       apply to desktop AND act as fallback for any agent that ignores
       the mobile-first overrides below. ---- */

.ad-container.ad-header-banner,
.mv-ad-target[data-pos="header-banner"] {
    min-height: 90px;
}

.ad-container.ad-footer-banner,
.mv-ad-target[data-pos="footer-banner"] {
    min-height: 90px;
}

.ad-container.ad-sidebar-top,
.mv-ad-target[data-pos="sidebar-top"],
.ad-container.ad-sidebar-bottom,
.mv-ad-target[data-pos="sidebar-bottom"] {
    min-height: 250px;
}

.ad-container.ad-content-top,
.mv-ad-target[data-pos="content-top"],
.ad-container.ad-content-middle,
.mv-ad-target[data-pos="content-middle"],
.ad-container.ad-content-bottom,
.mv-ad-target[data-pos="content-bottom"],
.ad-container.ad-content-inline,
.mv-ad-target[data-pos="content-inline"] {
    min-height: 280px;
}

.ad-container.ad-alert-inline,
.mv-ad-target[data-pos="alert-inline"] {
    min-height: 100px;
}

/* ---- Tablet (768px - 1023px) ---- */
@media (min-width: 768px) and (max-width: 1023px) {
    .ad-container.ad-content-top,
    .mv-ad-target[data-pos="content-top"],
    .ad-container.ad-content-middle,
    .mv-ad-target[data-pos="content-middle"],
    .ad-container.ad-content-bottom,
    .mv-ad-target[data-pos="content-bottom"],
    .ad-container.ad-content-inline,
    .mv-ad-target[data-pos="content-inline"] {
        min-height: 250px;
    }
}

/* ---- Mobile (<= 767px) ---- */
@media (max-width: 767px) {
    .ad-container.ad-header-banner,
    .mv-ad-target[data-pos="header-banner"],
    .ad-container.ad-footer-banner,
    .mv-ad-target[data-pos="footer-banner"] {
        min-height: 100px;
    }

    .ad-container.ad-sidebar-top,
    .mv-ad-target[data-pos="sidebar-top"],
    .ad-container.ad-sidebar-bottom,
    .mv-ad-target[data-pos="sidebar-bottom"],
    .ad-container.ad-content-top,
    .mv-ad-target[data-pos="content-top"],
    .ad-container.ad-content-middle,
    .mv-ad-target[data-pos="content-middle"],
    .ad-container.ad-content-bottom,
    .mv-ad-target[data-pos="content-bottom"],
    .ad-container.ad-content-inline,
    .mv-ad-target[data-pos="content-inline"] {
        min-height: 250px;
    }
}
