/* ============================================================
   list-page.css — 列表页（list.html）内容区专属样式
   依赖：global-new.css（header/footer 公共样式）
   ============================================================ */

/* ========== 面包屑导航 ========== */
.nav.bd-b {
  max-width: 1200px; margin: 0 auto; padding: 12px 15px;
  border-bottom: 1px solid #e2e8f0; background: #fff;
  border-radius: 0 0 8px 8px;
}
.crumb { font-size: 13px; color: #718096; line-height: 1.6; }
.crumb a {
  color: #4a5568; transition: color .2s;
}
.crumb a:hover { color: #3182ce; }
.crumb a::after { content: ''; } /* 已由 > 提供分隔 */

/* ========== 列表主体两栏 ========== */
.m2 {
  max-width: 1200px; margin: 18px auto; padding: 0 15px;
  display: grid; grid-template-columns: 1fr 300px; gap: 20px;
}
.m2l { min-width: 0; }
.m2r { min-width: 0; }

/* ========== 列表内容区 ========== */
.m2l .list-img,
.m2l .list-thumb,
.m2l .list-txt {
  background: #fff; border-radius: 12px; padding: 16px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}

/* 列表图文（thumb-table 模板输出） */
.list-thumb ul,
.list-img ul {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
}
.list-thumb li,
.list-img li {
  transition: transform .3s;
}
.list-thumb li:hover,
.list-img li:hover { transform: translateY(-3px); }
.list-thumb a,
.list-img a { display: block; text-decoration: none; }
.list-thumb img,
.list-img img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: 8px; transition: opacity .3s;
}
.list-thumb li:hover img,
.list-img li:hover img { opacity: .88; }
.list-thumb h4,
.list-img h3 {
  font-size: 13px; font-weight: 500; color: #2d3748;
  margin-top: 6px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; text-align: center;
}
.list-thumb a:hover h4,
.list-img a:hover h3 { color: #3182ce; }

/* 列表文字（纯文字条目） */
.list-txt ul { display: flex; flex-direction: column; gap: 0; }
.list-txt li {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 0; border-bottom: 1px dashed #edf2f7;
}
.list-txt li:last-child { border-bottom: none; }
.list-txt .news_time,
.list-txt .date {
  display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: #ebf8ff; color: #3182ce; font-size: 11px; font-weight: 600;
  flex-shrink: 0; font-family: 'Courier New', monospace; white-space: nowrap;
}
.list-txt li a {
  font-size: 13px; color: #2d3748; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; flex: 1;
}
.list-txt li a:hover { color: #3182ce; }

/* ========== 右侧提示词云 ========== */
.tishice { display: flex; flex-direction: column; gap: 14px; }
.tishi2, .tishi3 {
  background: #fff; border-radius: 10px; padding: 12px 14px;
  box-shadow: 0 2px 8px rgba(0,0,0,.04); font-size: 12.5px; color: #4a5568;
  line-height: 1.9;
}
.tishi2 a, .tishi3 a {
  display: inline-block; padding: 2px 8px; margin: 2px 3px;
  background: #f7fafc; border: 1px solid #e2e8f0; border-radius: 12px;
  font-size: 12px; color: #4a5568; transition: all .2s;
}
.tishi2 a:hover, .tishi3 a:hover {
  background: #3182ce; color: #fff; border-color: #3182ce;
}

/* ========== 列表页底部提示 ========== */
.m2 + .tishi {
  max-width: 1200px; margin: 15px auto; padding: 12px 16px;
  background: #fffbeb; border-left: 4px solid #ed8936; border-radius: 6px;
  font-size: 12.5px; color: #744210; line-height: 1.8;
}
.m2 + .tishi span:first-child { font-weight: 700; color: #c05621; }
.m2 + .tishi a { color: #3182ce; }
.m2 + .tishi a:hover { color: #2b6cb0; }

/* ========== 分页（如模板输出 .pages） ========== */
.pages {
  margin: 18px 0; text-align: center; font-size: 13px;
}
.pages a, .pages span {
  display: inline-block; padding: 5px 12px; margin: 0 2px;
  border: 1px solid #e2e8f0; border-radius: 5px; color: #4a5568;
  transition: all .2s;
}
.pages a:hover { background: #3182ce; color: #fff; border-color: #3182ce; }
.pages .on, .pages .current {
  background: #3182ce; color: #fff; border-color: #3182ce; font-weight: 600;
}

/* ========== 响应式 ========== */
@media (max-width: 960px) {
  .m2 { grid-template-columns: 1fr; }
  .list-thumb ul, .list-img ul { grid-template-columns: repeat(3, 1fr); }
  .tishice { flex-direction: row; }
  .tishice .tishi2, .tishice .tishi3 { flex: 1; }
}
@media (max-width: 640px) {
  .list-thumb ul, .list-img ul { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .crumb { font-size: 12px; }
  .tishice { flex-direction: column; }
}