/* Kole UI TimelineList 样式 — 对齐 组件7.txt TimelineList：左侧时间线 + 右侧内容，节点状态 完成/进行中/错误 */

.kole-timeline { font-family: var(--font-family, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif); color: var(--kole-color-text-body); }
.kole-timeline-item { position: relative; }
.kole-timeline-node {
  position: absolute; left: 5px; top: 4px; width: 10px; height: 10px; border-radius: 50%;
  background: var(--kole-color-card-bg); border: 2px solid var(--kole-color-border); box-sizing: border-box; z-index: 1;
}
.kole-timeline-line { position: absolute; left: 9px; top: 16px; bottom: -10px; width: 2px; background: var(--kole-color-border); }
.kole-timeline-content { padding: 0 0 20px 28px; }
.kole-timeline-time { font-size: 12px; color: var(--kole-color-text-secondary); }
.kole-timeline-title { font-size: 14px; font-weight: 500; color: var(--kole-color-text-title); margin-top: 2px; }
.kole-timeline-desc { font-size: 13px; color: var(--kole-color-text-secondary); margin-top: 4px; line-height: 1.5; }

/* 状态：完成 done / 进行中 active / 错误 error / 待处理 pending */
.kole-timeline-item.is-done > .kole-timeline-node { background: var(--kole-color-brand); border-color: var(--kole-color-brand); }
.kole-timeline-item.is-done > .kole-timeline-line { background: var(--kole-color-brand); }
.kole-timeline-item.is-active > .kole-timeline-node { background: var(--kole-color-card-bg); border-color: var(--kole-color-brand); box-shadow: 0 0 0 3px rgba(47,84,235,0.2); }
.kole-timeline-item.is-error > .kole-timeline-node { background: var(--kole-color-error); border-color: var(--kole-color-error); }
.kole-timeline-item.is-error > .kole-timeline-line { background: var(--kole-color-error); }
.kole-timeline-item.is-pending > .kole-timeline-node { background: var(--kole-color-card-bg); border-color: var(--kole-color-border); }

/* 水平模式 */
.kole-timeline.is-horizontal { display: flex; }
.kole-timeline.is-horizontal > .kole-timeline-item { flex: 1; padding-inline-end: 8px; }
.kole-timeline.is-horizontal > .kole-timeline-item > .kole-timeline-node { top: 4px; }
.kole-timeline.is-horizontal > .kole-timeline-item > .kole-timeline-line { left: 15px; top: 9px; bottom: auto; right: 0; width: auto; height: 2px; }
.kole-timeline.is-horizontal > .kole-timeline-item > .kole-timeline-content { padding: 22px 12px 0 0; }