{% load i18n property_tags %}
{# Échelle visuelle DPE / GES style barreaux #}
<div class="dpe-scale">
  <p class="dpe-scale-label">{% trans "Échelle de performance" %}</p>
  {% for cls in classes %}
  <div class="dpe-bar {% if cls == energy_class %}dpe-active{% endif %}"
       style="background:{{ dpe_colors|get_item:cls }};width:calc(30px + {{ forloop.counter }}*22px)">
    <span>{{ cls }}</span>
    {% if cls == energy_class %}
      <span class="dpe-arrow">◀ {% trans "DPE" %}</span>
    {% endif %}
  </div>
  {% endfor %}
</div>