{% set arr_ods = component.allOds
  ? craft.entries({
    section: 'odssEntries',
    orderBy: 'postDate ASC'
  }).with(['image']).collect()
  : component.odsEntries.all()
%}

<section {{ dataComponent }} id="{{ id }}" class="insabiOdsSchedule bg-{{ index.index0 }} {{ separation }}">
	<div class="container">
		{% include 'components/_setHeadTitles' %}
		{% if (component.description|length) > 0 %}
			<section class="insabiOdsSchedule__description text-start mb-5">
				{{ component.description }}
			</section>
		{% endif %}
		{% if component.fieldSwitch %}
			{% if (arr_ods|length) > 0 %}
				<section class="col-12 col-lg-11 mx-auto">
					<div class="swiper odsAndSchedule pb-5">
						<div class="swiper-wrapper">
							{% for item in arr_ods %}
								<div class="swiper-slide d-flex justify-content-center flex-column align-items-center">
									{% set img = item.image[0] ?? null %}
									{% if img %}
										<a {{ item.itemLink.getLinkAttributes() }} class="odsAndSchedule__content">
											<img data-src="{{ img.url }}" alt="{{ component.title }}" width="150" height="170px" loading="lazy" class="lazyload img-fluid absolute"/>
										</a>
									{% endif %}
								</div>
							{% endfor %}
						</div>
						<div class="swiper-pagination"></div>
					</div>
				</section>
			{% endif %}
		{% else %}
			<div class="col-lg-10 mx-auto pt-3">
				{% if (arr_ods|length) > 0 %}
					{% for item in arr_ods %}
						<div class="row my-5 my-lg-3 gx-lg-4">
							<section class="col-12 col-lg-3 d-flex flex-column justify-content-center align-items-center">
								{% set img = item.image[0] ?? null %}
								{% if img %}
									<img data-src="{{ img.url }}" width="250" height="250" alt="{{ component.title }}" loading="lazy" class="lazyload img-fluid insabiOdsSchedule__img"/>
								{% endif %}
							</section>
							<section class="col-12 col-lg-9 d-flex flex-column justify-content-center align-items-start insabiOdsSchedule__text">
								{% if
                  (item.title|length) > 0 and (item.description|length) > 0 %}
									<div class="description">
										<strong>{{ item.subtitle }}:</strong>
										{{ item.description }}
									</div>
								{% endif %}
								{% include 'components/_btnArrow' with {
                  btn: item.itemLink,
                  parentClass: 'd-inline-block'
                } only %}
							</section>
						</div>
					{% endfor %}
				{% endif %}
			</div>
		{% endif %}
	</div>
</section>