/* ============================================================
   home.css — 首页专用样式
   AI洞察区 + 三栏速览 + 分类筛选胶囊 + 数据看板
   ============================================================ */

/* === AI 洞察区 === */
.ai-digest {
  position: relative;
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-primary-border);
  border-top: 4px solid var(--qdw-mint-500);
  background: var(--color-bg-container);
  overflow: hidden;
  margin-bottom: var(--space-6);
}
.ai-digest__inner { position: relative; padding: var(--space-5) var(--space-4); }
.ai-digest__header {
  display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3);
}
.ai-digest__icon {
  width: 36px; height: 36px; border-radius: var(--radius-md);
  background: var(--color-primary-bg); color: var(--qdw-mint-700);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ai-digest__label {
  font-size: var(--text-sm); font-weight: var(--weight-semibold);
  color: var(--qdw-mint-700); letter-spacing: 0.02em;
}
.ai-digest__date { font-size: var(--text-xs); color: var(--color-text-quaternary); margin-left: var(--space-2); }

/* === Insight Grid === */
.insight-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  margin-top: var(--space-3);
}
.insight-card {
  padding: var(--space-3);
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border-tertiary);
  transition: border-color var(--duration-fast) var(--ease-standard);
}
.insight-card:hover {
  border-color: var(--color-primary-border);
}
.insight-card__head {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-bottom: var(--space-1);
}
.insight-card__cat {
  font-size: 11px;
  font-weight: var(--weight-semibold);
  color: var(--qdw-mint-700);
  background: var(--color-primary-bg);
  padding: 2px 8px;
  border-radius: var(--radius-pill);
}
.insight-card__heat {
  font-size: 10px;
  font-weight: var(--weight-semibold);
  padding: 1px 5px;
  border-radius: var(--radius-xs);
  letter-spacing: 0.04em;
  margin-left: auto;
  flex-shrink: 0;
}
/* 与 base.css 的 .news-card__heat--* 同口径：实心=爆，浅底橙=发酵中，浅底蓝=新 */
.insight-card__heat--burst {
  color: #fff;
  background: var(--qdw-orange-500);
}
.insight-card__heat--ferment {
  color: var(--qdw-orange-500);
  background: var(--qdw-orange-100);
}
.insight-card__heat--fresh {
  color: var(--qdw-blue-500);
  background: var(--qdw-blue-100);
}
.insight-card__text {
  font-size: var(--text-sm);
  color: var(--color-text);
  line-height: var(--leading-body);
  margin: 0;
}
.insight-card__text strong {
  color: var(--color-text-base);
  font-weight: var(--weight-semibold);
}
.insight-card__text a { color: inherit; }
.insight-card__text a:hover { color: var(--color-primary-hover); }
.insight-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-top: var(--space-1);
  font-size: 11px;
  color: var(--color-text-quaternary);
}

/* AI Digest Tags */
.ai-digest__tags { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); }
.ai-tag {
  font-size: 12px;
  font-weight: var(--weight-medium);
  color: var(--qdw-mint-700);
  background: var(--color-primary-bg);
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  letter-spacing: 0.01em;
  transition: background var(--duration-fast) var(--ease-standard);
}
.ai-tag:hover { background: var(--color-primary-bg-hover); }

/* AI Digest Stats */
.ai-digest__stats {
  display: flex;
  gap: var(--space-5);
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border-tertiary);
}
.ai-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.ai-stat__num {
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
  color: var(--qdw-mint-700);
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.ai-stat__label {
  font-size: 11px;
  color: var(--color-text-quaternary);
  white-space: nowrap;
}

/* === Filter Chips === */
.filter-chips {
  display: flex;
  gap: var(--space-2);
  overflow-x: auto;
  scrollbar-width: none;
  padding: var(--space-1) 0 var(--space-4);
  margin-bottom: 0;
}
.filter-chips::-webkit-scrollbar { display: none; }
.chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border-tertiary);
  border-radius: var(--radius-pill);
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--duration-fast) var(--ease-standard);
}
.chip:hover {
  background: var(--color-primary-bg);
  border-color: var(--color-primary-border);
  color: var(--qdw-mint-700);
}
.chip--active {
  background: var(--color-primary-bg);
  border-color: var(--color-primary);
  color: var(--qdw-mint-700);
  font-weight: var(--weight-semibold);
}

/* === Tri-Panel (今日速览 + 行业事件 + 数据看板) === */
.tri-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}
.tri-panel__card {
  background: var(--color-bg-container);
  border: 1px solid var(--color-border-tertiary);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  min-width: 0;
  overflow: visible;
}
.tri-panel__card .briefing-list {
  border: none;
  border-radius: 0;
}
.tri-panel__card .briefing-list .briefing-row {
  padding: var(--space-2) 0;
}
.tri-panel__card .briefing-row__meta {
  gap: var(--space-1);
}
.tri-panel__card .sec-header {
  margin-bottom: var(--space-3);
}

/* === Briefing List (今日速览) === */
.briefing-list { display: flex; flex-direction: column; }
.briefing-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-1);
  cursor: pointer;
  border-radius: var(--radius-md);
  transition: background var(--duration-fast) var(--ease-standard);
}
.briefing-row:hover { background: var(--color-primary-bg); }
.briefing-row + .briefing-row { border-top: 1px solid var(--color-border-tertiary); }
.briefing-row__rank {
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  width: 18px;
  text-align: center;
  flex-shrink: 0;
  color: var(--color-text-quaternary);
}
.briefing-row--top .briefing-row__rank { color: var(--color-primary-hover); }
.briefing-row__body { flex: 1; min-width: 0; }
.briefing-row__title {
  font-size: var(--text-sm);
  font-weight: var(--weight-regular);
  color: var(--color-text);
  line-height: var(--leading-ui);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.briefing-row__meta {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-top: 2px;
}
.briefing-row__source { font-size: 11px; color: var(--color-text-tertiary); }

/* === Timeline (行业事件) === */
.timeline-list {
  display: flex;
  flex-direction: column;
}
.timeline-list .timeline-item {
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--color-border-tertiary);
}
.timeline-list .timeline-item:last-child {
  border-bottom: none;
}
.timeline-item__dot {
  display: none;
}
.timeline-item__date {
  font-size: 11px;
  font-weight: var(--weight-medium);
  color: var(--color-text-quaternary);
  margin-bottom: 2px;
}
.timeline-item__title {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
  line-height: var(--leading-ui);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.timeline-item__date-inline {
  font-size: 11px;
  font-weight: var(--weight-regular);
  color: var(--color-text-quaternary);
  flex-shrink: 0;
}
.timeline-item__title a {
  color: inherit;
  text-decoration: none;
}
.timeline-item__title a:hover {
  color: var(--color-primary-hover);
}
.timeline-list .timeline-item__desc {
  display: block;
  font-size: var(--text-xs);
  color: var(--color-text-tertiary);
  line-height: var(--leading-ui);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* === Data Board (数据看板) === */
.data-board {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.data-board__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.data-board__label {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-text-tertiary);
  letter-spacing: 0.02em;
}
.data-bar-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.data-bar {
  display: grid;
  grid-template-columns: 76px 1fr 52px;
  align-items: center;
  gap: var(--space-2);
}
.data-bar__name {
  font-size: var(--text-xs);
  color: var(--color-text-secondary);
  white-space: nowrap;
}
.data-bar__track {
  height: 10px;
  background: var(--color-bg-elevated);
  border-radius: 3px;
  overflow: hidden;
}
.data-bar__fill {
  height: 100%;
  background: var(--color-primary);
  border-radius: 3px;
  transition: width 0.6s var(--ease-standard);
}
.data-bar__val {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.data-board__source {
  font-size: 11px;
  color: var(--color-text-quaternary);
  text-align: right;
  margin-top: var(--space-2);
}

/* === Featured Feed (精选推荐 — 按日期分组可折叠) === */
.feed-group {
  margin-bottom: var(--space-2);
}
.feed-date {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-3);
  background: var(--color-bg-container);
  border: 1px solid var(--color-border-tertiary);
  border-radius: var(--radius-md);
  cursor: pointer;
  user-select: none;
  transition: background var(--duration-fast) var(--ease-standard);
  margin-bottom: var(--space-2);
}
.feed-date:hover {
  background: var(--color-primary-bg);
}
.feed-date__text {
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}
.feed-date__weekday {
  font-size: var(--text-xs);
  color: var(--color-text-tertiary);
  font-weight: var(--weight-regular);
}
.feed-date__count {
  font-size: 11px;
  color: var(--color-text-quaternary);
  margin-left: auto;
  background: var(--color-bg-elevated);
  padding: 2px 8px;
  border-radius: var(--radius-pill);
}
.feed-date__arrow {
  color: var(--color-text-quaternary);
  flex-shrink: 0;
  transition: transform var(--duration-fast) var(--ease-standard);
}
.feed-group.collapsed .feed-date__arrow {
  transform: rotate(-90deg);
}
.feed-group .feed-list {
  overflow: hidden;
  transition: max-height var(--duration-base) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard);
}
.feed-group.collapsed .feed-list {
  max-height: 0 !important;
  opacity: 0;
}

/* === Responsive === */
@media (min-width: 481px) {
  .briefing-row { padding: var(--space-2) var(--space-2); gap: var(--space-3); }
  .briefing-row__rank { font-size: var(--text-md); width: 20px; }
  .briefing-row__title { font-size: var(--text-base); }
  .briefing-row__source { font-size: var(--text-xs); }
  .timeline-item__title { font-size: var(--text-base); }
  .timeline-item__desc { font-size: var(--text-sm); }
  .chip { padding: 5px 10px; font-size: var(--text-xs); }
}

@media (min-width: 769px) {
  .tri-panel {
    grid-template-columns: 1fr 1fr;
  }
  .tri-panel__card:last-child {
    grid-column: 1 / -1;
  }
  .insight-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
  }
  .briefing-row { padding: var(--space-2); gap: var(--space-3); }
  .briefing-row__rank { font-size: var(--text-md); width: 20px; }
  .briefing-row__title { font-size: var(--text-base); }
  .briefing-row__source { font-size: var(--text-xs); }
  .timeline-item__date { font-size: var(--text-xs); }
  .timeline-item__title { font-size: var(--text-base); }
  .timeline-item__desc { font-size: var(--text-sm); }
}

@media (min-width: 1025px) {
  .tri-panel {
    grid-template-columns: repeat(3, 1fr);
  }
  .tri-panel__card:last-child {
    grid-column: auto;
  }
  .insight-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
  }
}