.status-etapa{
    text-decoration: none;
    margin-left: 1.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 0;

    &:first-child{
        margin-left: 0;
    }

    &:hover:not(.locked){
        .marker-etapa{
            background: $color-featured;
        }

        .label-etapa{
            color: $color-featured;
        }

        .icon-arrow{
            color: $color-featured
        }
    }

    &.locked{
        opacity: 0.4;
        cursor: default;

        .marker-etapa{
            background: $color-main;
        }
    }

    &.current{
        border-bottom: 0.2rem solid $color-main;

    }

    .icon-arrow{
        font-size: 0.8rem;
        margin-left: 1rem;
        color: $color-main;
        display: inline-block;
        transform: rotate(-90deg);
        transition: color, 0.2s, ease;
    }
}
