{% comment %} <div class="np-learning-path-outline">
                {% for item in learning_path.items %}
                  {% if item.course? %}
                    {% include "learning_path_course"
                      , course: item %}
                  {% elsif item.training_event? %}
                    {% include "learning_path_training_session"
                      , training_session: item %}
                  {% endif %}
                {% endfor %}
                {% include "learning_path_certificate" %}
</div> {% endcomment %}

<div class="np-course-outline">
  <div class="np-text-title np-course-outline-title">
    <span class="lang-en">Outline</span>
    <span class="lang-es">Plan de estudio</span>
  </div>
  <div class="np-course-outline-content">
    <ol class="np-course-outline-content-section">

      <li class="np-course-outline-content-section-list">
        <ol class="np-course-outline-content-activity">
          {% for item in learning_path.items %}
            {% if item.course? %}
              <li class="np-course-outline-content-activity-list">
                {% if item.completed? %}
                  <i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
                  {% if item.locked? %}
                    {% include "path_activity_locked" %}
                  {% else %}
                    {% include "path_activity_unlocked"
                      , class: "np-course-outline-content-activity-link-completed" %}
                  {% endif %}
                  <div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
                {% else %}
                  <i class="far fa-circle np-course-outline-content-activity-icon"></i>
                  {% if item.locked? %}
                    {% include "path_activity_locked" %}
                  {% else %}
                    {% include "path_activity_unlocked"
                      , class: "np-course-outline-content-activity-link" %}
                  {% endif %}
                  <div class="np-course-outline-content-activity-list-bar"></div>
                {% endif %}
              </li>
            {% endif %}
          {% endfor %}
        </ol>
      </li>
    </ol>
  </div>
</div>