/* 新闻模块通用样式（仅包含两个页面完全一致的部分） */

/* 通用：新闻图片填充与过渡 */
.image-news {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

/* 通用：图片容器基础约束（具体高度在各页面单独定义） */
.news-item-img {
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* 通用：卡片内容区的弹性布局（间距、背景由各页面控制） */
.news-item-content {
  display: flex;
  flex-direction: column;
  min-width: 0; /* 允许文本在flex容器内正确收缩并出现省略/换行 */
}

/* 通用：标题一行省略的基线规则（字号、行距由各页面控制） */
.news-item-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden; /* 使 line-clamp 生效并隐藏溢出 */
  overflow-wrap: anywhere; /* 超长连续字符可断行，避免撑破容器 */
  word-break: break-word; /* 兼容性兜底 */
  line-height: 1.4;
  height: 1.4em; /* 固定单行高度，严格对齐 */
  transition: color 0.3s ease;
}

/* 通用：悬停时标题高亮（与下载模块统一品牌蓝） */
.news-item:hover .news-item-title {
  color: #007bff;
}

/* 通用：内容两行省略与段落基线（字号、颜色在两个页面一致） */
.news-item-explain {
  font-size: 14px;
  color: #666;
  line-height: 1.7;
  margin-bottom: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 两行省略 */
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: calc(1.7em * 2); /* 固定两行高度，保证严格对齐 */
  overflow-wrap: anywhere; /* 允许超长连续字符在任意位置断行 */
}

/* 通用：更多链接悬停效果（颜色与位移） */
.news-more:hover {
  color: #0056b3;
  transform: translateX(4px);
}

.news-more:hover .image-news-more {
  transform: translateX(2px);
}

/* 通用：标签悬停交互（基础高亮与轻微上移） */
.news-flag-item:hover {
  background: #e9ecef;
  color: #495057;
  transform: translateY(-1px);
}