.ant-steps {
    display: flex;
    margin-left: -67px;
    .ant-steps-item-process {
        .ant-steps-item-icon {
            top: -4px;
            box-sizing: content-box;
            width: 16px;
            height: 16px;
            .ant-steps-icon {
                background: var(--green400);
                .ant-steps-icon-dot {
                    background: var(--green400);
                    border: 0;
                }
            }
        }
    }
    .ant-steps-item-content {
        width: 99px;
    }
    .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-tail,
    .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-tail,
    .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-tail {
        top: 2px;
        width: 100%;
        margin: 0px 0px 0px 70px;
        padding: 0;
        &::after {
            width: calc(100% - 8px);
            height: 2px;
            margin-left: 5px;
        }
    }
    .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-tail::after,
    .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-tail::after {
        background-color: var(--gray400);
    }
    .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-tail::after {
        background-color: var(--green400);
    }

    .ant-steps-item-finish {
        .ant-steps-item-icon {
            .ant-steps-icon {
                background: var(--green400);
                .ant-steps-icon-dot {
                    background: var(--green400);
                    border: 0;
                }
            }
        }
    }
    .ant-steps-item-icon {
        width: 8px;
        height: 8px; 
        .ant-steps-icon {
            background: transparent;
            .ant-steps-icon-dot {
                background: transparent;
                border: 2px solid var(--gray400);
            }
        }
    }
}