/* ============================================================
   AI情报页主题统一层（ai.php / ai-detail.php 专用）
   原理：style.css 是旧深色玻璃主题，但 ai-* 全部走 CSS 变量——
   重定义变量即可整体换色，结构零改动。
   加载顺序：style.css → ai.css → ai-detail.css → site-demo.css
             → site-pages.css → 本文件（最后，覆盖一切）
   ============================================================ */

/* ===== 1) 主题变量：深色玻璃 → 蓝白（与全站一致） ===== */
:root {
  --bg-deep: #f5f7fb;
  --bg-primary: #ffffff;
  --bg-card: #ffffff;
  --bg-card-hover: #f8faff;
  --glass-border: #e3e9f4;
  --glass-border-hover: #b9c9f2;
  --accent: #254dff;
  --accent-glow: rgba(37, 77, 255, 0.12);
  --accent2: #06b6d4;
  --text-primary: #131d36;
  --text-secondary: #576887;
  --text-muted: #8fa0bc;
}

/* 页面底色与文字（style.css 的深色 body 由 site-demo.css 已覆盖，此处兜底） */
body {
  background: #ffffff;
  color: var(--text-primary);
}

/* ===== 2) Hero：深色荧光渐变 → 浅蓝过渡；避开悬浮胶囊导航 ===== */
.ai-hero {
  padding: 132px 0 40px;
  background: linear-gradient(180deg, #eef3ff 0%, #ffffff 100%);
  border-bottom: 1px solid var(--line, #e3e9f4);
}
.ai-hero-title {
  color: #131d36;
}
.ai-hero-subtitle {
  color: #576887;
}

/* ===== 3) 组件级硬编码色修正（青色荧光 → 主题蓝） ===== */
/* 新闻编号徽章 */
.ai-news-number {
  background: rgba(37, 77, 255, 0.08);
}
/* 筛选标签激活态 */
.ai-filter-tag.active {
  background: rgba(37, 77, 255, 0.10);
}
/* 侧栏最新条目 hover */
.ai-latest-item:hover {
  background: rgba(37, 77, 255, 0.05);
}
/* 侧栏小标题（原写死 #fff） */
.ai-widget-title {
  color: #131d36;
}
/* 搜索按钮：青色渐变 → 主题蓝渐变 */
.ai-search-btn {
  background: linear-gradient(135deg, #254dff, #4f7bff);
  color: #ffffff;
}
.ai-search-btn:hover {
  box-shadow: 0 6px 16px rgba(37, 77, 255, 0.30);
}

/* ===== 4) 骨架屏（加载占位）：白色系 ===== */
.ai-skeleton {
  background: linear-gradient(90deg, #edf1f8 25%, #f7f9fd 50%, #edf1f8 75%) !important;
  background-size: 200% 100% !important;
}
.ai-skeleton-card {
  background: #ffffff;
  border: 1px solid #e3e9f4;
}

/* ===== 5) 空状态 ===== */
.ai-empty-title {
  color: #131d36;
}
.ai-empty-desc {
  color: #8fa0bc;
}

/* ===== 6) ai.css 里的深色底地区/分类标签：换成浅底深字 ===== */
.ai-news-detail-tag.region-国内 {
  background: rgba(15, 157, 88, 0.08); color: #0f9d58;
  border: 1px solid rgba(15, 157, 88, 0.22);
}
.ai-news-detail-tag.region-国际 {
  background: rgba(37, 77, 255, 0.08); color: #254dff;
  border: 1px solid rgba(37, 77, 255, 0.20);
}
.ai-news-detail-tag.region-广东,
.ai-news-detail-tag.region-惠州 {
  background: rgba(230, 138, 0, 0.10); color: #d97706;
  border: 1px solid rgba(217, 119, 6, 0.25);
}
.ai-news-detail-tag.cat {
  background: rgba(124, 58, 237, 0.07); color: #7c3aed;
  border: 1px solid rgba(124, 58, 237, 0.20);
}

/* ===== 7) 涨跌色：浅底上加深（保持国内习惯：涨红跌绿） ===== */
.change-positive { color: #dc2626; }
.change-negative { color: #16a34a; }
.change-neutral  { color: #8fa0bc; }

/* ===== 8) Header 补救：拆掉 style.css 的旧导航污染 ===== */
/* 旧规则 .header::before 在整条导航后铺 85% 深黑（胶囊两侧发黑的元凶） */
.header::before { display: none; }
/* 旧 .header.scrolled 的收窄 + 黑色投影带 */
.header.scrolled { padding: 14px 24px 0; box-shadow: none; }
@media (max-width: 768px) {
  .header { padding: 10px 16px 0; }
  .header.scrolled { padding: 10px 16px 0; }
}
/* 旧 body 顶部 68px 占位（新导航是悬浮胶囊，页面自带留白） */
body { padding-top: 0; }
@media (max-width: 768px) {
  body { padding-top: 0; }
}
