demo

<div class="row mb-3">
                            <label for="password" class="col-md-4 col-form-label text-md-end">{{ __('Password') }}</label>

<div class="col-md-6">
                                <input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
                                @error('password')<span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>@enderror
                            </div>
                            <div class="col-md-2">
                                <a href="javascript:void(0);" id="togglePassword"><i id="toggleIcon" class="bi bi-eye-slash fs-4 text-dark"></i></a>
                            </div>
                        </div>

<div class="row mb-3">
                            <label for="password-confirm" class="col-md-4 col-form-label text-md-end">{{ __('Confirm Password') }}</label>

// Toggle visibility
        if (passwordInput.type === 'password') {
            passwordInput.type = 'text';
            toggleIcon.classList.remove('bi-eye-slash');
            toggleIcon.classList.add('bi-eye');
        } else {
            passwordInput.type = 'password';
            toggleIcon.classList.remove('bi-eye');
            toggleIcon.classList.add('bi-eye-slash');
        }
    });

// Toggle Confirm Password
    document.getElementById('toggleConfirmPassword').addEventListener('click', function () {
        const passwordConfirmInput = document.getElementById('password-confirm');
        const toggleConfirmIcon = document.getElementById('toggleConfirmIcon');

// Toggle visibility
        if (passwordConfirmInput.type === 'password') {
            passwordConfirmInput.type = 'text';
            toggleConfirmIcon.classList.remove('bi-eye-slash');
            toggleConfirmIcon.classList.add('bi-eye');
        } else {
            passwordConfirmInput.type = 'password';
            toggleConfirmIcon.classList.remove('bi-eye');
            toggleConfirmIcon.classList.add('bi-eye-slash');
        }
    });
</script>