{% extends 'auth-base.html' %}
{% load static %}
{% load humanize %}
{% load widget_tweaks %}
{% load embed_video_tags %}

{% block title %} Change Password {% endblock title %}

{% block content %}

<div class="container-scroller">
  <div class="container-fluid page-body-wrapper full-page-wrapper">
      <div class="content-wrapper auth p-0 theme-two">
          <div class="row d-flex align-items-stretch">
              <div class="col-12 col-md-12 h-100 card">
                  <div class="auto-form-wrapper d-flex align-items-center justify-content-center flex-column">
                      <div class="nav-get-started">
                          <p>Access Account?</p>
                          <a class="btn get-started-btn text-dark" href="{% url 'userdashboard:user_profile' %}">ACCOUNT</a>
                      </div>





<form method=post action="." name=mainform>
<a href='/'>
<img alt="" src="https://res.cloudinary.com/daniela1/image/upload/v1760934619/score_logo_otjbu5.png" style='height: 30px; width: auto;'>
</a>

{% csrf_token %}
<br />
{% if messages %} 
  {% for msg in messages %}
  <div class="alert alert-danger text-center" role="alert">
    {{ msg }}
  </div>
  {% endfor %} 
{% endif %}

<h3 class="mt-3 mr-auto">Welcome</h3>
<p class="mr-auto">Enter your details below.</p>

<div class="form-group">
<div class="input-group">
   <div class="input-group-prepend">
       <span class="input-group-text">
           <i class="fa fa-lock"></i>
       </span>
   </div>
   {% if form.old_password.errors %}
   <div class="alert alert-danger text-center" role="alert">
       {{ form.old_password.errors}}
     </div>
   {% endif %}
   {% render_field form.old_password placeholder="Old Password*" class="form-control" %}  </div>
</div>


<div class="form-group">
  <div class="input-group">
     <div class="input-group-prepend">
         <span class="input-group-text">
             <i class="fa fa-lock"></i>
         </span>
     </div>
     {% if form.new_password1.errors %}
     <div class="alert alert-danger" role="alert">
         {{ form.new_password1.errors}}
       </div>
     {% endif %}
     {% render_field form.new_password1 placeholder="New Password*" class="form-control" %} </div>
  </div>


  <div class="form-group">
    <div class="input-group">
       <div class="input-group-prepend">
           <span class="input-group-text">
               <i class="fa fa-lock"></i>
           </span>
       </div>

       {% if form.new_password2.errors %}
       <div class="alert alert-danger" role="alert">
           {{ form.new_password2.errors}}
         </div>
       {% endif %}
       {% render_field form.new_password2 placeholder="Confirm New Password*" class="form-control" %}
       <!--<br />-->
       <!--    {% for field in form  %}-->
       <!--        <p>{{ field.help_text}}</p>-->
       <!--    {% endfor %} </div>-->
    </div>



<p class='text-warning'><a href="{% url 'password_reset' %}">Forgot Password?</a></p>
<div class="form-group">
<button type="submit" name="login" class="btn btn-block myBtn-custom">SAVE <i class="fa fa-sign-in"></i></button>
</div> 

<div class="wrapper mt-2 text-gray">
<p class="footer-text">Copyright © Scoretrade Value Limited. All rights reserved.</p>
<ul class="auth-footer text-gray">
   <li>
       <a href="{% url 'zeeprimeapp:about_us' %}">About Us</a>
   </li>
   <li>
       <a href="{% url 'zeeprimeapp:policies' %}">Terms & Conditions</a>
   </li>
</ul>
</div>
<br>
<div id="google_translate_element"></div>
</form> 
</div>
</div>
</div>
</div>
<!-- content-wrapper ends -->
</div>
<!-- page-body-wrapper ends -->
</div>
{% endblock content %}