.uif-step-status
  &-item
    float left
    width 136px
  &-dot
    float left
    width 56px
    height 24px
    padding-top 8px
  &-icon
    float left
    width 24px
    height @width
    .uif-i
      font-size 24px
      width 24px
      text-align center
    .uicon-empty
      margin 2px
      width 20px
      height @width
      border 2px solid #DBDDE2
      border-radius 50%
  &-title
  &-desc
    font-size 12px
    line-height 20px
    text-align center
  &-title
    color #606E7B
    margin-top 4px
  &-desc
    color #7E8B98
    visibility hidden


.uif-step-status-dot .dot
  float left
  margin 2px
  width 4px
  height 4px
  border-radius 50%
  background-color #DBDDE2

.uif-step-status .uif-step-status-item:first-child .uif-step-status-dot:first-child .dot
.uif-step-status .uif-step-status-item:last-child .uif-step-status-dot:last-child .dot
  display none


.uif-step-status-success
  .uif-step-status-title
    color #384048
  .dot
    background-color #299929
  .uif-i
    color #299929
  .uif-step-status-desc
    visibility visible

.uif-step-status-progress
  .dot
    background-color #299929
    opacity 0.25
  .uif-i
    border-color #299929
    opacity 0.25


.uif-step-status-error
  .dot
    background-color #EC3751
  .uif-i
    color #EC3751
  .uif-step-status-title
    color #384048
  .uif-step-status-desc
    visibility visible