.input-group-text {
    cursor: pointer;
    border-left: 0; /* Optional: remove border between input and button */
}

    .input-group-text i {
        color: #6c757d; /* Optional: change icon color */
        font-size: 1.2em;
    }

input.form-control {
    border-color: #dee2e6; /* Default border color */
}

    input.form-control.is-invalid {
        border-color: red;
    }

    input.form-control.is-valid {
        border-color: green;
    }

select.form-control {
    border-color: #dee2e6; /* Default border color */
}

    select.form-control.is-invalid {
        border-color: red;
    }

    select.form-control.is-valid {
        border-color: green;
    }

.invalid-feedback {
    display: none;
    Hide by default
}

input.form-control.is-invalid ~ .invalid-feedback {
    display: block;
    Show when invalid
}
/* Add styles for progress bar */
.progress {
    height: 5px;
}

.progress-bar {
    transition: width 0.5s;
}

.bg-success {
    background-color: #28a745 !important;
}

.bg-warning {
    background-color: #ffc107 !important;
}

.bg-danger {
    background-color: #dc3545 !important;
}

/* Sync the border color for the input and the toggle button */
.input-group .form-control,
.input-group .input-group-text {
    border-color: #dee2e6 !important; /* Default border color */
    background-color: #fff;
}

    .input-group .form-control.is-invalid,
    .input-group .input-group-text.is-invalid {
        border-color: red !important;
    }

    .input-group .form-control.is-valid,
    .input-group .input-group-text.is-valid {
        border-color: green !important;
    }

/* Hide the default browser eye icon and check icon */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear,
input[type="password"]::-webkit-clear-button,
input[type="password"]::-webkit-inner-spin-button,
input[type="password"]::-webkit-outer-spin-button {
    display: none;
}

/*.input-group .input-group-text {
    cursor: pointer;
    background: white;*/ /* Ensures button background matches the input */
    /*border-left: 1px solid #dee2e6;*/ /* Maintain border between input and button */
/*}

    .input-group .input-group-text i {
        color: #6c757d;*/ /* Optional: change icon color */
        /*font-size: 1.2em;
    }*/

    /* Remove outline on focus for a more seamless look */
    .input-group .form-control:focus,
    .input-group .input-group-text:focus {
        outline: none;
        box-shadow: none;
    }


.was-validated .form-control:valid, .form-control.is-valid {
    background-image: none;
}

#Password, #ConfirmPassword {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-right: none;
}

.toggle-password {
    border-bottom-right-radius: 0.375rem !important;
    border-top-right-radius: 0.375rem !important;
    border-left: none;
}