<!-- Login/Logout Modal -->
  <div class="modal fade" id="login_modal" tabindex="-1" aria-labelledby="login_modal_Label" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content shadow">
        <div class="modal-header">
          <h3 class="modal-title fs-5" id="login_modal_Label">вход/выход</h3>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <form  action="/login" method="post" autocomplete="off">
        {% csrf_token %}
          <div class="modal-body">
            <div class="input-group flex-nowrap my-4">
              <span class="input-group-text" id="addon-wrapping"><i class="fa-solid fa-user"></i></span>
              <input type="text" class="form-control" placeholder="username" aria-label="username"
                     aria-describedby="addon-wrapping" name="username" required>
            </div>
            <div class="input-group flex-nowrap my-4">
              <span class="input-group-text" id="addon-wrapping"><i class="fa-solid fa-lock"></i></span>
              <input type="password" class="form-control" placeholder="password" aria-label="password"
                     aria-describedby="addon-wrapping" name="password" autocomplete="new-password" readonly required
                     onfocus="this.removeAttribute('readonly');">
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Регистрация</button>
            <button type="submit" class="btn btn-primary">Вход</button>
          </div>
        </form>
      </div>
    </div>
  </div>