{% extends "base.html" %}

{% block title %}ویرایش پروفایل — Hamsoo Identity{% endblock %}

{% block content %}
<div class="card">
  <h1>ویرایش پروفایل</h1>
  <p class="sub">ایمیل، موبایل و وضعیت‌های تأیید از این‌جا قابل تغییر نیستند.</p>

  {% if errors %}
    {% for error in errors %}<div class="error">{{ error }}</div>{% endfor %}
  {% endif %}

  <form method="post" novalidate>
    {% csrf_token %}

    <label for="full_name">نام و نام خانوادگی</label>
    <input id="full_name" name="full_name" value="{{ account.full_name|default:'' }}" />

    <div class="grid">
      <div>
        <label for="given_name">نام</label>
        <input id="given_name" name="given_name" value="{{ account.given_name|default:'' }}" />
      </div>
      <div>
        <label for="family_name">نام خانوادگی</label>
        <input id="family_name" name="family_name" value="{{ account.family_name|default:'' }}" />
      </div>
    </div>

    <label for="username">نام کاربری</label>
    <input id="username" name="username" value="{{ account.username|default:'' }}" />
    <div class="hint">حروف کوچک لاتین، رقم و خط تیره.</div>

    <label for="avatar_url">نشانی تصویر پروفایل</label>
    <input id="avatar_url" name="avatar_url" value="{{ account.avatar_url|default:'' }}" />

    <div class="grid">
      <div>
        <label for="gender">جنسیت</label>
        <input id="gender" name="gender" value="{{ account.gender|default:'' }}" />
      </div>
      <div>
        <label for="birth_date">تاریخ تولد</label>
        <input id="birth_date" name="birth_date" type="date" value="{{ account.birth_date|date:'Y-m-d' }}" />
      </div>
      <div>
        <label for="country">کشور</label>
        <input id="country" name="country" value="{{ account.country|default:'' }}" />
      </div>
      <div>
        <label for="province">استان</label>
        <input id="province" name="province" value="{{ account.province|default:'' }}" />
      </div>
      <div>
        <label for="city">شهر</label>
        <input id="city" name="city" value="{{ account.city|default:'' }}" />
      </div>
      <div>
        <label for="locale">زبان</label>
        <select id="locale" name="locale">
          <option value="fa" {% if account.locale == "fa" %}selected{% endif %}>فارسی</option>
          <option value="en" {% if account.locale == "en" %}selected{% endif %}>English</option>
        </select>
      </div>
      <div>
        <label for="timezone">منطقه زمانی</label>
        <input id="timezone" name="timezone" value="{{ account.timezone|default:'UTC' }}" />
      </div>
    </div>

    <label for="skills">مهارت‌ها</label>
    <input id="skills" name="skills" value="{{ skills_joined }}" />
    <div class="hint">با ویرگول جدا کنید.</div>

    <div class="actions">
      <button type="submit">ذخیره</button>
      <a class="btn ghost" href="{% url 'account-home' %}">بازگشت</a>
    </div>
  </form>
</div>
{% endblock %}