{% load evelinks %}
{% load humanize %}
{% load l10n %}

<div class="pilot-popover-card">
    <div class="d-flex align-items-center gap-2 mb-2">
        <img src="{{ pilot.character.eve_character|character_portrait_url:64 }}" class="rounded-circle" width="40" height="40" alt="{{ pilot.character.eve_character.character_name }}">
        <div>
            <div class="small fw-semibold">{{ pilot.character.eve_character.character_name }}</div>
            <div class="small text-muted">{{ status_label }}</div>
        </div>
    </div>

    <div class="small text-muted mb-1">Required {{ pilot.progress.required_pct }}% · {{ pilot.required_missing_sp|intcomma }} SP missing</div>
    <div class="progress mb-2" style="height: 6px;">
        <div class="progress-bar bg-success" role="progressbar" style="width: {{ pilot.progress.required_pct|unlocalize }}%"></div>
    </div>

    <div class="small text-muted mb-1">Recommended {{ pilot.progress.recommended_pct }}% · {{ pilot.recommended_missing_sp|intcomma }} SP missing</div>
    <div class="progress mb-2" style="height: 6px;">
        <div class="progress-bar bg-primary" role="progressbar" style="width: {{ pilot.progress.recommended_pct|unlocalize }}%"></div>
    </div>

    <a class="btn btn-sm btn-outline-{{ focus_btn }} w-100" href="{% url 'mastery:pilot_fitting_detail' fitting.id %}?character_id={{ pilot.character.id }}&character_filter={{ focus_filter }}&export_mode={{ export_mode }}&group_id={{ selected_group.id }}&activity_days={{ activity_days }}{% if include_inactive %}&include_inactive=1{% endif %}">
        <span class="fas fa-external-link-alt me-1" aria-hidden="true"></span>Open pilot focus
    </a>
</div>