/* cms-core/assets/css/cms-ads.css
   ─────────────────────────────────────────────────────────────────────────────
   CLS guards for ad slots.

   Enqueued by cms_ads_enqueue_assets() (cms-core/helpers-ads.php) alongside the
   first rendered slot, so every theme gets it without per-theme wiring. The
   wrapper only exists when render_ad_slot() found an ad, so an empty slot
   (no matching ad row / disabled override) still renders nothing at all.

   Per-group reservations keep late-loading ad network embeds from pushing the
   page around while they render. Heights are tunable via the custom properties
   below — override them in a theme's style.css / custom.css to adjust, e.g.:

       .ad-slot-wrap { --ad-slot-wide-min: 100px; }

   The defaults are declared at zero specificity (:where) so a theme's plain
   .ad-slot-wrap rule always wins, even though this stylesheet loads after the
   theme's (it is emitted in the body with the first slot).

   The mobile breakpoint (900px) matches the .ad-target-desktop/-mobile hide
   rules in the theme stylesheets. Device-hidden wrappers are display:none, so
   the reservations never leave phantom height on them. */

:where(.ad-slot-wrap) {
  --ad-slot-wide-min: 90px;        /* leaderboard band (header/footer/in-article), desktop */
  --ad-slot-wide-min-mobile: 50px; /* leaderboard band, mobile banner height */
  --ad-slot-sidebar-min: 250px;    /* sidebar 300×N boxes, 300×250 floor */
}

/* ── Wide band slots: header/footer + in-article ────────────────────────── */
.ad-slot-wrap[data-slot="homepage_top"],
.ad-slot-wrap[data-slot="homepage_bottom"],
.ad-slot-wrap[data-slot="single_top"],
.ad-slot-wrap[data-slot="single_bottom"],
.ad-slot-wrap[data-slot="homepage_before_latest"],
.ad-slot-wrap[data-slot="single_in_article_p2"],
.ad-slot-wrap[data-slot="single_in_article_p5"] {
  min-height: var(--ad-slot-wide-min, 90px);
}
@media (max-width: 900px) {
  .ad-slot-wrap[data-slot="homepage_top"],
  .ad-slot-wrap[data-slot="homepage_bottom"],
  .ad-slot-wrap[data-slot="single_top"],
  .ad-slot-wrap[data-slot="single_bottom"],
  .ad-slot-wrap[data-slot="homepage_before_latest"],
  .ad-slot-wrap[data-slot="single_in_article_p2"],
  .ad-slot-wrap[data-slot="single_in_article_p5"] {
    min-height: var(--ad-slot-wide-min-mobile, 50px);
  }
}

/* ── Sidebar slots: 300×N boxes ─────────────────────────────────────────── */
.ad-slot-wrap[data-slot="homepage_sidebar"],
.ad-slot-wrap[data-slot="homepage_sidebar_middle"],
.ad-slot-wrap[data-slot="homepage_sidebar_bottom"],
.ad-slot-wrap[data-slot="single_sidebar_top"],
.ad-slot-wrap[data-slot="single_sidebar_middle"],
.ad-slot-wrap[data-slot="single_sidebar_bottom"] {
  min-height: var(--ad-slot-sidebar-min, 250px);
}

/* ── AdSense-style embeds need a sized container ────────────────────────────
   .ads-block-card is a centered flex column, so a bare block-level <ins>
   shrinks to content width — zero for an empty responsive unit, which makes
   the network refuse to render into it. Give the unit the card's full width
   so tags don't need a hand-added width wrapper. The network's own inline
   width/height (set when the unit fills) still wins over this rule. */
.ads-block-card ins.adsbygoogle {
  display: block;
  width: 100%;
}

/* The same shrink-to-fit applies to a tag's own wrapper <div> once its
   hand-added inline width is removed: as a flex item it collapses to its
   empty content's width, and the unit inside — width:100% of 0 — gets
   nothing to render into. Give direct div children the card's full width;
   anything nested deeper fills naturally in normal block flow. Scoped to
   divs so images/links keep their intrinsic size. */
.ads-block-card > div {
  width: 100%;
}

/* ── Third-party no-fill collapse (added by cms-ads.js) ─────────────────────
   When an ad network embed stays empty past the grace period the wrapper is
   collapsed entirely rather than holding a reserved gap open. The inner
   .ads-block-card keeps its natural layout inside the overflow-hidden wrapper
   so a late fill can still be measured and the slot restored.
   !important so the collapse beats both the reservations above and the inline
   min-height set by the rotation ratchet. */
.ad-slot-wrap.ad-slot-collapsed {
  min-height: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden;
}

/* Strip the visible chrome (card padding/border/background, block-shell
   margins) from the slot's host container while the slot is collapsed, so no
   empty box or band is left behind. Applied by cms-ads.js to the enclosing
   .sidebar-ad-card / .homepage-ads-block / .single-ads-block and its
   .block-shell parent. */
.ad-slot-host-collapsed {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
