/* ============================================================
 * B2 圈子信息流广告 —— 静态样式
 *
 * 广告条目本身是由主题的 Vue 模板渲染的（数据层注入），
 * 所以这里只做「三件主题没做的事」：
 *   1. 让整张卡片可点跳转；
 *   2. 收掉不该出现的块（热门评论 / 讨论区）；
 *   3. 点击态的细节。
 *
 * 随设置变化的部分（隐藏时间、隐藏互动按钮、广告角标）
 * 由 PHP 输出的内联样式负责，见 B2CA_Settings::runtime_css()。
 *
 * 所有选择器都挂在 `circle-topic-item-b2ad…` 上：
 * 广告的 topic_id 形如 `b2ad12p1i0`，真实话题是纯数字，永不误伤。
 * ============================================================ */

/* ---------- 1. 整张卡片可点 ----------
 *
 * 主题的 fliterContent() 会在正文里塞一个
 *   <a class="link-block" href="话题链接"></a>
 * 但它只写了 position:absolute; z-index:1，没有尺寸，
 * 实际是个 0×0 的隐形元素，点不到。
 *
 * 这里把定位上下文一路提到「整张卡片」(.circle-topic-item)，
 * 再把这个隐形链接撑满，于是头像、昵称、正文、配图、底部按钮
 * 全部落在同一个链接的点击范围里 —— 用户点哪儿都跳转，
 * 这正是朋友圈广告那种「整条可点」的手感。
 *
 * 注意 .topic-content-text 主题设了 position:relative，
 * 必须显式改回 static，否则隐形链接仍然只覆盖正文那一段。
 */
section[class*="circle-topic-item-b2ad"] {
	position: relative;
}

section[class*="circle-topic-item-b2ad"] .topic-content,
section[class*="circle-topic-item-b2ad"] .topic-content-text {
	position: static;
}

section[class*="circle-topic-item-b2ad"] .topic-content-text a.link-block {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	cursor: pointer;
	display: block;
}

/* 正文里如果真的有链接，仍然要能点（抬到覆盖层之上） */
section[class*="circle-topic-item-b2ad"] .topic-content-text p a {
	position: relative;
	z-index: 4;
}

/* ---------- 2. 收掉不该出现的块 ---------- */

/* 热门评论：广告没有评论数据，模板虽然不会渲染，仍然兜一层 */
section[class*="circle-topic-item-b2ad"] .topic-hot-comment {
	display: none !important;
}

/* 讨论区：广告条目的评论框永远不该展开 */
section[class*="circle-topic-item-b2ad"] .topic-comments,
section[class*="circle-topic-item-b2ad"] .topic-comment-box,
section[class*="circle-topic-item-b2ad"] .topic-commentlist {
	display: none !important;
}

/* ---------- 3. 点击态 ---------- */

section[class*="circle-topic-item-b2ad"],
section[class*="circle-topic-item-b2ad"] .topic-content,
section[class*="circle-topic-item-b2ad"] .topic-content-text {
	cursor: pointer;
}

/* 头像与昵称的 <a> 是主题自带的，广告把 author.link 指到了落地页，
   这里补一个「可以点」的观感：hover 时轻微提亮。 */
section[class*="circle-topic-item-b2ad"] .topic-name a:hover b,
section[class*="circle-topic-item-b2ad"] .topic-avatar a:hover {
	opacity: .82;
}

/* 广告条目的头像沿用帖子头像的圆角与尺寸，确保视觉重量一致 */
section[class*="circle-topic-item-b2ad"] .topic-avatar img {
	object-fit: cover;
}