.steps-container[data-v-15308bdb] {
    display: grid;
    gap: 1rem;
    margin-top: 2.5rem;
    position: relative;
    z-index: 0
}

.step-number[data-v-15308bdb] {
    align-items: center;
    border-radius: 9999px;
    border-width: 2px;
    cursor: pointer;
    display: flex;
    font-size: 1.875rem;
    font-weight: 700;
    height: 3rem;
    justify-content: center;
    line-height: 2.25rem;
    transition-duration: .3s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    width: 3rem
}

.step-number.active-step[data-v-15308bdb] {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0/var(--tw-border-opacity,1));
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0/var(--tw-bg-opacity,1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity,1));
    position: relative;
    z-index: 1
}

.step-number.active-step[data-v-15308bdb]:after {
    height: calc(100% + 20px);
    left: -10px;
    top: -10px;
    width: calc(100% + 20px)
}

.step-number.active-step[data-v-15308bdb]:after,.step-number.active-step[data-v-15308bdb]:before {
    animation: pulse-15308bdb 2s infinite;
    border: 2px solid rgba(0,0,0,.5);
    border-radius: 50%;
    content: "";
    position: absolute
}

.step-number.active-step[data-v-15308bdb]:before {
    height: calc(100% + 12px);
    left: -6px;
    top: -6px;
    width: calc(100% + 12px)
}

.step-number.disabled-step[data-v-15308bdb] {
    --tw-scale-x: .75;
    --tw-scale-y: .75;
    cursor: not-allowed;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-border-opacity: 1;
    border-color: rgb(100 116 139/var(--tw-border-opacity,1));
    --tw-bg-opacity: 1;
    background-color: rgb(var(--color-gray-200)/var(--tw-bg-opacity,1));
    --tw-text-opacity: 1;
    color: rgb(var(--color-gray-500)/var(--tw-text-opacity,1))
}

@media (min-width: 768px) {
    .step-number.disabled-step[data-v-15308bdb] {
        --tw-scale-x:1;
        --tw-scale-y: 1;
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }
}

.step-number.completed-step[data-v-15308bdb] {
    background-image: linear-gradient(to bottom right,var(--tw-gradient-stops));
    --tw-gradient-from: #192570 var(--tw-gradient-from-position);
    --tw-gradient-to: rgba(25,37,112,0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);
    --tw-gradient-to: rgb(var(--color-primary-DEFAULT)/0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from),rgb(var(--color-primary-DEFAULT)/1) var(--tw-gradient-via-position),var(--tw-gradient-to);
    --tw-gradient-to: #8c3183 var(--tw-gradient-to-position);
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity,1))
}

.step-number.pending-step[data-v-15308bdb] {
    background: #fff!important
}

.step-title[data-v-15308bdb] {
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.75rem;
    text-align: center
}

.step-title.active-step[data-v-15308bdb] {
    --tw-text-opacity: 1;
    color: rgb(0 0 0/var(--tw-text-opacity,1))
}

.step-title.disabled-step[data-v-15308bdb] {
    --tw-text-opacity: 1;
    color: rgb(var(--color-gray-500)/var(--tw-text-opacity,1))
}

.step-title.completed-step[data-v-15308bdb] {
    --tw-text-opacity: 1;
    color: rgb(42 22 71/var(--tw-text-opacity,1))
}

.active-decoration[data-v-15308bdb] {
    position: relative;
    z-index: 1
}

.active-decoration[data-v-15308bdb]:after {
    height: calc(100% + 20px);
    left: -10px;
    top: -10px;
    width: calc(100% + 20px)
}

.active-decoration[data-v-15308bdb]:after,.active-decoration[data-v-15308bdb]:before {
    animation: pulse-15308bdb 2s infinite;
    border: 2px solid rgba(0,0,0,.5);
    border-radius: 50%;
    content: "";
    position: absolute
}

.active-decoration[data-v-15308bdb]:before {
    height: calc(100% + 12px);
    left: -6px;
    top: -6px;
    width: calc(100% + 12px)
}

@keyframes pulse-15308bdb {
    0% {
        transform: scale(.95)
    }

    70% {
        opacity: 0;
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.95)
    }
}
