{% load i18n %}
<h5> {% trans "AI Score" %}: <span class="badge bg-success"><i class="fas fa-robot me-1"></i> {{ candidate.match_score }}%</span>   <span class="badge bg-success"><i class="fas fa-graduation-cap me-1"></i> {{ candidate.professional_category }} </span></h5>

<div class="row mb-3">
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-briefcase me-2 text-primary"></i>
            <small class="text-muted">{% trans "Job Fit" %}</small>
        </div>
        <p class="mb-1">{{ candidate.job_fit_narrative }}</p>
    </div>
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-star me-2 text-warning"></i>
            <small class="text-muted">{% trans "Top Keywords" %}</small>
        </div>
        <div class="d-flex flex-wrap gap-1">
            {% for keyword in candidate.top_3_keywords %}
            <span class="badge bg-info text-dark me-1">{{ keyword }}</span>
            {% endfor %}
        </div>
    </div>
</div>

<div class="row mb-3">
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-clock me-2 text-info"></i>
            <small class="text-muted">{% trans "Experience" %}</small>
        </div>
        <p class="mb-1"><strong>{{ candidate.years_of_experience }}</strong> {% trans "years" %}</p>
        <p class="mb-0"><strong>{% trans "Recent Role:" %}</strong> {{ candidate.most_recent_job_title }}</p>
    </div>
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-chart-line me-2 text-success"></i>
            <small class="text-muted">{% trans "Skills" %}</small>
        </div>
        <p class="mb-1"><strong>{% trans "Soft Skills:" %}</strong> {{ candidate.soft_skills_score }}%</p>
        <p class="mb-0"><strong>{% trans "Industry Match:" %}</strong>
            <span class="badge {% if candidate.industry_match_score >= 70 %}bg-success{% elif candidate.industry_match_score >= 40 %}bg-warning{% else %}bg-danger{% endif %}">
                {{ candidate.industry_match_score }}%
            </span>
        </p>
    </div>
</div>

<div class="mb-3">
    <label class="form-label"><i class="fas fa-comment me-1 text-info"></i> {% trans "Recommendation" %}</label>
    <textarea class="form-control" rows="6" readonly>{{ candidate.recommendation }}</textarea>
</div>

<div class="mb-3">
    <label class="form-label"><i class="fas fa-thumbs-up me-1 text-success"></i> {% trans "Strengths" %}</label>
    <textarea class="form-control" rows="4" readonly>{{ candidate.strengths }}</textarea>
</div>

<div class="mb-3">
    <label class="form-label"><i class="fas fa-thumbs-down me-1  text-danger"></i> {% trans "Weaknesses" %}</label>
    <textarea class="form-control" rows="4" readonly>{{ candidate.weaknesses }}</textarea>
</div>

<div class="mb-3">
    <label class="form-label"><i class="fas fa-list-check me-1"></i> {% trans "Criteria Assessment" %}</label>
    <div class="table-responsive">
        <table class="table table-sm">
            <thead>
                <tr>
                    <th>{% trans "Criteria" %}</th>
                    <th>{% trans "Status" %}</th>
                </tr>
            </thead>
            <tbody>
                {% for criterion, status in candidate.criteria_checklist.items %}
                <tr>
                    <td>{{ criterion }}</td>
                    <td>
                        {% if status == "Met" %}
                            <span class="badge bg-success"><i class="fas fa-check me-1"></i> {% trans "Met" %}</span>
                        {% elif status == "Not Met" %}
                            <span class="badge bg-danger"><i class="fas fa-times me-1"></i> {% trans "Not Met" %}</span>
                        {% else %}
                            <span class="badge bg-secondary">{{ status }}</span>
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

<div class="row mb-3">
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-check-circle me-2 text-success"></i>
            <small class="text-muted">{% trans "Minimum Requirements" %}</small>
        </div>
        {% if candidate.min_requirements_met %}
            <span class="badge bg-success">{% trans "Met" %}</span>
        {% else %}
            <span class="badge bg-danger">{% trans "Not Met" %}</span>
        {% endif %}
    </div>
    <div class="col-md-6">
        <div class="d-flex align-items-center mb-2">
            <i class="fas fa-star me-2 text-warning"></i>
            <small class="text-muted">{% trans "Screening Rating" %}</small>
        </div>
        <span class="badge bg-secondary">{{ candidate.screening_stage_rating }}</span>
    </div>
</div>

{% if candidate.language_fluency %}
<div class="mb-3">
    <label class="form-label"><i class="fas fa-language me-1 text-info"></i> {% trans "Language Fluency" %}</label>
    <div class="d-flex flex-wrap gap-2">
        {% for language in candidate.language_fluency %}
        <span class="badge bg-light text-dark">{{ language }}</span>
        {% endfor %}
    </div>
</div>
{% endif %}
