{% assign enrolled_courses = "" %}
{% assign lp_items =  available_lp.items %}

{% if courses.enrolled.any? %}
  {% assign enrolled_courses = courses.enrolled %}
{% endif %}

<div class="learning-path-heading">
  <div class="learning-path-title">{{available_lp.name}} Accreditation</div>
  <div class="learning-path-count">0 / {{ lp_items.count }}</div>
</div>

<a class="learning-path-card not-enrolled" href="{% route learning_path_enrollment, code: available_lp.enrollment_code %}">
  {% for lp_item in lp_items %}
    {% assign course_object = "" %}
    {% for course in enrolled_courses %}
      {% if course.id == lp_item.id %}
        {% assign course_object = course %}
      {% endif %}
    {% endfor %}
    {% if lp_item.course? %}
      {% if lp_item.unlocked? %}
        <div class="learning-path-course">

          {% assign progress_status = "not-started" %}

          {% if lp_item.progress > 0 and lp_item.progress < 100 %}
            {% assign progress_status = "in-progress" %}
          {% endif %}

          {% if lp_item.completed? %}
            {% assign progress_status = "complete" %}
          {% endif %}

          {% if course_object.properties.content_type == "Grey MATTR" %}
            <div class="content-type-img grey-mattr {{progress_status}}"></div>
          {% elsif course_object.properties.content_type == "Dark MATTR" %}
            <div class="content-type-img dark-mattr {{progress_status}}"></div>
          {% elsif course_object.properties.content_type == "Blue MATTR" %}
            <div class="content-type-img blue-mattr {{progress_status}}"></div>
          {% endif %}
          {{lp_item.name}}
        </a>
      {% else %}
        <div class="learning-path-course lp-course-locked">
          <div class="lock-img"></div>
          {{lp_item.name}}
        </div>
      {% endif %}
    {% endif %}
  {% endfor %}
  <div class="enroll-btn">Enroll in {{available_lp.name}}</div>
</a>