{% extends "dashboard/_shell.html" %}
{% block title %}تغییر رمز عبور | مرکز راهبری کسب‌وکار{% endblock %}
{% block dash_content %}

<div class="dash-page-head dash-fade">
  <div>
    <div class="dash-eyebrow"><i></i> امنیت حساب</div>
    <h1>تغییر رمز عبور</h1>
    <p>رمز عبور حساب خود را به‌صورت جداگانه و امن مدیریت کنید.</p>
  </div>
  <a class="btn btn-secondary" href="{% url 'dashboard' %}">← بازگشت به داشبورد</a>
</div>

<div style="max-width:620px">
  <section class="dash-form-card reveal">
    <div style="display:flex;align-items:center;gap:16px;margin-bottom:18px">
      <div class="dash-action-icon is-security" style="background:rgba(139,92,246,.16);border-color:rgba(139,92,246,.35);color:#d2c1ff">
        <svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.7"><rect x="4" y="10" width="16" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg>
      </div>
      <div><h2 style="margin-bottom:4px">رمز عبور جدید</h2><p class="desc" style="margin:0">پس از تغییر رمز، برای امنیت بیشتر دوباره وارد حساب خود خواهید شد.</p></div>
    </div>
    <form method="post">{% csrf_token %}
      {% for field in password_form %}
      <div class="dash-field" style="margin-bottom:16px">
        <label>{{ field.label }}</label>
        {{ field }}
        {{ field.errors }}
      </div>
      {% endfor %}
      <div class="dash-form-actions">
        <a class="dash-link-muted" href="{% url 'profile' %}">← بازگشت به اطلاعات حساب</a>
        <button class="btn btn-primary" type="submit">تغییر رمز عبور</button>
      </div>
    </form>
  </section>
</div>

{% endblock %}