/* ============ 新闻列表页 ============ */

/* 顶部搜索栏（靠左、紧凑白底圆角） */
.news-search {
    position: relative;
    width: 300px;
    height: 32px;
    background: #FFFFFF;
    border-radius: 6px;
    margin: 0 auto 1.25rem 0;
}
.news-search input {
    width: 100%;
    height: 100%;
    padding: 0 2.5rem 0 0.75rem;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #fff;
    font-size: 0.8rem;
    color: #333;
    transition: background 0.15s var(--ease), border-color 0.15s var(--ease);
}
.news-search input::placeholder { color: #969ba4; }
.news-search input:focus {
    outline: none;
    background: #fff;
    border-color: #d9d9d9;
}
.news-search button {
    position: absolute;
    right: 0.125rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.75rem; height: 1.75rem;
    border: none;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s var(--ease);
}
.news-search button:hover { background: #f0f0f0; }
.news-search button img { width: 0.9rem; height: 0.9rem; object-fit: contain; }

/* 双栏布局：复用 detail-body 的 grid 思路 */
.news-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30rem;
    gap: 2rem;
    align-items: start;
}

.news-main { grid-column: 1; min-width: 0; }
.news-side { grid-column: 2; min-width: 0; position: sticky; top: 160px; display: flex; flex-direction: column; gap: 1rem; }
/* 详情页无吸顶标题栏，右侧停靠位置上移，与左侧新闻顶部对齐 */
.news-body .news-main + .news-side { top: 64px; }

/* ============ 统一面板容器（照搬参考稿：白卡 + 浅灰描边 + 轻阴影） ============ */
/* 将 面包屑 + 新闻列表 + 分页 合并成一个整体卡片，行间无间距，仅以分隔线区分 */
.news-panel {
    background: #fff;
    border: 1px solid #f4f4f4;
    border-radius: 0.5rem;
    box-shadow: 0 1px 4px rgba(48, 42, 65, 0.18);
    overflow: hidden;
}
/* 面包屑：顶部带内边距，中性灰背景，下方分隔线 */
.news-panel__crumbs {
    margin: 0;
    padding: 0.875rem 1.25rem;
    border: none;
/*    background: #fafafa;*/
    border-radius: 0;
    border-bottom: 1px solid #f0f0f0;
    color: #333 !important;
}
.news-panel__crumbs a,
.news-panel__crumbs span { color: #333 !important; }
.news-panel__crumbs a:hover { color: #0066ff; }
.news-panel__crumbs .crumbs__sep { color: #c0c0c0 !important; }
.news-panel__crumbs .crumbs__current { color: #969ba4 !important; }

/* 新闻列表 */
.news-panel .news-list { display: flex; flex-direction: column; gap: 0; }

/* 新闻卡片（左图右文，照搬参考稿） */
.news-card {
    display: flex;
    gap: 0.875rem;
    padding: 1.25rem 1.25rem;
    transition: background 0.15s var(--ease);
}
.news-card:hover { background: #fafafa; }
.news-card__thumb {
    width: 11.875rem;
    height: 7.375rem;
    border-radius: 0.375rem;
    background: #f0f0f0;
    flex-shrink: 0;
    overflow: hidden;
}
.news-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.news-card__body {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-top: 0.25rem;
}
.news-card__title {
    font-size: 1.125rem;
    font-weight: 400;
    color: #333;
    line-height: 1.45;
    margin: 0 0 0.625rem;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.news-card__title a { color: inherit; }
.news-card__title a:hover { color: #0066ff; }
.news-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-bottom: 0.625rem;
}
/* 分类标签胶囊：蓝 / 橙 交替（照搬参考稿配色） */
.news-card__tag {
    display: inline-flex;
    align-items: center;
    height: 1.875rem;
    padding: 0 0.625rem;
    font-size: 0.75rem;
    font-weight: 400;
    border-radius: 0.375rem;
    line-height: 1;
}
.news-card__tag--blue {
    color: #0066ff;
    background: #e5efff;
}
.news-card__tag--blue:hover {
    background: #d4e6ff;
}
.news-card__tag--orange {
    color: #ff6600;
    background: #fff2e5;
}
.news-card__tag--orange:hover {
    background: #ffe6cc;
}
.news-card__time {
    font-size: 0.78rem;
    color: #969ba4;
}
.news-card__desc {
    font-size: 0.875rem;
    color: #797c80;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 卡片间分隔线（照搬参考稿：1px #f2f2f2） */
.news-card__sep {
    height: 1px;
    background: #f2f2f2;
    margin: 0 1.25rem;
}

/* 分页：底部中性灰条 + 参考稿按钮样式 */
.news-panel__fanye {
    margin-top: 0;
    padding: 1.25rem 1.25rem;
    background: #fafafa;
    border-top: 1px solid #f0f0f0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
/* 所有分页按钮 / 数字 / 省略号基础样式（白底圆角，照搬参考稿） */
.news-panel__fanye a,
.news-panel__fanye .bbb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.375rem;
    padding: 0 0.75rem;
    background: #fff;
    border: 1px solid #f4f4f4;
    border-radius: 0.375rem;
    color: #333;
    font-size: 0.875rem;
    line-height: 1;
    box-sizing: border-box;
    transition: background 0.15s var(--ease), border-color 0.15s var(--ease), color 0.15s var(--ease);
}
/* 省略号去掉按钮感（照搬参考稿：裸文字无边框） */
.news-panel__fanye .bbb {
    border: none;
    background: none;
    padding: 0;
    min-width: auto;
    cursor: default;
}
/* 数字页码（正方形比例，照搬参考稿 40×38） */
.news-panel__fanye .num_page {
    min-width: 2.5rem;
    padding: 0;
}
/* 上一页 / 下一页 / 数字 hover —— 提升优先级覆盖 pager.css 全局 .num_page:hover */
.news-panel__fanye .go:hover,
.news-panel__fanye a.num_page:hover {
    border-color: #5961f9;
    background: #fff;
    color: #5961f9;
}
/* 当前选中页：紫色底白字 —— 提升优先级覆盖 pager.css 全局 .page_style */
.news-panel__fanye a.page_style,
.news-panel__fanye a.page_style:hover {
    background: #5961f9 !important;
    border-color: #5961f9 !important;
    color: #fff !important;
}

/* 跳转到第几页区域（照搬参考稿 section_15） */
.news-panel__jump {
    display: inline-flex;
    align-items: center;
    height: 2.375rem;
    padding: 0 0.75rem;
    margin-left: 0.75rem;
    background: #fff;
    border: 1px solid #f4f4f4;
    border-radius: 0.375rem;
    box-sizing: border-box;
}
.news-panel__jump-label {
    font-size: 0.875rem;
    color: #969ba4;
    white-space: nowrap;
}
.news-panel__jump-input {
    width: 2.25rem;
    height: 1.875rem;
    margin: 0 0.5rem;
    padding: 0;
    text-align: center;
    font-size: 0.875rem;
    color: #333;
    background: #f4f4f4;
    border: none;
    border-radius: 0.375rem;
    box-sizing: border-box;
    outline: none;
    transition: background 0.15s var(--ease);
}
.news-panel__jump-input:focus { background: #ececec; }
.news-panel__jump-btn {
    margin-left: 0.5rem;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.875rem;
    color: #333;
    line-height: 1;
    transition: color 0.15s var(--ease);
}
.news-panel__jump-btn:hover { color: #5961f9; }

/* 空态 */
.news-empty {
    text-align: center;
    color: #969ba4;
    padding: 4rem 1rem;
    font-size: 0.9rem;
}

/* 分页样式见 pager.css 的 .fanye */

/* 右侧栏：与详情页 .detail-side 完全统一——直接复用 detail.css 的基础
   .side-block / .side-block__line / .side-list / .side-item 样式
   （白卡 + 标题下通栏细线 + 两列网格分隔线，分隔线天然落在各项数据中间）。
   本页不再 scoped 覆盖；仅 .news-rec-list（热门推荐·新闻，左图右文）为本页特有。 */

/* ============ 右侧热门推荐(新闻)：左图右文（照搬参考稿 96×60 缩略图） ============ */
.news-rec-list {
    list-style: none;
    margin: 0;
    margin-top: 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
.news-rec-item a {
    display: flex;
    gap: 0.625rem;
    overflow: hidden;
}
.news-rec-item a:hover .news-rec-item__title { color: #5961f9; }
/* 缩略图：96×60 浅灰底圆角（照搬参考稿 group_30: #f0f0f0 6px） */
.news-rec-item__thumb {
    width: 6rem;
    height: 3.75rem;
    border-radius: 0.375rem;
    background: #f0f0f0;
    flex-shrink: 0;
    overflow: hidden;
}
.news-rec-item__thumb img { width: 100%; height: 100%; object-fit: cover; }
.news-rec-item__body {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
}
/* 标题：14px #333 两行截断（照搬参考稿 text-group_15） */
.news-rec-item__title {
    font-size: 0.875rem;
    font-weight: 400;
    color: #333;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.15s var(--ease);
}
.news-rec-item__time {
    font-size: 0.75rem;
    color: #969ba4;
    margin-top: 0.4rem;
}

/* ============ 响应式 ============ */
@media (max-width: 1023px) {
    /* 平板：右侧栏移到下方 */
    .news-body { grid-template-columns: minmax(0, 1fr); }
    .news-main, .news-side { grid-column: 1; }
    .news-side { position: static; }
}
@media (max-width: 767px) {
    .news-card { flex-direction: column; gap: 0.75rem; }
    .news-card__thumb { width: 100%; height: 10rem; }
    .news-card__sep { margin: 0; }
}

/* ============ 新闻详情页 ============ */
/* 面包屑 + 正文合并为整体卡片 */
.news-article-panel {
    background: var(--c-bg);
    border: 1px solid #f4f4f4;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(48, 42, 65, 0.18);
    overflow: hidden;
    margin-bottom: 1.25rem;
}
/* 面包屑：面板顶部条，仅靠底部分隔线与正文区分（提升优先级，重置继承自 .crumbs 的边框/圆角/背景/下边距） */
.news-article-panel .crumbs {
    margin: 0;
    padding: 0.875rem 1.875rem;
    background: transparent;
    border: none;
    border-bottom: 1px solid #f2f2f2;
    border-radius: 0;
    font-size: 0.875rem;
    color: #b6b6b6;
}
.news-article-panel .crumbs a { color: #0066ff; }
.news-article-panel .crumbs .crumbs__sep { color: #b6b6b6; }
/* 当前标题项不截断，完整换行显示 */
.news-article-panel .crumbs .crumbs__current {
    max-width: none;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    color: #b6b6b6;
}
/* 主体：去掉独立边框/圆角/阴影/外边距，由面板承载 */
.news-article {
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 1.75rem 1.875rem;
    margin-bottom: 0;
}
.news-article__title {
    font-size: 1.625rem;
    font-weight: 700;
    color: #333333;
    line-height: 1.4;
    margin-bottom: 1.25rem;
}
/* 元信息：分类 + 时间 + 来源 + 浏览量 */
.news-article__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    padding-bottom: 1.25rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #f2f2f2;
}
.news-article__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.875rem;
    color: #969ba4;
}
.news-article__meta-ico {
    width: 0.95rem; height: 0.95rem;
    fill: currentColor;
    opacity: 0.7;
}

/* 正文 */
.news-article__content { color: #333333; }
.news-article__content :where(p) {
    line-height: 1.625;
    margin-bottom: 1rem;
    font-size: 1rem;
    text-indent: 2em;
}
.news-article__content :where(h2) {
    font-size: 1.2rem; font-weight: 700;
    margin: 1.5rem 0 0.75rem;
}
.news-article__content :where(h3) {
    font-size: 1.05rem; font-weight: 600;
    margin: 1.25rem 0 0.5rem;
}
.news-article__content :where(ul, ol) {
    line-height: 1.625;
    margin: 0 0 1rem 1.5rem;
}
.news-article__content :where(img) {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 6px;
    margin: 0.5rem auto 1rem;
    display: block;
}
.news-article__content :where(p) > :where(img:only-child) {
    width: 80%;
}
.news-article__content :where(table) {
    max-width: 100%;
    border-collapse: collapse;
    display: block;
    overflow-x: auto;
    margin: 0.5rem 0 1rem;
    font-size: 0.95rem;
    text-align: left;
}
.news-article__content :where(th),
.news-article__content :where(td) {
    border: 1px solid #e5e7eb;
    padding: 0.5rem 0.75rem;
    line-height: 1.5;
    text-indent: 0;
}
.news-article__content :where(th) {
    background: #f5f7fa;
    font-weight: 600;
}
.news-article__content :where(tr:nth-child(even) > td) {
    background: #fafbfc;
}
.news-article__content :where(a) {
    color: #0066ff;
    text-decoration: underline;
}
.news-article__content :where(blockquote) {
    border-left: 3px solid var(--c-primary-soft-2);
    padding-left: 1rem;
    color: var(--c-text-sub);
    margin-bottom: 1rem;
}

/* 标签区 */
.news-article__tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    border-top: 1px solid var(--c-border);
}
.news-article__tags-label {
    font-size: 0.85rem;
    color: var(--c-text-sub);
    margin-right: 0.25rem;
}
/* 分类标签：浅蓝胶囊（照参考稿 text-wrapper_8） */
.news-article__meta .news-tag {
    display: inline-block;
    background: #e5efff;
    color: #0066ff;
    border-radius: 6px;
    padding: 0.35rem 0.75rem;
    font-size: 0.75rem;
    line-height: 1;
    transition: background 0.15s var(--ease);
}
.news-article__meta .news-tag:hover { background: #d4e6ff; }
.news-tag--ghost {
    background: var(--c-bg-page);
    color: var(--c-text-sub);
    border: 1px solid var(--c-border);
}
.news-tag--ghost:hover {
    background: var(--c-primary-soft);
    color: var(--c-primary);
    border-color: var(--c-primary-soft-2);
}

/* ============ 上一个 / 下一个（同一卡片内左右分布，照参考稿 box_31） ============ */
.news-turn {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--c-bg);
    border: 1px solid #f4f4f4;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(48, 42, 65, 0.18);
    overflow: hidden;
}
.news-turn__item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.125rem 1.875rem;
    overflow: hidden;
}
/* 中间分隔线 */
.news-turn__item--prev { border-right: 1px solid #f2f2f2; }
/* 禁用态(无上/下篇)：不可点击，置灰 */
.news-turn__item--disabled {
    cursor: default;
    opacity: 0.5;
}
.news-turn__item--disabled .news-turn__title { color: #969ba4; }
/* 下一篇靠右 */
.news-turn__item--next { justify-content: flex-end; text-align: right; }
.news-turn__arrow {
    width: 1.5rem; height: 1.5rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: transparent;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.2s var(--ease);
}
.news-turn__item--prev:hover .news-turn__arrow,
.news-turn__item--next:hover .news-turn__arrow { background: #f2f2f2; }
.news-turn__item--prev:hover .news-turn__title,
.news-turn__item--next:hover .news-turn__title { color: #0066ff; }
.news-turn__arrow svg {
    width: 1rem; height: 1rem;
    fill: none;
    stroke: #333333;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: stroke 0.2s var(--ease);
}
.news-turn__item:hover .news-turn__arrow svg { stroke: #0066ff; }
.news-turn__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.news-turn__label {
    font-size: 0.875rem;
    color: #333333;
    margin-bottom: 0.35rem;
}
.news-turn__title {
    font-size: 0.75rem;
    color: #333333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    transition: color 0.2s var(--ease);
}
.news-turn__item:hover .news-turn__title { color: #0066ff; }

/* ============ 猜你喜欢（照参考稿 box_32 flex-col justify-end） ============ */
.news-guess {
    background: #fff;
    border: 1px solid #f4f4f4;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(48, 42, 65, 0.18);
    margin: 1.25rem 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.news-guess__title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #333333;
    margin: 1.25rem 1.75rem 0;
    line-height: 1;
}
.news-guess__hr {
    background: #f2f2f2;
    height: 1px;
    margin: 1.25rem 1.75rem 0;
}
.news-guess__grid {
    display: flex;
    align-items: stretch;          /* 等高，竖分隔线贯穿整行 */
    flex-wrap: wrap;
    row-gap: 2rem;                 /* 多行时的行间距 */
    padding: 1rem 1.875rem 1.75rem;
}
.news-guess__item {
    flex: 1 1 25%;                 /* 一行平均四个 */
    min-width: 0;
    padding: 0 1.5rem;             /* 左右对称内边距＝相邻两项之间的间距 */
    display: flex;
    flex-direction: column;        /* 缩略图在上、标题在下 */
    align-items: center;           /* 缩略图、标题左右居中 */
    position: relative;
    transition: opacity 0.2s var(--ease);
}
/*
  竖分隔线：非行首项左边缘画 1px 线。
  由于本项左边缘 == 左邻项右边缘，而两者各有 1.5rem 内边距，
  该边缘恰在两项内容间隙的正中，故竖线居中于两图之间。
*/
.news-guess__item:not(:nth-child(4n+1))::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #f2f2f2;
}
.news-guess__item:hover { opacity: 0.7; }
.news-guess__thumb {
    width: 100%;
    max-width: 188px;              /* 最宽 188px，照参考稿 box_33 */
    aspect-ratio: 188 / 126;       /* 固定比例，各项一致 */
    background: #d5d5d5;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}
.news-guess__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.news-guess__name {
    width: 100%;
    max-width: 188px;
    text-align: center;            /* 标题左右居中 */
    font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    line-height: 26px;
    margin-top: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 767px) {
    .news-article { padding: 1.25rem; }
    .news-article-panel__crumbs { padding: 0.75rem 1rem; }
    .news-article__title { font-size: 1.3rem; }
    .news-turn { grid-template-columns: 1fr; }
    .news-turn__item--prev { border-right: none; border-bottom: 1px solid #f2f2f2; }
    .news-turn__item--next { justify-content: flex-start; text-align: left; }
    .news-guess__grid { row-gap: 1rem; }
    .news-guess__item { flex: 1 1 50%; padding: 0 0.75rem; }
    /* 窄屏两列换行，取消竖分隔线，新行首项为奇数项 */
    .news-guess__item::before,
    .news-guess__item:nth-child(odd)::before { display: none; }
}
.hong {
    color: #FF6600 !important;
}

/* 新闻列表页页面标题（H1）：补全 SEO 标题层级，复用面板内边距与配色 */
.news-list-title {
    margin: 0;
    padding: 0.875rem 1.25rem 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: #333;
}