{% extends "business/auth/auth_base.html" %}

{% block title %}Set New Password - Inventory Management System{% endblock %}

{% block auth_title %}Set New Password{% endblock %}

{% block auth_subtitle %}Create a new password for your account{% endblock %}

{% block auth_content %}
{% if validlink %}
<form method="POST" novalidate>
    {% csrf_token %}
    
    <div class="mb-3">
        <label for="new_password1" class="form-label">New Password *</label>
        <div class="input-group">
            <span class="input-group-text">
                <i class="fas fa-lock"></i>
            </span>
            <input type="password" 
                   class="form-control" 
                   id="new_password1" 
                   name="new_password1" 
                   placeholder="Enter new password"
                   required
                   minlength="8"
                   autocomplete="new-password">
            <button class="btn btn-outline-secondary toggle-password" type="button">
                <i class="fas fa-eye"></i>
            </button>
        </div>
        <div class="form-text small">
            <ul class="mb-0">
                <li>At least 8 characters</li>
                <li>Not too common</li>
                <li>Not entirely numeric</li>
            </ul>
        </div>
    </div>
    
    <div class="mb-4">
        <label for="new_password2" class="form-label">Confirm New Password *</label>
        <div class="input-group">
            <span class="input-group-text">
                <i class="fas fa-lock"></i>
            </span>
            <input type="password" 
                   class="form-control" 
                   id="new_password2" 
                   name="new_password2" 
                   placeholder="Confirm new password"
                   required
                   autocomplete="new-password">
            <button class="btn btn-outline-secondary toggle-password" type="button">
                <i class="fas fa-eye"></i>
            </button>
        </div>
    </div>
    
    <!-- Submit Button -->
    <button type="submit" class="btn btn-primary-auth btn-auth mb-3">
        <i class="fas fa-key me-2"></i>
        Change Password
    </button>
</form>
{% else %}
<div class="text-center py-4">
    <div class="mb-4">
        <i class="fas fa-exclamation-triangle fa-4x text-warning"></i>
    </div>
    
    <h4 class="mb-3">Invalid Link</h4>
    
    <p class="text-muted mb-4">
        The password reset link was invalid, possibly because it has already been used.
        Please request a new password reset.
    </p>
    
    <div class="mt-4">
        <a href="{% url 'password_reset' %}" class="btn btn-primary-auth btn-auth">
            <i class="fas fa-redo me-2"></i>
            Request New Link
        </a>
    </div>
</div>
{% endif %}
{% endblock %}