{% extends "base.html" %}
{% load i18n %}

{% block sidebar %}

<!-- ── Niveau 1 : Interventions correctives ───────────── -->
<div class="d-flex align-items-center px-2 pt-2 pb-1 mt-1"
     style="cursor:default; pointer-events:none;">
    <i class="bi bi-wrench text-primary" style="font-size:.95rem;"
       data-bs-toggle="tooltip" data-bs-placement="right"
       title="{% translate 'Interventions correctives' %}"></i>
    <span class="ms-2 text d-none d-md-inline fw-bold text-dark"
          style="font-size:.85rem; letter-spacing:.03em;">
        {% translate "Interventions correctives" %}
    </span>
</div>

<!-- ── Niveau 2 ────────────────────────────────────── -->
<a href="{% url 'reporting:dashboard' %}"
   class="nav-link d-flex align-items-center py-1 px-2 ps-4
          {% if request.path == '/reporting/' %}active{% endif %}"
   style="font-size:.82rem;">
    <i class="bi bi-clock-history" style="font-size:.85rem;"
       data-bs-toggle="tooltip" data-bs-placement="right"
       title="{% translate 'Temps de traitement' %}"></i>
    <span class="ms-2 text d-none d-md-inline">{% translate "Temps de traitement" %}</span>
</a>

<a href="{% url 'reporting:volume-dashboard' %}"
   class="nav-link d-flex align-items-center py-1 px-2 ps-4
          {% if request.path == '/reporting/volume/' %}active{% endif %}"
   style="font-size:.82rem;">
    <i class="bi bi-bar-chart-line" style="font-size:.85rem;"
       data-bs-toggle="tooltip" data-bs-placement="right"
       title="{% translate "Nombre d'interventions" %}"></i>
    <span class="ms-2 text d-none d-md-inline">{% translate "Nombre d'interventions" %}</span>
</a>

<!-- ── Niveau 1 : Observations ───────────── -->
<div class="d-flex align-items-center px-2 pt-3 pb-1 mt-2"
     style="cursor:default; pointer-events:none;">
    <i class="bi bi-eye text-primary" style="font-size:.95rem;"
       data-bs-toggle="tooltip" data-bs-placement="right"
       title="{% translate 'Observations' %}"></i>
    <span class="ms-2 text d-none d-md-inline fw-bold text-dark"
          style="font-size:.85rem; letter-spacing:.03em;">
        {% translate "Observations" %}
    </span>
</div>

<!-- ── Niveau 2 ────────────────────────────────────── -->
<a href="{% url 'reporting:observations-dashboard' %}"
   class="nav-link d-flex align-items-center py-1 px-2 ps-4
          {% if request.path == '/reporting/observations/' %}active{% endif %}"
   style="font-size:.82rem;">
    <i class="bi bi-bar-chart-line" style="font-size:.85rem;"
       data-bs-toggle="tooltip" data-bs-placement="right"
       title="{% translate "Nombre d'observations" %}"></i>
    <span class="ms-2 text d-none d-md-inline">{% translate "Nombre d'observations" %}</span>
</a>

{% endblock sidebar %}