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

{% block title %} Login {% 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>Don't have an account?</p>
                          <a class="btn get-started-btn text-dark" href="{% url 'userdashboard:register' %}">GET STARTED</a>
                      </div>





<form method=post action="{% url 'userdashboard:login' %}" 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-user"></i>
       </span>
   </div>
   {% render_field form.username class="form-control" placeholder="Username*" %}
</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>
   {% render_field form.password placeholder="Password*" class="form-control" %}</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">SIGN IN <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 %}