{{define "section-skills-summary"}}
<!-- Skills Summary -->
<section id="skills" class="cv-section component-wrapper">
    <!-- Actual Content -->
    <div class="actual-content">
        <details open>
            <summary>
                <h3 class="section-title">
                    <iconify-icon icon="mdi:brain" width="24" height="24" class="section-icon"></iconify-icon>
                    {{.UI.Navigation.Skills}}
                </h3>
            </summary>
        <p class="summary-text">{{.CV.SkillsSummary}}</p>
        </details>
    </div>

    <!-- Skeleton Content -->
    <div class="skeleton-content">
        <div class="skeleton-section">
            <div class="skeleton skeleton-section-title"></div>
            <div class="skeleton skeleton-summary-paragraph"></div>
            <div class="skeleton skeleton-summary-paragraph" style="width: 95%;"></div>
            <div class="skeleton skeleton-summary-paragraph" style="width: 90%;"></div>
            <div class="skeleton skeleton-summary-paragraph" style="width: 85%;"></div>
            <div class="skeleton skeleton-summary-paragraph" style="width: 92%;"></div>
        </div>
    </div>
</section>
{{end}}