/* ========== 页面主体 ========== */
/* 页面主体（灰底页面、正文白块浮于其上；默认文字色与页面级自定义属性集中声明处） */
.display-info__main {
  color: var(--website-heading);
  background: var(--website-page);
  /* 横幅上白字（横幅内面包屑文字色） */
  --display-info-on-image: #fff;
}

/* ========== 文章横幅 ========== */
/* 文章横幅（通栏图片，面包屑贴底定位包含块；背景资源、cover、定位与各断点高度与 list-column__banner 保持一致，改动需同步） */
.display-info__banner {
  position: relative;
  height: 550px;
  background-image: url('../images/banner/common.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

/* 横幅内容容器（absolute 锚定横幅底部占满宽，左右内边距五档统一 20px 承载留白；定高与 list-column__banner-content 对齐，面包屑垂直居中） */
.display-info__banner-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  height: 72px;
  padding-right: 20px;
  padding-left: 20px;
}

/* ========== 面包屑 ========== */
/* 面包屑导航容器（横幅上白字，贴横幅底部；min-width: 0 给长路径裁切提供收缩许可） */
.display-info__breadcrumb-nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
  color: var(--display-info-on-image);
  font-size: 16px;
  line-height: 1.5;
}

/* 面包屑当前位置容器（单行展示，超出部分直接裁切，与 list-column 面包屑行为一致） */
.display-info__breadcrumb-current {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
}

/* 面包屑分隔符（由脚本整体替换 .possplit 后注入；左右 8px 让箭头与文字留出呼吸感，视觉上与 5px 的 gap 叠加后不过度疏散） */
.display-info__breadcrumb-separator {
  margin: 0 8px;
}

/* ========== 文章正文 ========== */
/* 文章区块（透明外层，承载外部留白；上/下留白一致，按断点取 40/40/36/32/32，左/右五档统一 20px，与 list-column__layout 一致；桌面居中封顶见断点层） */
.display-info__article {
  padding: 40px 20px 40px;
}

/* 正文白块（白底浮于灰底，不承载内部留白，留白由外层承担） */
.display-info__article-body {
  min-width: 0;
  padding: 0;
  background: var(--website-surface);
}

/* 文章标题（主标题，左对齐，加粗，超长自然换行） */
.display-info__article-title {
  margin: 0;
  color: var(--website-heading);
  font-size: 32px;
  font-weight: var(--website-heading-weight);
  line-height: 1.2;
  text-align: left;
  overflow-wrap: anywhere;
}

/* 文章副标题（左对齐，超长自然换行） */
.display-info__article-subtitle {
  margin: 16px 0 0;
  color: var(--website-text-muted);
  font-size: 18px;
  line-height: 1.6;
  text-align: left;
  overflow-wrap: anywhere;
}

/* 文章元信息行（发布者 / 发布时间 / 浏览次数，左对齐由 flex 默认对齐保证，带上下弱边框的自包含分隔带） */
.display-info__article-metas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 20px 0 32px;
  padding: 12px 0;
  color: var(--website-text-muted);
  font-size: 14px;
  line-height: 1.5;
  border-top: 1px solid var(--website-border-light);
  border-bottom: 1px solid var(--website-border-light);
}

/* 浏览次数计数（WebPlus/CMS 侧对 .WP_VisitCount 设有 display:none，本页在元信息行内覆盖为可见） */
.display-info__article-metas .WP_VisitCount {
  display: inline;
}

/* 富文本容器（横向裁切富文本内声明的固定宽度内容，防止撑出横向滚动条） */
.display-info__article-entry {
  overflow-x: hidden;
}

/* 富文本内图片（按本身尺寸显示，仅超限缩放：上限 840px 且不超容器、保持比例） */
.display-info__article-entry img {
  max-width: min(840px, 100%);
  width: auto;
  height: auto;
}

/* 富文本内视频（WebPlus 视频仅输出 .wp_video_player 空壳，由 js/video-player.js
   补渲染原生 <video>；视频本体铺满占位容器、宽度自适应、保持比例） */
.display-info__article-entry .wp_video_player video {
  display: block;
  width: 100%;
  height: auto;
}

/* 富文本内 PDF（WebPlus PDF 仅输出 .wp_pdf_player 空壳，由 js/pdf-player.js
   补渲染 PDF.js 查看器 iframe；查看器铺满占位容器、宽度自适应、固定高度） */
.display-info__article-entry .wp_pdf_player iframe {
  display: block;
  width: 100%;
  height: 600px;
  border: 0;
}

/* 正文本体（承接富文本正文） */
.display-info__article-body-text {
  color: var(--website-heading);
  font-size: 16px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

/* ========== 断点布局 ========== */

/* ---- 桌面基准布局（992px 及以上） ---- */
@media (min-width: 992px) {
  /* 横幅内容容器（桌面基准居中容器：max-width 封顶 + auto 居中；左右留白见共享基础层 20px） */
  .display-info__banner-content {
    max-width: 1400px;
    margin-right: auto;
    margin-left: auto;
  }

  /* 文章区块（桌面基准：居中容器封顶，留白沿用基础层 40/20/40） */
  .display-info__article {
    margin-right: auto;
    margin-left: auto;
    max-width: 1400px;
  }

  /* 正文本体（桌面基准字号） */
  .display-info__article-body-text {
    font-size: 18px;
  }
}

/* ---- 标准桌面布局（1201px-1599px） ---- */
@media (min-width: 1201px) and (max-width: 1599px) {
  /* 文章横幅（标准桌面高度回收） */
  .display-info__banner {
    height: 500px;
  }

  /* 横幅内容容器（标准桌面 max-width 收紧与定高；左右留白见共享基础层 20px） */
  .display-info__banner-content {
    max-width: 1170px;
    margin-right: auto;
    margin-left: auto;
    height: 68px;
  }

  /* 文章区块（标准桌面：max-width 收紧，留白沿用基础层 40/20/40） */
  .display-info__article {
    max-width: 1170px;
    margin-right: auto;
    margin-left: auto;
  }

  /* 文章标题（标准桌面字号） */
  .display-info__article-title {
    font-size: 30px;
  }

  /* 文章元信息行（标准桌面：正文前间距收紧） */
  .display-info__article-metas {
    margin-bottom: 28px;
  }

  /* 正文本体（标准桌面字号） */
  .display-info__article-body-text {
    font-size: 16px;
  }
}

/* ---- 紧凑桌面布局（992px-1200px） ---- */
@media (min-width: 992px) and (max-width: 1200px) {
  /* 文章横幅（紧凑桌面高度回收） */
  .display-info__banner {
    height: 460px;
  }

  /* 横幅内容容器（紧凑桌面 max-width 收紧与定高；左右留白见共享基础层 20px） */
  .display-info__banner-content {
    max-width: 970px;
    margin-right: auto;
    margin-left: auto;
    height: 64px;
  }

  /* 文章区块（紧凑桌面：max-width 收紧，上下留白一致 36px） */
  .display-info__article {
    max-width: 970px;
    margin-right: auto;
    margin-left: auto;
    padding: 36px 20px 36px;
  }

  /* 文章标题（紧凑桌面字号） */
  .display-info__article-title {
    font-size: 28px;
  }

  /* 文章副标题（紧凑桌面：上边距收紧） */
  .display-info__article-subtitle {
    margin: 14px 0 0;
  }

  /* 文章元信息行（紧凑桌面：上边距与正文前间距收紧） */
  .display-info__article-metas {
    margin: 16px 0 24px;
  }

  /* 正文本体（紧凑桌面字号） */
  .display-info__article-body-text {
    font-size: 16px;
  }
}

/* ---- 平板布局（768px-991px） ---- */
@media (min-width: 768px) and (max-width: 991px) {
  /* 文章横幅（平板端高度回收） */
  .display-info__banner {
    height: 400px;
  }

  /* 横幅内容容器（平板端定高；左右留白见共享基础层 20px） */
  .display-info__banner-content {
    height: 60px;
  }

  /* 文章区块（平板端：上下留白一致 32px） */
  .display-info__article {
    padding: 32px 20px 32px;
  }

  /* 文章标题（平板端字号） */
  .display-info__article-title {
    font-size: 26px;
  }

  /* 文章副标题（平板端上边距收紧与字号） */
  .display-info__article-subtitle {
    margin: 12px 0 0;
    font-size: 16px;
  }

  /* 文章元信息行（平板端：上边距与正文前间距收紧、内边距收紧） */
  .display-info__article-metas {
    margin: 16px 0 20px;
    padding: 10px 0;
  }
}

/* ---- 手机布局（767px 及以下） ---- */
@media (max-width: 767px) {
  /* 文章横幅（手机端高度回收） */
  .display-info__banner {
    height: 360px;
  }

  /* 横幅内容容器（手机端定高；左右留白见共享基础层 20px） */
  .display-info__banner-content {
    height: 56px;
  }

  /* 文章区块（手机端：上下留白一致 32px） */
  .display-info__article {
    padding: 32px 20px 32px;
  }

  /* 文章标题（手机端字号） */
  .display-info__article-title {
    font-size: 24px;
  }

  /* 文章副标题（手机端上边距收紧与字号） */
  .display-info__article-subtitle {
    margin: 12px 0 0;
    font-size: 16px;
  }

  /* 文章元信息行（手机端：上边距收紧、正文前间距收紧、内边距收紧、元信息项间距收紧） */
  .display-info__article-metas {
    gap: 6px 12px;
    margin: 16px 0 16px;
    padding: 10px 0;
  }
}