// >>-- 73 Form_wizard_1 css start --<<

.navstpes,
.custom-navstpes,
.navstpespills {
    gap: 12px;

    .nav-link {
        text-align: left;
        background-color: transparent;
        border: 1px solid rgba(var(--secondary), 0.2);
        display: flex;
        align-items: center;
        border-radius: var(--bs-border-radius);
        padding: 14px 18px;
        font-size: calc(15px + (18 - 15) * ((100vw - 300px) / (1920 - 300)));
        color: rgba(var(--dark), 0.8);

        i {
            font-size: 24px;
            color: rgba(var(--primary));
            background-color: rgba(var(--primary), 0.10);
            padding: 8px;
            border-radius: 100%;
            border: 1px solid rgba(var(--primary));
        }

        &:hover,
        &:focus,
        &.active {
            background-color: rgba(var(--primary), .1);
            color: rgba(var(--primary), 1);
            border: 1px solid rgba(var(--primary));
            transition: var(--app-transition);

            i {
                color: rgba(var(--white),1);
                background-color: rgba(var(--primary));
            }
        }
    }
}

.custom-navstpes,
.navstpespills {
    .nav-link {
        &:focus,
        &.active {
            color: rgba(var(--primary));

            i {
                color: rgba(var(--white),1);
                background-color: rgba(var(--primary));
            }
        }
    }
}

.navstpespills {
    display: grid;

    .nav-link {
        margin-right: 10px;

        h5 {
            font-size: calc(12px + (18 - 12) * ((100vw - 300px) / (1920 - 300)));
        }
    }
}

.navstpescontent {
    height: 100%;
    // background-color: rgb(var(--light), 0.1);
    padding: 24px;
    border-radius: 5px;
}

.select-content {
    border: 1px solid var(--border_color);
    border-radius: var(--bs-border-radius);

    .check-box {
        margin-bottom: 0;
    }
    span{
        line-break: anywhere;
    }
}


.business-nav {
    gap: 12px;

    .nav-link {
        position: relative;
        background-color: rgba(var(--primary), .1);
        color: rgba(var(--primary), 1);
        border: 1px solid rgba(var(--primary), 0.2);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        padding: 18px;
        i{
            font-size: 24px;
        }

        &:before {
            width: 33px;
            height: auto;
            content: "";
            position: absolute;
            top: auto;
            bottom: -15px;
            left: 50%;
            transform: translateX(-50%);
            border-top: 15px solid transparent;
            border-right: 20px solid transparent;
            border-left: 21px solid transparent;
            background-color: transparent;
        }


        &:focus,
        &.active {
            background-color: rgba(var(--primary));
            color: rgba(var(--white),1);
          span{
                color: rgba(var(--white),1);
            }
            &:before{
                border-top: 15px solid rgba(var(--primary));
            }
        }

    }
}

// >>-- 73 Form_wizard_1 css end --<<