{{# Festivals Index Template #}}
{{# Also used by ftfkids and production with different collection names #}}
{{ layout = 'layouts/default' }}

{{# Define collection name based on current URI #}}
{{ collection_name = 'festivals' }}
{{ if segment_1 == 'ftfkids' }}{{ collection_name = 'ftfkids' }}{{ /if }}
{{ if segment_1 == 'production' }}{{ collection_name = 'productions' }}{{ /if }}

{{# COVER VIDEO/IMAGE #}}
{{ if cover_video or cover_image }}
<section class="page-cover-section">
    {{ partial:partials/cover-media }}
</section>
{{ /if }}

{{# MAIN CONTENT SECTION #}}
<section class="festivals-index-section py-5">
    <div class="container g-0 bg-white">
        <div class="row">

            {{# Left: Logo #}}
            <div class="col-lg-auto col-2 d-none d-lg-flex flex-column align-items-start justify-content-center px-lg-5">
                <div class="w-100 bg-white px-3 py-5 mb-4">
                    <h2 class="m-0 lh-1 text-center fw-light text-uppercase">{{ title }}</h2>
                </div>
                <div class="collection-logo-wrap {{ if banner_image }} is-banner {{/if}} festivals-logo-wrap position-sticky" style="top: 100px;background-color: {{ theme_color_1 ?? 'var(--bs-primary)' }};">
                    {{ if banner_image }}
                        {{ if banner_link }}
                        <a href="{{ banner_link }}" class="d-block w-100">
                            <img src="{{ banner_image }}" alt="{{ title }} Banner" class="img-fluid w-100">
                        </a>
                        {{ else }}
                        <img src="{{ banner_image }}" alt="{{ title }} Banner" class="img-fluid w-100">
                        {{ /if }}
                    {{ else }}
                    <div class="collection-logo-placeholder p-4 d-flex align-items-center justify-content-center" style="">
                        <svg width="100%" height="auto" viewBox="0 0 70 83" xmlns="http://www.w3.org/2000/svg">
                            <path d="M35.7782 50.5566C34.6034 49.3874 33.6664 48.0015 33.0193 46.4756C32.3761 44.9541 32.048 43.318 32.0548 41.6662V29.3491C33.0356 30.7692 34.4447 31.8385 36.0763 32.4011C37.7079 32.9637 39.4766 32.99 41.1242 32.4763C42.7719 31.9626 44.2122 30.9357 45.2349 29.5455C46.2577 28.1553 46.8093 26.4746 46.8093 24.7488C46.8093 23.0229 46.2577 21.3422 45.2349 19.952C44.2122 18.5618 42.7719 17.5349 41.1242 17.0212C39.4766 16.5075 37.7079 16.5339 36.0763 17.0964C34.4447 17.659 33.0356 18.7284 32.0548 20.1484V0H23.5893V41.6662C23.5602 45.3769 24.5519 49.0242 26.4561 52.2092C28.2889 55.4196 30.9401 58.0867 34.1394 59.9387C37.3388 61.7908 40.9719 62.7616 44.6686 62.7522V54.2868C43.0171 54.2902 41.3816 53.9622 39.8591 53.3222C38.3327 52.6731 36.9467 51.7338 35.7782 50.5566Z" fill="{{ theme_color_2 ?? 'var(--bs-secondary)' }}"></path>
                            <path d="M14.989 49.9224C13.7169 49.9226 12.4628 50.2226 11.3283 50.798C10.1939 51.3734 9.21101 52.2081 8.45944 53.2344V39.3727C8.46579 36.0082 9.80744 32.7839 12.1896 30.4081C13.3564 29.2424 14.7468 28.3246 16.2773 27.7099C17.8025 27.0904 19.4338 26.7742 21.08 26.7791V18.2867C17.3781 18.2561 13.7362 19.2231 10.537 21.086C7.34111 22.9428 4.6839 25.6 2.82705 28.7959C0.946034 32.0012 -0.0307242 35.6564 0.000736686 39.3727V82.8331H8.45944V62.8263C9.28025 63.9375 10.3718 64.8201 11.6301 65.3901C12.8885 65.9601 14.2718 66.1986 15.6484 66.0828C17.025 65.9671 18.349 65.5009 19.4945 64.7288C20.64 63.9566 21.5688 62.9041 22.1926 61.6715C22.8163 60.4389 23.1142 59.0671 23.0578 57.6868C23.0015 56.3066 22.5929 54.9636 21.8708 53.7859C21.1487 52.6082 20.1372 51.6349 18.9326 50.9586C17.728 50.2824 16.3704 49.9257 14.989 49.9224Z" fill="{{ theme_color_2 ?? 'var(--bs-secondary)' }}"></path>
                            <path d="M61.9233 50.5565C60.6218 50.5567 59.3396 50.8707 58.1853 51.4719C57.031 52.0732 56.0387 52.9438 55.2926 54.0101V39.3727C55.2989 36.0082 56.6406 32.7839 59.0228 30.4081C60.1896 29.2424 61.58 28.3246 63.1105 27.7099C64.6356 27.0904 66.267 26.7742 67.9132 26.7791V18.2867C64.2112 18.2561 60.5694 19.2231 57.3702 21.086C54.1742 22.9428 51.517 25.6 49.6602 28.7959C47.7792 32.0012 46.8024 35.6564 46.8339 39.3727V82.8331H55.2926V63.3322C56.0935 64.4669 57.1729 65.3765 58.427 65.9733C59.6811 66.5702 61.0677 66.8343 62.4534 66.7403C63.8391 66.6463 65.1774 66.1973 66.3394 65.4365C67.5014 64.6758 68.448 63.6288 69.0884 62.3963C69.7287 61.1638 70.0412 59.7873 69.9957 58.3992C69.9502 57.011 69.5482 55.6579 68.8285 54.4701C68.1088 53.2822 67.0956 52.2995 65.8863 51.6164C64.6769 50.9334 63.3122 50.573 61.9233 50.57V50.5565Z" fill="{{ theme_color_2 ?? 'var(--bs-secondary)' }}"></path>
                        </svg>
                    </div>
                    {{ /if }}
                </div>
            </div>

            {{# Right: Grid of posts 2 per row #}}
            <div class="col-lg col-10">
                <div class="row g-0" id="festivals-grid">

                    {{ collection:{collection_name}
                        orderby="date:desc"
                        paginate:by="8"
                        as="items"
                    }}
                    {{ items }}
                    <div class="col-md-6">
                        <article class="festival-card h-100">
                            <a href="{{ url }}" class="card-link d-block h-100 text-decoration-none">
                                <div class="row g-0 h-100 align-items-stretch">
                                    <div class="col-9">
                                        <div class="h-100 overflow-hidden">
                                            {{ if featured_image }}
                                            <img src="{{ featured_image }}" alt="{{ title }}" class="festival-card-img img-fluid w-100 d-block">
                                            {{ else }}
                                            <div class="festival-card-img-placeholder h-100 d-flex align-items-center justify-content-center" style="background-color: {{ view:theme_color_1 ?? 'var(--bs-secondary)' }};">
                                                <svg height="70" viewBox="0 0 70 83" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M35.7782 50.5566C34.6034 49.3874 33.6664 48.0015 33.0193 46.4756C32.3761 44.9541 32.048 43.318 32.0548 41.6662V29.3491C33.0356 30.7692 34.4447 31.8385 36.0763 32.4011C37.7079 32.9637 39.4766 32.99 41.1242 32.4763C42.7719 31.9626 44.2122 30.9357 45.2349 29.5455C46.2577 28.1553 46.8093 26.4746 46.8093 24.7488C46.8093 23.0229 46.2577 21.3422 45.2349 19.952C44.2122 18.5618 42.7719 17.5349 41.1242 17.0212C39.4766 16.5075 37.7079 16.5339 36.0763 17.0964C34.4447 17.659 33.0356 18.7284 32.0548 20.1484V0H23.5893V41.6662C23.5602 45.3769 24.5519 49.0242 26.4561 52.2092C28.2889 55.4196 30.9401 58.0867 34.1394 59.9387C37.3388 61.7908 40.9719 62.7616 44.6686 62.7522V54.2868C43.0171 54.2902 41.3816 53.9622 39.8591 53.3222C38.3327 52.6731 36.9467 51.7338 35.7782 50.5566Z" fill="#fff"></path>
                                                    <path d="M14.989 49.9224C13.7169 49.9226 12.4628 50.2226 11.3283 50.798C10.1939 51.3734 9.21101 52.2081 8.45944 53.2344V39.3727C8.46579 36.0082 9.80744 32.7839 12.1896 30.4081C13.3564 29.2424 14.7468 28.3246 16.2773 27.7099C17.8025 27.0904 19.4338 26.7742 21.08 26.7791V18.2867C17.3781 18.2561 13.7362 19.2231 10.537 21.086C7.34111 22.9428 4.6839 25.6 2.82705 28.7959C0.946034 32.0012 -0.0307242 35.6564 0.000736686 39.3727V82.8331H8.45944V62.8263C9.28025 63.9375 10.3718 64.8201 11.6301 65.3901C12.8885 65.9601 14.2718 66.1986 15.6484 66.0828C17.025 65.9671 18.349 65.5009 19.4945 64.7288C20.64 63.9566 21.5688 62.9041 22.1926 61.6715C22.8163 60.4389 23.1142 59.0671 23.0578 57.6868C23.0015 56.3066 22.5929 54.9636 21.8708 53.7859C21.1487 52.6082 20.1372 51.6349 18.9326 50.9586C17.728 50.2824 16.3704 49.9257 14.989 49.9224Z" fill="#fff"></path>
                                                    <path d="M61.9233 50.5565C60.6218 50.5567 59.3396 50.8707 58.1853 51.4719C57.031 52.0732 56.0387 52.9438 55.2926 54.0101V39.3727C55.2989 36.0082 56.6406 32.7839 59.0228 30.4081C60.1896 29.2424 61.58 28.3246 63.1105 27.7099C64.6356 27.0904 66.267 26.7742 67.9132 26.7791V18.2867C64.2112 18.2561 60.5694 19.2231 57.3702 21.086C54.1742 22.9428 51.517 25.6 49.6602 28.7959C47.7792 32.0012 46.8024 35.6564 46.8339 39.3727V82.8331H55.2926V63.3322C56.0935 64.4669 57.1729 65.3765 58.427 65.9733C59.6811 66.5702 61.0677 66.8343 62.4534 66.7403C63.8391 66.6463 65.1774 66.1973 66.3394 65.4365C67.5014 64.6758 68.448 63.6288 69.0884 62.3963C69.7287 61.1638 70.0412 59.7873 69.9957 58.3992C69.9502 57.011 69.5482 55.6579 68.8285 54.4701C68.1088 53.2822 67.0956 52.2995 65.8863 51.6164C64.6769 50.9334 63.3122 50.573 61.9233 50.57V50.5565Z" fill="#fff"></path>
                                                </svg>
                                            </div>
                                            {{ /if }}
                                        </div>
                                    </div>
                                    <div class="col-3 bg-light d-flex justify-content-center p-3">
                                        {{ if date }}
                                        <div class="text-center h4 fw-light">{{ date format="Y" }}</div>
                                        {{ /if }}
                                    </div>
                                    <div class="col-12 bg-white p-3">
                                        <h3 class="m-0 fw-light">{{ title }}</h3>
                                    </div>
                                </div>
                            </a>
                        </article>
                    </div>
                    {{ /items }}

                    {{ /collection:{collection_name} }}

                </div>

                {{# Pagination #}}
                {{ if paginate }}
                <div class="pagination-wrap mt-5 d-flex justify-content-center">
                    {{ if paginate:prev_page }}
                    <a href="{{ paginate:prev_page_url }}" class="btn btn-outline-secondary me-2">&laquo; Previous</a>
                    {{ /if }}
                    {{ if paginate:next_page }}
                    <a href="{{ paginate:next_page_url }}" class="btn btn-outline-secondary ms-2">Next &raquo;</a>
                    {{ /if }}
                </div>
                {{ /if }}

            </div>
        </div>
    </div>
</section>