@import "../../../variables.less"; 
@import "../../../mixins.less";

#GettingStartedPortlet {
    .getting-started-title {
        color: @greyColorLighten1;
    }
    .getting-started-list {
        .getting-started-list-item {
            &:last-child {
                .steps-icon {
                    &:before {
                        display: none;
                    }
                }
            }
            .steps-icon {
                .UICheckIcon {
                    background: @tertiaryColor;
                    border-radius: 50%;
                    width: 20px;
                    height: 20px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    text-align: center;
                    &:before {
                        content: '\e9c8';
                        font-family: 'PLF-FONT-ICONS' !important;
                        font-size: 12px;
                        margin-left: -3px;
                    }
                }
                .step-number {
                    width: 20px;
                    height: 20px;
                    background: @greyColorLighten1;
                    text-align: center;
                    border-radius: 50%;
                }
                &:before {
                    content: '';
                    position: absolute;
                    width: 1px;
                    height: 20px;
                    background:  @greyColorLighten1;
                    left: 25px;
                    top: 28px;
                }
            }
        
            .inactiveStep {
                color: @greyColorLighten1;
            }
        
        }

    }
}