/* process.html 页面时间轴优化样式 */

/* 紫色背景下的连接线（白色） */
.timeline-container::before {
    background: linear-gradient(90deg, 
        #fff 0%, 
        #fff 14%, 
        rgba(255,255,255,0.3) 14%, 
        rgba(255,255,255,0.3) 28%, 
        rgba(255,255,255,0.3) 28%, 
        rgba(255,255,255,0.3) 42%, 
        rgba(255,255,255,0.3) 42%, 
        rgba(255,255,255,0.3) 56%,
        rgba(255,255,255,0.3) 56%, 
        rgba(255,255,255,0.3) 70%, 
        rgba(255,255,255,0.3) 70%, 
        rgba(255,255,255,0.3) 84%,
        rgba(255,255,255,0.3) 84%, 
        rgba(255,255,255,0.3) 100%
    ) !important;
    top: 25px !important;  /* 调整到数字图标中心 */
}

/* 紫色背景下的节点（白色） */
.timeline-container .timeline-card::before,
.timeline-container .timeline-final::before {
    background: rgba(255,255,255,0.3) !important;
    border: 3px solid #764ba2 !important;
    top: 23px !important;  /* 与连接线对齐 */
}

/* 已完成节点（白色） */
.timeline-container .timeline-card.completed::before {
    background: #fff !important;
}

/* 当前阶段节点（白色+光晕） */
.timeline-container .timeline-card.current::before {
    background: #fff !important;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.3) !important;
}

/* 取消当前阶段卡片的蓝色边框动画（在紫色背景下不适用） */
.timeline-container .timeline-card.current::after {
    display: none;
}

/* 时间轴卡片整齐排列 */
.timeline-container > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 100px;
}

/* 统一数字emoji大小和位置 */
.timeline-container > div > div:first-child {
    font-size: 32px;
    margin-bottom: 10px;
    line-height: 1;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 统一标题样式 */
.timeline-container > div > p:first-of-type {
    font-weight: bold;
    margin-bottom: 5px;
    font-size: 14px;
    text-align: center;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 统一时间样式 */
.timeline-container > div > p:last-of-type {
    font-size: 11px;
    opacity: 0.9;
    text-align: center;
}
