/* /Editors/FlowEditor/ApprovalTimelineRenderer.razor.rz.scp.css */

.timeline[b-xor6ghn06u] {
    position: relative;
    /*max-width: 600px;*/
    margin: 0 auto;
    
}

.timeline-item[b-xor6ghn06u] {
    display: block;
    align-items: center;
    margin-top: 13px;
   /* border: 2px solid;
    border-color: red;
    width:200px;*/
}

.timeline-date[b-xor6ghn06u] {
    
    margin-right: 20px;
    
}
.timeline-span[b-xor6ghn06u] {
    font-weight: bold;
    margin-right:5px;
}
.timeline-content[b-xor6ghn06u] {
   /* background-color: #f5f5f5;*/
   /* padding: 10px;*/
    border-radius: 5px;
    display: inline-flex;
}
.timeline-content-item[b-xor6ghn06u] {
    font-size: 14px;
    color: #666;
    margin-right: 2px;
}
.approver[b-xor6ghn06u] {
    font-size: 14px;
    margin-right: 2px;
}

.status[b-xor6ghn06u] {
    font-size: 14px;
    color: #666;
    margin-right: 2px;
}

.timeline-line[b-xor6ghn06u] {
    border: 1px solid #ccc;
    margin: 0 10px;
}


.timeline-dot[b-xor6ghn06u] {
    position: relative;
    width: 15px; /* 容器宽度 */
    height: 35px; /* 容器高度 */
    margin: 0px auto; /* 居中显示 */
    border-left: 2px solid blue; /* 竖线颜色和宽度 */
    float: left;
}

.timeline-dot[b-xor6ghn06u]::before {
    content: '';
    position: absolute;
    top: 50%; /* 圆点垂直居中 */
    left: -6px; /* 圆点水平位置，与竖线重叠 */
    transform: translateY(-50%); /* 垂直居中调整 */
    width: 10px; /* 圆点直径 */
    height: 10px;
    /*background-color: #00FF00;*/ /* 圆点颜色 */
    border-radius: 50%; /* 使圆点呈圆形 */
    z-index: 1; /* 确保圆点在竖线之上 */
}
.timeline-dot-yellow[b-xor6ghn06u]::before {
    background-color: yellow; /* 圆点颜色 */
}

.timeline-dot-green[b-xor6ghn06u]::before {
    background-color: #00FF00; /* 圆点颜色 */
}
    /* 箭头样式 */
    .timeline-dot[b-xor6ghn06u]::after {
        content: '';
        position: absolute;
        bottom: -10px; /* 箭头位置 */
        left: -6px; /* 箭头水平位置，与竖线对齐 */
        width: 0;
        height: 0;
        border-left: 5px solid transparent; /* 箭头左边透明 */
        border-right: 5px solid transparent; /* 箭头右边透明 */
        border-top: 10px solid #0000FF; /* 箭头颜色 */
    }
/* /Editors/FlowEditor/FlowDesignerRenderer.razor.rz.scp.css */
.wf-map-box .wf-map-descript-word[b-8imfrk81hk] {
    float: left;
    position: relative;
    top: 28%;
}

    .wf-map-box .wf-map-descript-word .content-wrap[b-8imfrk81hk] {
        margin: 0 15px;
        display: inline-block;
    }

        .wf-map-box .wf-map-descript-word .content-wrap span.passed-node[b-8imfrk81hk] {
            border: 1px solid #49A8D4;
            background-color: #a9e3ff;
            width: 10px;
        }

        .wf-map-box .wf-map-descript-word .content-wrap span.not-pass-node[b-8imfrk81hk] {
            border: 1px solid #5ABD6B;
            background-color: #BFF3C3;
            width: 10px;
        }

        .wf-map-box .wf-map-descript-word .content-wrap span.current-node[b-8imfrk81hk] {
            border: 1px solid #F5B87B;
            background-color: #FFE8CC;
            width: 10px;
        }