<?php
/**
 * Фотогалерея (сетка 3 колонки)
 * .bento .pksh-section #gallery
 *
 * @package Dekart
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$data    = Pksh_Data::instance();
$gallery = $data->get_gallery();

if ( empty( $gallery ) || ! is_array( $gallery ) ) {
	return;
}
?>
<section class="bento pksh-section" id="gallery" aria-label="Фотогалерея">
	<div class="bento__full section-header--left">
		<span class="bento-label">Фотогалерея</span>
		<h2 class="bento-h2">Как проходят занятия</h2>
		<p class="bento-p">Фотографии с наших уроков — посмотрите, как увлекательно и продуктивно проходят занятия в центре «Декарт».</p>
	</div>
	<div class="bento__full">
		<div class="pksh-gallery__grid">
			<?php foreach ( $gallery as $item ) :
				$img_id  = $item['gallery_image'] ?? 0;
				$caption = $item['gallery_caption'] ?? '';

				if ( empty( $img_id ) ) {
					continue;
				}

				$img_full  = wp_get_attachment_image_url( $img_id, 'full' );
				$img_thumb = wp_get_attachment_image_url( $img_id, 'medium_large' );
				$img_alt   = $caption ? wp_strip_all_tags( $caption ) : esc_attr__( 'Фото занятия', 'dekart' );

				if ( empty( $img_full ) || empty( $img_thumb ) ) {
					continue;
				}
			?>
			<figure class="pksh-gallery__item">
				<img class="pksh-gallery__img" src="<?php echo esc_url( $img_thumb ); ?>"
					 alt="<?php echo esc_attr( $img_alt ); ?>"
					 loading="lazy" decoding="async">
				<?php if ( $caption ) : ?>
					<figcaption class="pksh-gallery__caption"><?php echo esc_html( $caption ); ?></figcaption>
				<?php endif; ?>
			</figure>
			<?php endforeach; ?>
		</div>
	</div>
</section>
<?php
