{% extends "ui/templates/base/layout.html" %}
{% block content %}
<div class="space-y-6">
  <div class="flex flex-wrap items-center justify-between gap-3">
    <div>
      <h2 class="text-xl font-semibold text-slate-900">Conversion Request: {{ managed_client.client_name }}</h2>
      <p class="text-sm text-slate-500">Consultant: {{ consultant.firm_name or consultant.contact_person if consultant else '-' }}</p>
    </div>
    <a href="/consultants/conversion-requests" class="rounded-xl border border-slate-300 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50">Back</a>
  </div>

  {% if errors %}
  <div class="rounded-2xl border border-red-200 bg-red-50 p-4 text-sm text-red-700 shadow-soft">
    {% for error in errors %}<div>{{ error }}</div>{% endfor %}
  </div>
  {% endif %}

  <div class="rounded-2xl border border-slate-200 bg-white p-5 shadow-soft">
    <h3 class="font-semibold text-slate-900">Managed Client Details</h3>
    <div class="mt-4 grid gap-4 text-sm md:grid-cols-3">
      <div><div class="text-xs uppercase tracking-wide text-slate-500">Client Code</div><div class="font-medium text-slate-900">{{ managed_client.client_code or '-' }}</div></div>
      <div><div class="text-xs uppercase tracking-wide text-slate-500">Client Type</div><div class="font-medium text-slate-900">{{ managed_client.client_type }}</div></div>
      <div><div class="text-xs uppercase tracking-wide text-slate-500">Conversion Status</div><div class="font-medium text-slate-900">{{ managed_client.conversion_status.replace('_',' ').title() }}</div></div>
      <div><div class="text-xs uppercase tracking-wide text-slate-500">PAN</div><div class="font-medium text-slate-900">{{ managed_client.pan or '-' }}</div></div>
      <div><div class="text-xs uppercase tracking-wide text-slate-500">GSTIN</div><div class="font-medium text-slate-900">{{ managed_client.gstin or '-' }}</div></div>
      <div><div class="text-xs uppercase tracking-wide text-slate-500">Mobile / Email</div><div class="font-medium text-slate-900">{{ managed_client.mobile or managed_client.email or '-' }}</div></div>
    </div>
    <div class="mt-4 grid gap-4 md:grid-cols-2">
      <div class="rounded-xl bg-slate-50 p-3 text-sm text-slate-700"><strong>Consultant notes</strong><br>{{ managed_client.conversion_notes or '-' }}</div>
      <div class="rounded-xl bg-slate-50 p-3 text-sm text-slate-700"><strong>Firm notes</strong><br>{{ managed_client.conversion_firm_notes or '-' }}</div>
    </div>
  </div>

  {% if managed_client.linked_firm_client %}
  <div class="rounded-2xl border border-emerald-200 bg-emerald-50 p-5 text-sm text-emerald-900 shadow-soft">
    Already converted and linked to firm client: <strong>{{ managed_client.linked_firm_client.client_code }} — {{ managed_client.linked_firm_client.client_name }}</strong>
  </div>
  {% else %}
  <form method="post" action="/consultants/conversion-requests/{{ managed_client.id }}/review" class="rounded-2xl border border-slate-200 bg-white p-5 shadow-soft">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <h3 class="font-semibold text-slate-900">Firm Review</h3>
    <div class="mt-4 grid gap-4 md:grid-cols-3">
      <div>
        <label class="text-sm font-semibold text-slate-700">Action</label>
        <select name="action" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm" required>
          <option value="under_review">Mark Under Review</option>
          <option value="approve">Approve & Create Firm Client</option>
          <option value="reject">Reject</option>
        </select>
      </div>
      <div>
        <label class="text-sm font-semibold text-slate-700">Firm Client Code</label>
        <input name="client_code" value="FC-{{ managed_client.client_code or managed_client.id }}" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">
        <p class="mt-1 text-xs text-slate-500">Used only when approving.</p>
      </div>
      <div>
        <label class="text-sm font-semibold text-slate-700">Partner User ID</label>
        <input name="partner_user_id" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm" placeholder="Optional">
        <p class="mt-1 text-xs text-slate-500">Optional for now. You can assign partner later from client master.</p>
      </div>
    </div>
    <div class="mt-4">
      <label class="text-sm font-semibold text-slate-700">Firm Notes / Reason</label>
      <textarea name="firm_notes" rows="4" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></textarea>
    </div>
    <button class="mt-4 rounded-xl bg-brand-600 px-4 py-2 text-sm font-semibold text-white hover:bg-brand-700">Save Review</button>
  </form>
  {% endif %}
</div>
{% endblock %}