{% extends 'platform_admin/base.html' %}
{% load humanize %}

{% block title %}{{ page_title }}{% endblock %}

{% block dash_content %}
{% include 'platform_admin/partials/page_header.html' %}

<div class="job-detail-actions">
  <a href="{% url 'platform_admin:jobs' %}" class="btn btn-outline btn-sm"><i class="fas fa-arrow-left"></i> Back</a>
  <a href="{% url 'platform_admin:edit_job' slug=job.slug %}" class="btn btn-primary btn-sm"><i class="fas fa-pen"></i> Edit Job</a>
  <a href="{% url 'platform_admin:ats' %}?q={{ job.title|urlencode }}" class="btn btn-outline btn-sm"><i class="fas fa-inbox"></i> Applications ({{ application_count|intcomma }})</a>
  <form method="post" action="{% url 'platform_admin:job_toggle' slug=job.slug %}" style="display:inline;">
    {% csrf_token %}
    <input type="hidden" name="next" value="{{ request.get_full_path }}">
    {% if job.is_active and job.is_ongoing and job.accepts_applications %}
    <span class="btn btn-sm btn-outline" style="opacity:0.65;cursor:not-allowed;" title="Ongoing jobs can only be closed by the posting company">
      <i class="fas fa-power-off"></i> Close (company only)
    </span>
    {% else %}
    <button type="submit" class="btn btn-sm {% if job.is_active %}btn-outline{% else %}btn-primary{% endif %}">
      <i class="fas fa-power-off"></i> {% if job.is_active %}Close{% else %}Reopen{% endif %}
    </button>
    {% endif %}
  </form>
  <a href="{{ job.get_absolute_url }}" class="btn btn-outline btn-sm" target="_blank" rel="noopener"><i class="fas fa-external-link-alt"></i> Public</a>
</div>

<div class="two-col">
  <div class="panel" style="padding-bottom:14px;">
    <div class="panel-header" style="margin-bottom:12px;">
      <h3><i class="fas fa-briefcase"></i> Overview</h3>
      {% if job.is_active %}<span class="badge-active">Active</span>{% else %}<span class="badge-suspended">Closed</span>{% endif %}
    </div>
    <div class="job-meta-grid">
      <div><span class="meta-lbl">Company</span><strong>{{ job.company_name|truncatechars:28 }}</strong></div>
      <div><span class="meta-lbl">Location</span><strong>{{ job.location|default:"—"|truncatechars:24 }}</strong></div>
      <div><span class="meta-lbl">Type</span><strong>{{ job.get_job_type_display }}</strong></div>
      <div><span class="meta-lbl">Experience</span><strong>{{ job.experience_display|truncatechars:28 }}</strong></div>
      <div><span class="meta-lbl">Salary</span><strong>{{ job.salary_display }}</strong></div>
      <div><span class="meta-lbl">Posted</span><strong>{{ job.created_at|date:"M j, Y" }}</strong></div>
    </div>
    {% if job.summary %}
    <p style="margin-top:12px;font-size:0.8rem;line-height:1.5;color:var(--text-muted);">{{ job.summary|truncatechars:220 }}</p>
    {% endif %}
  </div>

  <div class="panel table-compact table-panel">
    <div class="panel-header" style="margin-bottom:8px;">
      <h3><i class="fas fa-users"></i> Top applicants</h3>
      {% if application_count > applications|length %}
      <a href="{% url 'platform_admin:ats' %}?q={{ job.title|urlencode }}">View all</a>
      {% endif %}
    </div>
    {% if applications %}
    <table class="data-table">
      <thead>
        <tr><th>Candidate</th><th>Match</th><th>Status</th><th></th></tr>
      </thead>
      <tbody>
        {% for app in applications %}
        <tr>
          <td>
            <div class="candidate-name">{{ app.applicant.get_full_name|default:app.applicant.email|truncatechars:26 }}</div>
          </td>
          <td><strong>{{ app.match_score }}%</strong></td>
          <td><span class="badge-{% if app.status == 'hired' %}approved{% elif app.status == 'rejected' %}suspended{% elif app.status == 'pending' %}pending{% else %}published{% endif %}">{{ app.get_status_display }}</span></td>
          <td><a href="{% url 'platform_admin:application_detail' pk=app.pk %}" class="ra-view" title="Open"><i class="fas fa-arrow-right"></i></a></td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
    {% else %}
    <p style="color:var(--text-muted);font-size:0.82rem;padding:4px 0 8px;">No applications yet.</p>
    {% endif %}
  </div>
</div>

{% if job.description or job.list_items.responsibilities or job.list_items.requirements or job.list_items.benefits %}
<details class="admin-fold">
  <summary><span><i class="fas fa-align-left"></i> Full job content</span></summary>
  <div class="admin-fold-body">
    {% if job.description %}
    <div class="job-text-scroll">{{ job.description|truncatechars:1200 }}</div>
    {% endif %}
    {% if job.list_items.responsibilities or job.list_items.requirements or job.list_items.benefits %}
    <div class="job-lists-row">
      {% if job.list_items.responsibilities %}
      <div>
        <h4>Responsibilities</h4>
        <ul class="job-list-scroll">
          {% for item in job.list_items.responsibilities|slice:":8" %}<li>{{ item|truncatechars:80 }}</li>{% endfor %}
        </ul>
      </div>
      {% endif %}
      {% if job.list_items.requirements %}
      <div>
        <h4>Requirements</h4>
        <ul class="job-list-scroll">
          {% for item in job.list_items.requirements|slice:":8" %}<li>{{ item|truncatechars:80 }}</li>{% endfor %}
        </ul>
      </div>
      {% endif %}
      {% if job.list_items.benefits %}
      <div>
        <h4>Benefits</h4>
        <ul class="job-list-scroll">
          {% for item in job.list_items.benefits|slice:":8" %}<li>{{ item|truncatechars:80 }}</li>{% endfor %}
        </ul>
      </div>
      {% endif %}
    </div>
    {% endif %}
  </div>
</details>
{% endif %}
{% endblock %}