{% extends "base.html" %}
{% block title %}حذف مشتری — {{ APP_NAME }}{% endblock %}
{% block content %}
<div class="page-header">
  <a class="btn btn-ghost back-btn" href="{{ url_for('customer_account.new') }}">‹ بازگشت</a>
  <h1 class="title">حذف مشتری</h1>
</div>

<form method="get">
<input type="search" name="q" class="search-bar" placeholder="جستجو بر اساس نام، کد مشتری یا شماره تماس ..." value="{{ q }}">
<button type="button" class="btn btn-ghost filter-toggle" onclick="document.querySelector('.filter-col').classList.toggle('open')">فیلترها</button>

<div class="two-col" style="margin-top:16px;">
  <div class="filter-col floating-surface filter-panel">
    <div class="subtitle">فیلترها</div>
    <hr class="divider">

    <div class="filter-field">
      <label>شهر</label>
      <select name="city">
        <option value="">همه شهرها</option>
        {% for c in cities %}<option value="{{ c }}" {% if c == selected_city %}selected{% endif %}>{{ c }}</option>{% endfor %}
      </select>
    </div>

    <div class="filter-field">
      <label>وضعیت</label>
      <select name="status">
        <option value="">همه</option>
        {% for key, label in statuses %}<option value="{{ key }}" {% if key == selected_status %}selected{% endif %}>{{ label }}</option>{% endfor %}
      </select>
    </div>

    <div class="filter-field">
      <label>رتبه مشتری</label>
      <select name="rating">
        <option value="">همه</option>
        {% for r in ratings %}<option value="{{ r }}" {% if r == selected_rating %}selected{% endif %}>{{ r }}</option>{% endfor %}
      </select>
    </div>

    <div class="filter-field">
      <label>مرتب‌سازی</label>
      <select name="sort">
        {% for key, label in sorts %}<option value="{{ key }}" {% if key == selected_sort %}selected{% endif %}>{{ label }}</option>{% endfor %}
      </select>
    </div>

    <div class="filter-actions">
      <button type="submit" class="btn btn-gold">✓ اعمال فیلتر</button>
      <a href="{{ url_for('customer_account.remove') }}" class="btn btn-danger">✕ حذف فیلتر</a>
    </div>
  </div>

  <div class="main-col">
    <div style="display:flex; flex-direction:column; gap:10px;">
      {% for c in results %}
      <div class="glass-card" style="display:flex; align-items:center; gap:14px; padding:10px 16px;">
        <span style="flex:1;">{{ c.first_name }} {{ c.last_name }} — {{ c.city or "-" }} — {{ c.mobile_phone or "-" }}</span>
        <form method="post" action="{{ url_for('customer_account.delete', customer_id=c.id) }}"
              data-confirm="آیا از حذف «{{ c.first_name }} {{ c.last_name }}» مطمئن هستید؟&#10;این مشتری قابل بازیابی توسط مدیر خواهد بود.">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button type="submit" class="btn btn-danger">🗑 حذف</button>
        </form>
      </div>
      {% else %}
      <p class="muted">مشتری‌ای یافت نشد.</p>
      {% endfor %}
    </div>
  </div>
</div>
</form>
{% endblock %}