/* ===== 正文中部广告壳 =============================================
   article_bottom 由文末移到正文中部后的落点样式。所有主题共用，
   由 theme-foundation/partials/article-body.blade.php 自行引入。

   :has(.ad) —— 只有广告真的渲染出内容时才占位、加分隔线与标注；
   没有广告时整块塌陷为 0，正文两段自然接上，不会留空白带。
   ================================================================= */
.detail-inline-ad:has(.ad) {
    display: block;
    /* 上下各 24px：与正文和任何可点击元素隔开，避免误点被判为无效流量 */
    margin: 24px 0;
    padding: 0;
    border-top: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    border-color: color-mix(in srgb, currentColor 18%, transparent);
    text-align: center;
    contain: layout;
}


/* 实际投放的四个广告位都是 Fluid / 300x250：按 250px 预留「创意区」高度，
   标注与内边距在壳上自然叠加，回填前后总高一致 —— CLS 为 0，也不会像
   按整壳猜 300px 那样在素材偏矮时留下大片空白。 */
.detail-inline-ad:has(.ad) .ad {
    min-height: 250px;
}

/* 窄屏下宽素材不被裁切 */
.detail-inline-ad .ad-content {
    min-width: 0;
    overflow-x: auto;
}

@media (max-width: 767px) {
    .detail-inline-ad:has(.ad) {
        margin: 32px 0;
        padding: 12px 0 20px;
    }
}