
.stepper.stepper-pills.stepper-multistep {
    --kt-stepper-pills-size: 46px;
    --kt-stepper-icon-border-radius: 9px;
    --kt-stepper-icon-check-size: 1.25rem;
    --kt-stepper-icon-bg-color: rgba(255, 255, 255, 0.03);
    --kt-stepper-icon-bg-color-current: var(--kt-success);
    --kt-stepper-icon-bg-color-completed: rgba(255, 255, 255, 0.03);
    --kt-stepper-icon-border: 1px dashed rgba(255, 255, 255, 0.3);
    --kt-stepper-icon-border-current: 0;
    --kt-stepper-icon-border-completed: 1px dashed rgba(255, 255, 255, 0.3);
    --kt-stepper-icon-number-color: var(--kt-white);
    --kt-stepper-icon-number-color-current: var(--kt-white);
    --kt-stepper-icon-number-color-completed: var(--kt-white);
    --kt-stepper-icon-check-color-completed: var(--kt-success);
    --kt-stepper-label-title-opacity: 0.7;
    --kt-stepper-label-title-opacity-current: 1;
    --kt-stepper-label-title-opacity-completed: 1;
    --kt-stepper-label-title-color: var(--kt-white);
    --kt-stepper-label-title-color-current: var(--kt-white);
    --kt-stepper-label-title-color-completed: var(--kt-white);
    --kt-stepper-label-desc-opacity: 0.7;
    --kt-stepper-label-desc-opacity-current: 0.7;
    --kt-stepper-label-desc-opacity-completed: 0.7;
    --kt-stepper-label-desc-color: var(--kt-white);
    --kt-stepper-label-desc-color-current: var(--kt-white);
    --kt-stepper-label-desc-color-completed: var(--kt-white);
    --kt-stepper-line-border: 1px dashed rgba(255, 255, 255, 0.3);
}

body {
    background-color: #ffffff;
}

.stepper.stepper-pills .stepper-nav {
    display: flex;
}

.stepper.stepper-pills.stepper-column .stepper-nav {
    flex-direction: column;
    align-items: start;
}

.stepper.stepper-pills .stepper-item {
    display: flex;
    align-items: center;
    transition: color 0.2s ease;
}

    .stepper.stepper-pills .stepper-item.current {
        transition: color 0.2s ease;
    }

/* .stepper.stepper-pills.stepper-column .stepper-item {
    flex-direction: column;
    justify-content: start;
    align-items: stretch;
    padding: 0;
    margin: 0;
} */

.stepper.stepper-pills .stepper-item {
    display: flex;
    align-items: center;
    transition: color 0.2s ease;
}

.stepper.stepper-pills.stepper-column .stepper-item {
    flex-direction: column;
    justify-content: start;
    align-items: stretch;
    padding: 0;
    margin: 0;
}

.stepper.stepper-pills.stepper-column .stepper-wrapper {
    display: flex;
    align-items: center;
}

.stepper.stepper-pills.stepper-column .stepper-line {
    position: relative !important;
}

.stepper.stepper-pills.stepper-column .stepper-item:first-child .stepper-line {
    top: 0% !important;
}

.stepper.stepper-pills .stepper-item.current .stepper-label .stepper-title {
    color: #3f4254 !important;
}

.stepper.stepper-pills .stepper-item .stepper-label .stepper-title {
    color: #7e8299;
    font-weight: 600;
    font-size: 1.25rem !important;
    margin-bottom: 0.3rem;
}

.stepper-item.completed .stepper-wrapper .stepper-icon.red {
    background-color: #fff5f8 !important
}

    .stepper-item.completed .stepper-wrapper .stepper-icon.red .stepper-check {
        color: #f1416c !important;
    }

.stepper-item.skip .stepper-wrapper .stepper-icon.red {
    background-color: #fff5f8 !important;
}

    .stepper-item.skip .stepper-wrapper .stepper-icon.red .stepper-check {
        color: #f1416c !important;
        display: block !important
    }

    .stepper-item.skip .stepper-wrapper .stepper-icon.red .stepper-number {
        display: none !important
    }

.plan-sb {
    padding-right: calc(var(--bs-gutter-x) * .16) !important;
    padding-left: calc(var(--bs-gutter-x) * .16) !important;
}



#country-sel > span > span.selection > span {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

#phone_no {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 1 !important;
    transform: scale(.85) translateY(-0.85rem) !important;
    padding: 0px;
    left: 12px;
    background: #fff;
    height: auto;
}

#country-sel > .form-control:focus ~ label, #country-sel > .form-control:not(:placeholder-shown) ~ label, #country-sel > .form-select ~ label {
    opacity: 1 !important;
    transform: scale(.85) translateY(-0.85rem) !important;
    padding: 0px;
    left: 27px;
    background: #fff;
    height: auto;
}

.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {
    padding-top: 0.825rem !important;
    padding-bottom: 0.825rem !important;
}

input:-internal-autofill-selected {
    background-image: none !important;
    background-color: #fff !important;
}

#kt_create_account_stepper {
    margin: 34px auto;
    background: #fff;
    border-radius: 14px !important;
}



#kt_app_root {
    background: rgb(152,252,189);
    background: linear-gradient(47.55deg, #008081 8.54%, #233325 100%);
}

.plan-sb-l {
    padding-left: calc(var(--bs-gutter-x) * .32) !important;
}

.plan-sb-r {
    padding-right: calc(var(--bs-gutter-x) * .32) !important;
}

label.selected > div > div.bg-light {
    background-color: #50cd89 !important
}

label.selected > div > div > div.mb-4.text-center > h1 {
    color: #fff !important;
}

label.selected > div > div > div.mb-4.text-center > div {
    color: #fff !important;
}

    label.selected > div > div > div.mb-4.text-center > div > span {
        color: #fff !important;
        opacity: 1 !important
    }

        label.selected > div > div > div.mb-4.text-center > div > span > span {
            color: #fff !important;
        }

label.selected > div > div > div.w-100.mb-3 > div > span.fw-semibold.fs-6.text-gray-800.flex-grow-1 {
    color: #fff !important;
}

label.selected > div > div > div.w-100.mb-3 > div > span.fw-semibold.fs-6.text-gray-400.flex-grow-1 {
    color: #fff !important;
}


label.selected > div > div > div.w-100.mb-3 > div > span.svg-icon.svg-icon-success svg [fill]:not(.permanent):not(g) {
    transition: none !important;
    fill: #fff;
}

label.selected > div > div > div.w-100.mb-3 > div > span.svg-icon.svg-icon-1 > svg > rect {
    transition: none !important;
    fill: #fff;
}

label.selected > div > div > div.w-100.mb-3 > div > span.fw-semibold.fs-6.text-gray-400.flex-grow-1 {
    color: #fff !important;
}

label.selected > div > div > div.mt-3.text-center > div {
    color: #fff !important;
}

label.plan-sb {
    cursor: pointer !important
}

.select2-container--bootstrap5 .select2-selection--single .select2-selection__rendered {
    color: #000000 !important;
}

.cust-switch:disabled {
    opacity: 1 !important;
}

div.selected > div > div > div.form-check.form-switch.form-check-custom.form-check-success.form-check-solid > input {
    filter: none;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2350cd89'/%3e%3c/svg%3e")
}

.svg-icon.svg-icon-success svg [fill]:not(.permanent):not(g) {
    transition: none !important;
    fill: #50cd89;
}

.w-70 {
    width: 70% !important
}

.badge-secondary.active {
    color: #fff !important;
    border-color: #47be7d !important;
    background-color: #47be7d !important;
}


.stepper.stepper-pills .stepper-item .stepper-icon {
    background-color: #F5F8FA;
}

    .stepper.stepper-pills .stepper-item .stepper-icon .stepper-number {
        background: linear-gradient(47.55deg, #008081 8.54%, #008081 92.2%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        display: inline-block;
    }

.stepper.stepper-pills .stepper-item.current .stepper-icon {
    transition: color .2s ease,background-color .2s ease;
    background-color: #181C32 !important;
}

    .stepper.stepper-pills .stepper-item.current .stepper-icon .stepper-number {
        background: linear-gradient(47.55deg, #fff 100%, #fff 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
    }


.stepper.stepper-pills .stepper-item.completed .stepper-icon, .stepper.stepper-pills .stepper-item.current:last-child .stepper-icon {
    transition: color .2s ease,background-color .2s ease;
    background-color: #F5F8FA !important;
}


    .stepper.stepper-pills .stepper-item.completed .stepper-icon .stepper-check, .stepper.stepper-pills .stepper-item.current:last-child .stepper-icon .stepper-check {
        /* Linear */

        background: linear-gradient(47.55deg, #008081 8.54%, #008081 92.2%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        display: inline-block;
    }
