
{% if basic_3p_user %}
  {% assign lpitems = learning_paths.enrolled %}
{% else %}  
  {% assign lpitems = learning_paths.available %}
{% endif %}
{% assign lpcounter = 0 %}
{% assign fcounter = 0 %}
{% if basic_3p_user %}
  {% for learning_path in  lpitems %}
    {% assign has_certificate_category = false %}
    {% for cat in learning_path.categories %}
      {% if cat.name == "Certifications" %}
        {% assign has_certificate_category = true %}        
      {% endif %}
    {% endfor %}              
    {% if has_certificate_category == true %}
      {% assign lpcounter = lpcounter | plus: 1 %}    
        <a href="app/learning_paths/{{learning_path.id}}" style="text-decoration: unset;" data-lpcat="Free Learning Path Basic User">
          <div class="content-catds">
            <div class="content-catds-text">
              {{ learning_path.name }} 
            </div>  
            <div class="content-arrow"><i class="far fa-chevron-right"></i></div>
          </div>
        </a>     
    {% endif %}
  {% endfor %}
  {% for item in catalog.items %}   
    {% if item.type == "learning_path" %}    
      {% assign lpcounter = lpcounter | plus: 1 %}
      <a  href="{{ item.path }}" style="text-decoration: unset;" data-lpcat="LP to Purchase">
        <div class="content-catds">
          <div class="content-catds-text">
            {{ item.name }}
          </div>  
          <div class="content-arrow"><i class="far fa-chevron-right"></i></div>
        </div>
      </a>        
    {% endif %}
  {% endfor %}    
{% else %}
  {% for learning_path in  lpitems %}
      {% if learning_path.has_certificate? == true %}
        {% assign lpcounter = lpcounter | plus: 1 %}
        <div class="">
        <a href="app/learning_paths/{{learning_path.id}}" style="text-decoration: unset;" data-lpcat="Free Learning Path Non Basic user">
          <div class="content-catds">
            <div class="content-catds-text">
              {{ learning_path.name }} 
            </div>  
            <div class="content-arrow"><i class="far fa-chevron-right"></i></div>
          </div>
        </a>  
        </div>
      {% endif %}
  {% endfor %}
{% endif %}
{% if lpcounter == 0 %}
  <div class="np-dashboard-resources">
    <div class="content-catds">
      <div class="content-catds-text">
        Check Back Soon
      </div>
    </div>
  </div>
{% endif %}
<style>

.content-catds {
    border: 2px solid #bac4ca;
    border-radius: 10px;
    /* padding: 5px; */
    text-align: left;
    margin: 15px;
    display: flex;
    justify-content: space-between;
    /* align-content: stretch; */
    flex-wrap: nowrap;
    align-items: center;
    height: 45px;
}
.content-catds:hover {
  background-color: lightgray;
  cursor: pointer;
}

.content-catds-text {
    color: #333;
    padding-left: 20px;
    font-size: 16px;
    /* margin-bottom: 24px; */
    /* height: 30px; */
    /* padding-top: 5px; */
    
}

.content-arrow {
    padding-top: 5px;
    background-color: #ebe8f3;
    /* height: 30px; */
    width: 50px;
    border-radius: 0px 10px 10px 0px;
    height: 42px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: purple;
}

</style>
