How to fix CSRF TOKEN being overwritten with form data after submission failed in django?

I am building a multitenants project using django-tenant and django-tenant-user but I am facing a weird issue where the CSRF TOKEN and email fields of my login form are being overwritten with the password data after a failed login attempt.

Please view the relevant code snippets below:

View

def login_user(request):
    if request.user.is_authenticated:
        return redirect('core:index')
    if request.method != 'POST':
        form = LoginForm()
        return render(request, 'core/login.html', {'form': form})
    form = LoginForm(request.POST)
    if not form.is_valid():
        context = {"form": form}
        if not form.errors:
            messages.error(request, 'Invalid username or password')
        return render(request, 'core/login.html', context)
    user = authenticate(request, username=form.cleaned_data['username'], password=form.cleaned_data['password'])
    if user is None:
        messages.error(request, 'Invalid username or password.')
        return render(request, 'core/login.html', {'form': form})
    messages.success(request, 'Login successful')
    login(request, user)
    return redirect('core:index')

Form

class LoginForm(forms.Form):
    username = forms.CharField(min_length=4, max_length=150)
    password = forms.CharField(min_length=4, max_length=128, widget=forms.PasswordInput)

Template

{% extends "_base.html" %}


{% block title %}
  <title>TalwaPro HR Admin - Login </title>
{% endblock title %}

{% block content %}

{% load tailwind_filters %}

<div class="flex h-screen items-center justify-center">
  <div class="card w-[90%] bg-base-200 shadow-xl justify-center md:w-[65%] lg:w-[40%]">
    {% if messages %}
      <div class="toast toast-top toast-start">
        <div class="alert alert-error">
          {% for message in messages %}
            {{ message }}
          {% endfor %}
        </div>
      </div>
    {% endif %}
    <div class="card-body">
      <h2 class="card-title text-accent justify-center">Sign In</h2>
      <form class="mt-4" action="/login/" method="POST">
        {% csrf_token %}
        <label class="input input-bordered flex items-center gap-2 {% if form.username.errors %} border-error {% endif %}">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="w-4 h-4 opacity-70"><path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM12.735 14c.618 0 1.093-.561.872-1.139a6.002 6.002 >
          <input type="text" class="grow" name="username" value="{% if form.username.value %} {{form.username.value}} {% endif %}" placeholder="Username" required />
        </label>
        <div class="text-error">
          {% if form %}
            {{ form.username.errors }}
          {% endif %}
        </div>
        <label class="input input-bordered flex items-center gap-2 mt-4 {% if form.password.errors %} border-error {% endif %}">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="w-4 h-4 opacity-70"><path fill-rule="evenodd" d="M14 6a4 4 0 0 1-4.899 3.899l-1.955 1.955a.5.5 0 0 1-.353.146H5v1>
          <input type="password" class="grow" name="password" placeholder="Password" required />
        </label>
        <div class="text-error">
          {% if form %}
            {{ form.password.errors }}
          {% endif %}
        </div>
      <div class="card-actions justify-center mt-4">
        <button class="btn btn-primary" type="submit">Sign In</button>
      </div>
      </form>
    </div>

  </div>
</div>
{% endblock %}

I have tried logging the form data but this couldn’t help because the CSRF TOKEN is passed correctly on the first attempt and then for other requests the password data is passed as the CSRF TOKEN