/* =============================================================================
 *  05-ads.css — 广告位样式
 *  原则：绝不遮挡正文、绝不弹窗、可关闭、有明确「广告」标识（AdSense 政策要求）
 * ========================================================================== */

.ad-slot {
  margin: 26px 0;
  min-height: 0;
  /* 预留最小高度，避免广告加载造成布局跳动（CLS） */
}
.ad-slot[data-ad="topBanner"] { margin: 18px 0 26px; }
.ad-slot[data-ad="sidebar"] { margin: 0; }
.ad-slot[data-ad="endOfArticle"] { margin: 34px 0 10px; }

/* 没渲染出内容的广告位不留空白（广告被限流 / 窄屏隐藏 / 未启用时） */
.ad-slot:empty,
.ad-slot.is-hidden-ad { display: none !important; }

.ad-label {
  display: block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 6px; text-align: center;
}
.ad-slot[data-ad="sidebar"] .ad-label { text-align: start; }

/* 正文内广告：柔和区隔，不打断阅读节奏 */
.ad-slot.ad-inarticle {
  padding: 14px 0;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
}

/* ------------------------------------------------ 占位块（未填 AdSense 参数时） */
.ad-placeholder {
  display: grid; place-items: center; text-align: center;
  min-height: 100px; padding: 18px;
  border: 2px dashed var(--line); border-radius: var(--radius-s);
  background: repeating-linear-gradient(135deg, var(--paper-3) 0 10px, var(--paper-2) 10px 20px);
  color: var(--muted); font-size: 13px; line-height: 1.5;
}
.ad-placeholder b { display: block; font-size: 14px; color: var(--ink-2); margin-bottom: 2px; }
.ad-slot[data-ad="sidebar"] .ad-placeholder { min-height: 250px; }
.ad-slot[data-ad="mobileAnchor"] .ad-placeholder { min-height: 60px; }

/* ------------------------------------------------ 移动端底部吸附广告（可关闭） */
.ad-anchor {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 58;
  background: var(--paper-2); border-top: 1px solid var(--line);
  box-shadow: 0 -4px 18px rgba(0,0,0,.10);
  padding: 6px 10px calc(6px + env(safe-area-inset-bottom, 0px));
  transform: translateY(110%); transition: transform .25s ease;
}
.ad-anchor.show { transform: translateY(0); }
.ad-anchor .anchor-inner { position: relative; max-width: 480px; margin-inline: auto; }
.ad-anchor .anchor-close {
  position: absolute; top: -2px; inset-inline-end: -4px;
  width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line);
  background: var(--paper-2); color: var(--ink-2); cursor: pointer; font-size: 13px;
  display: grid; place-items: center; z-index: 2;
}
/* 有吸附广告时，正文底部留出空间，避免遮住最后一行 */
body.has-anchor { padding-bottom: 96px; }

/* ------------------------------------------------ PC 侧栏广告（随页面滚动固定） */
.ad-side-sticky { position: sticky; top: 84px; }

/* ------------------------------------------------ 广告在首页卡片流中的样式 */
.ad-slot[data-ad="homeCard"] {
  margin: 0;
  min-height: 150px;
  display: flex; flex-direction: column; justify-content: center;
  padding: 18px; box-sizing: border-box;
  background: var(--paper-2); border: 1px dashed var(--line);
  border-radius: var(--radius);
}
.ad-slot[data-ad="homeCard"] .ad-label { text-align: center; }
.ad-slot[data-ad="homeCard"] .ad-placeholder {
  border: 0; background: transparent; min-height: 0; padding: 0;
}

/* ------------------------------------------------ 深色模式下的广告容器 */
html[data-mode="dark"] .ad-placeholder { border-color: var(--line); }

/* ------------------------------------------------ Cookie 同意横幅（CMP） */
.consent-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;
  justify-content: center; text-align: center;
  padding: 11px 16px calc(11px + env(safe-area-inset-bottom, 0px));
  background: var(--paper-1); border-top: 1px solid var(--line);
  box-shadow: 0 -4px 18px rgba(0, 0, 0, .12);
  font-size: 13px; line-height: 1.5; color: var(--ink-2);
}
.consent-bar .consent-txt { max-width: 760px; }
.consent-bar .consent-txt a { color: var(--accent, #C8102E); }
.consent-bar .consent-actions { display: flex; gap: 8px; }
.consent-bar button {
  border: 1px solid var(--line); border-radius: var(--radius-s);
  padding: 6px 16px; cursor: pointer; font-size: 13px;
  background: var(--paper-2); color: var(--ink);
}
.consent-bar .consent-accept {
  background: var(--accent, #C8102E); color: #fff; border-color: transparent;
}
@media (max-width: 520px) {
  .consent-bar { flex-direction: column; }
}