{% assign file = page.fileName %}
{% assign lang = page.lang %}
{% assign folder = page.folderName %}
{% assign accessData= site.data[folder][lang][file] %}
{% assign filesData= accessData.display_formats %}

<div>
    <div>
        <ol class="pl-3">
            {%- for i in filesData -%}
            {%- assign item = i | downcase -%}
            {%- assign fileData = site.data.files[accessData.filelang][item] -%}
            {%- assign static = site.static_files -%}
            {%- if fileData.size>0 -%}

            <li class="file-li">
                <h2 class="feature-h1 text-left my-4">{{fileData.Format}}</h2>
                {%- if fileData.fileImg -%}
                <img src="{{fileData.fileImg }}" alt="img" {%- if site.crossorigin -%} crossorigin {%- endif -%}>
                {%- endif -%}
                <ol class="file-info-item-list">
                    {%- if fileData.Pros -%}
                    <li>
                        <div>
                            <div class="info-title">Pros</div>
                            <div>{{fileData.Pros}}</div>
                        </div>
                    </li>
                    {%- endif -%}
                    {%- if fileData.Cons -%}
                    <li>
                        <div>
                            <div class="info-title">Cons</div>
                            <div>{{fileData.Cons}}</div>
                        </div>
                    </li>
                    {%- endif -%}
                    {%- if fileData.BasicInformation -%}
                    <li>
                        <div>
                            <div class="info-title">Basic Information</div>
                            <div>{{fileData.BasicInformation}}</div>
                        </div>
                    </li>

                    {%- endif -%}
                    {%- if fileData.DetailedInformation -%}
                    <li>
                        <div>
                            <div class="info-title">Detailed Information</div>
                            <div>{{fileData.DetailedInformation}}</div>
                        </div>
                    </li>

                    {%- endif -%}
                    {%- if fileData.Softwaresused -%}
                    <div>
                        <div>Platforms Supported</div>
                        <div class="d-flex  flex-wrap ">
                            {%- for item in fileData.Softwaresused -%}
                            <ul class="pl-0 pr-md-5">
                                <li><b>{{item.platform}}</b> </li>
                                <div
                                    class="pl-0 d-flex flex-wrap justify-content-between softwares-section flex-column ">
                                    {%- for data in item.softwares -%}
                                    <div class="d-flex mb-3">
                                        {%- if data.image -%}
                                        <img src={{data.image}} alt="software" loading='lazy' {%- if site.crossorigin
                                            -%} crossorigin {%- endif -%}>
                                        {%- endif -%}
                                        <div>
                                            <a class="d-block software-name" href="{{data.link}}">
                                                <div>{{data.name}}</div>
                                            </a>
                                            <div class="software-value">{{data.type}}</div>
                                        </div>
                                    </div>
                                    {%- endfor -%}
                                </div>
                            </ul>
                            {%- endfor -%}
                        </div>
                    </div>
                    {%- endif -%}
                </ol>

            </li>

            {%- endif -%}
            {%- endfor -%}
        </ol>
    </div>

</div>