{{define "section-courses"}}
<!-- Courses Section -->
{{if .CV.Courses}}
<section id="courses" class="cv-section">
    <details open>
        <summary>
            <h3 class="section-title">
                <iconify-icon icon="mdi:school" width="24" height="24" class="section-icon"></iconify-icon>
                {{if eq .Lang "es"}}Cursos Realizados{{else}}Courses{{end}}
            </h3>
        </summary>
    {{range .CV.Courses}}
    <div class="course-item">
        {{if .CourseLogo}}
        <div class="course-icon">
            <img src="/static/images/courses/{{.CourseLogo}}" alt="{{.Title}} logo" onerror="this.parentElement.innerHTML='<iconify-icon icon=\'mdi:school\' width=\'80\' height=\'80\' class=\'default-course-icon\'></iconify-icon>'">
        </div>
        {{else}}
        <div class="course-icon">
            <iconify-icon icon="mdi:school" width="80" height="80" class="default-course-icon"></iconify-icon>
        </div>
        {{end}}
        <div class="course-content">
            <strong>{{.Title}}</strong><br>
            <small>{{.Institution}} - {{.Date}} - ({{.Location}})</small>

            {{if .ShortDescription}}
            <p class="course-desc short-desc">{{.ShortDescription}}</p>
            {{end}}

            {{if .Responsibilities}}
            <ul class="responsibilities long-only">
                {{range .Responsibilities}}
                <li>{{. | safeHTML}}</li>
                {{end}}
            </ul>
            {{end}}
        </div>
    </div>
    {{end}}
    </details>
</section>
{{end}}
{{end}}