/*!
 * 详情页（#/item/{id}）专属样式补丁
 *
 * 只覆盖主题 style.css 里对详情页不合适的地方，主题文件一律不动。
 * 需要 index.html 在 app.css 之后引入本文件（由他人负责加 <link>）。
 */

/* ---------------- P1-2 信息区不再强制留高 ----------------
 * style.css 里 `.view .video-info-main{min-height:200px}`（约 :3637）与
 * `.video-info-items:last-child{min-height:50px}`（约 :3393）是为「简介很长」预留的固定高度。
 * 简介短（或内容是「内详」「暂无简介」）时，这两处固定高度就变成简介下方的一大片死空白。
 * 改成按内容自适应，让盒子自然收口。
 * 用 #view-item 提升特异性，压过主题的 .view .video-info-main。
 */
#view-item .video-info-main { min-height: auto; }
#view-item .video-info-items:last-child { min-height: auto; }

/* ---------------- P1-3 播放列表「已看」角标 ----------------
 * app.item.js 现在会给已看完的分集渲染 <em>已看</em>，这条规则给出它的样式。
 * 角标绝对定位在按钮右上角；父级 `.module-blocklist a` 在主题里已是 position:relative。
 * 说明：原 app.css:98-104 有一条同样的规则，本文件接管后那条可删（避免两处重复维护）。
 * 相比原规则补了 `font-style: normal`：em 默认是斜体，中文斜体是浏览器合成的伪斜体，很难看。
 */
#d-playlist .module-blocklist a em {
  position: absolute;
  top: -1px;
  right: 2px;
  z-index: 3;
  transform: scale(.78);
  transform-origin: top right;
  background: linear-gradient(90deg, #FFEB3B, #f9e326);
  color: rgb(0 0 0 / 92%);
  border-radius: 5px;
  padding: 0 3px;
  line-height: 16px;
  font-size: 12px;
  font-style: normal;
}

/* ---------------- 演员行：桌面端必须自己滚动 ----------------
 * 主题只在 ≤899px 的媒体查询里给了 .scroll-box 一个 overflow-y:auto（从而让
 * overflow-x 按规范计算成 auto），桌面端一条都没有。演员行是 12 × 150px = 1800px
 * 的 inline-flex 单行，桌面 .content 只有 1240px，于是整行把文档撑宽 468px，
 * 全站出现横向滚动条。这里补上横向滚动（与移动端行为一致，不引入 !important）。
 * 刻意保留可点按的原生滚动条，作为「这里还能往右看」的可见提示。
 */
#d-actor .scroll-box { overflow-x: auto; overflow-y: hidden; }

/* ---------------- P2 模块纵向节奏 ----------------
 * 详情页的四个模块（#d-actor / #d-playlist / #d-like / #d-hot）原先只靠模板的
 * `.module{padding-bottom:20px}` 撑间距，偏紧且不统一。
 * 这里统一给 30px 的纵向间距：把模块自带的 padding-bottom 归零，改由 margin-top 控制，
 * 避免「padding + margin」叠加成 50px。
 * 头部 #d-head 本身是 .box，已自带较大的 margin-bottom（桌面 50px / 移动 40px），
 * 所以「头部 → 演员」这一段沿用头部自己的间距，不再额外叠加，其余相邻模块之间恒为 30px。
 * 空模块（加载失败 / 无内容）不占位，免得留下孤立空白。
 */
#view-item .content > #d-playlist,
#view-item .content > #d-like,
#view-item .content > #d-hot { margin-top: 30px; }

#view-item .content > #d-actor,
#view-item .content > #d-playlist > .module,
#view-item .content > #d-like > .module,
#view-item .content > #d-hot > .module { padding-bottom: 0; }

#view-item .content > #d-actor:empty,
#view-item .content > #d-playlist:empty,
#view-item .content > #d-like:empty,
#view-item .content > #d-hot:empty { display: none; margin-top: 0; }