/* ============================================================
   归档页时间轴美化
   结构: .article-sort > .article-sort-item(.year) > .article-sort-item-info
   保持主题原有时间轴逻辑, 仅做视觉增强:
   年份锚点 + 文章卡片 + 日期胶囊, 适配暗色模式与移动端
   ============================================================ */

/* ---------- 顶部统计标题 ---------- */
.article-sort-title {
  font-weight: 700;
}

/* 时间轴主线：调整文章圆点位置使其正中对齐时间线 */
.article-sort {
  border-left-color: rgba(73, 177, 245, .25);
}

/* 覆盖主题默认的文章圆点定位 (calc(-20px - 17px) = -37px 偏右 3px) */
.article-sort-item:not(.year)::before {
  left: calc(-20px - 17px - 1px) !important;  /* -40px, 使圆点中心对准时间线 */
}

/* ---------- 年份行 ---------- */
.article-sort-item.year {
  /* 注意: margin-left 10px 与主题基础规则保持一致, 去掉会导致年份轴点偏离时间轴竖线 */
  margin: 34px 0 16px 10px;
  display: flex;
  align-items: center;
  font-size: 1.45em;
  font-weight: 700;
  color: var(--text-highlight-color);
}

/* 第一个年份贴近顶部标题 */
.article-sort > .article-sort-item.year:first-child {
  margin-top: 6px;
}

/* 年份轴点: 复用主题几何位置(与普通条目同位), 仅改为实心主题色区分层级 */
.article-sort-item.year::before {
  border-color: #49b1f5;
  background: #49b1f5;
}

/* 年份文章数徽章 */
.article-sort-item-count {
  margin-left: 12px;
  padding: 2px 14px;
  font-size: .5em;
  font-weight: 600;
  line-height: 1.7;
  color: #49b1f5;
  background: rgba(73, 177, 245, .1);
  border-radius: 20px;
}

/* ---------- 文章条目卡片 ---------- */
.article-sort-item:not(.year) {
  height: auto;
  margin: 0 0 14px 10px;
  padding: 15px 20px;
  background: var(--card-bg);
  border: 1px solid transparent;
  border-radius: 12px;
  box-shadow: var(--card-box-shadow);
  animation: archiveItemIn .5s ease backwards;
  transition: all .3s ease;
}

.article-sort-item:not(.year):hover {
  transform: translateY(-3px);
  border-color: rgba(73, 177, 245, .4);
  box-shadow: var(--card-hover-box-shadow);
}

/* 悬停时轴点点亮并带光圈 */
.article-sort-item:not(.year):hover::before {
  border-color: #49b1f5;
  box-shadow: 0 0 0 4px rgba(73, 177, 245, .15);
}

/* ---------- 条目内部: 标题居左, 日期胶囊居右 ---------- */
.article-sort-item-info {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 12px;
  padding: 0;
}

.article-sort-item-title {
  order: 1;
  flex: 1;
  min-width: 0;
  font-size: 1.06em;
  font-weight: 600;
}

/* 卡片模式下取消主题默认的标题位移, 只变色 */
.article-sort-item-title:hover {
  transform: none;
}

.article-sort-item-time {
  order: 2;
  flex-shrink: 0;
  margin-left: auto;
  padding: 3px 12px;
  font-size: .82em;
  line-height: 1.6;
  color: var(--card-meta);
  background: rgba(73, 177, 245, .08);
  border-radius: 20px;
  cursor: default;
}

.article-sort-item-time time {
  padding: 0;
}

.article-sort-item-time i {
  margin-right: 4px;
}

/* ---------- 暗色模式 ---------- */
[data-theme='dark'] .article-sort-item:not(.year) {
  border-color: rgba(255, 255, 255, .06);
}

[data-theme='dark'] .article-sort-item:not(.year):hover {
  border-color: rgba(73, 177, 245, .35);
  box-shadow: 0 3px 8px 6px rgba(0, 0, 0, .3);
}

/* ---------- 入场动画 ---------- */
@keyframes archiveItemIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .article-sort .article-sort-item {
    animation: none;
  }
}

/* ---------- 移动端 ---------- */
@media (max-width: 768px) {
  .article-sort-item.year {
    margin: 26px 0 12px 10px;
    font-size: 1.3em;
  }

  .article-sort-item:not(.year) {
    margin-bottom: 10px;
    padding: 12px 14px;
  }

  .article-sort-item-info {
    gap: 8px;
  }

  .article-sort-item-time {
    padding: 2px 10px;
    font-size: .78em;
  }
}