<?php
if (function_exists('render_block_preview_image') && render_block_preview_image($block, 'Text With Arrow Card Preview')) {
    return;
}
$className = 'progress-section sk-section-spacing ' . ($block['className'] ?? '');
?>
<section class="<?php echo esc_attr(trim($className)); ?>">
    <div class="container">
        <?php
        $heading = get_field('heading');
        $description = get_field('description');
        if ((isset($heading) && !empty($heading)) || (isset($description) && !empty($description))) :
        ?>
            <div class="progress-section-heading">
                <?php if (isset($heading) && !empty($heading)) : ?>
                    <h2><?php echo esc_html($heading); ?></h2>
                <?php endif; ?>
                <?php if (isset($description) && !empty($description)) : ?>
                    <?php echo wp_kses_post($description); ?>
                <?php endif; ?>
            </div>
        <?php endif; ?>
        <?php if (have_rows('experience_cards')) : ?>
            <div class="progress-cards-wrapper">
                <?php while (have_rows('experience_cards')) : the_row(); ?>
                    <div class="progress-card">
                        <div class="progress-card-content">
                            <?php $card_image = get_sub_field('card_image');
                            if (isset($card_image) && !empty($card_image)) : ?>
                                <div class="progress-card-icon"> <img src="<?php echo esc_url($card_image['url']);  ?>"
                                        alt="<?php echo (isset($cardimage['alt']) && !empty($cardimage['alt'])) ? esc_attr($cardimage['alt']) : ''; ?>">
                                </div> <?php endif; ?>
                            <h4>
                                <?php
                                $card_heading = get_sub_field('card_heading');
                                if (isset($card_heading) && !empty($card_heading)) {
                                    echo esc_html($card_heading);
                                }
                                ?>
                                <?php
                                $card_image1 = get_sub_field('card_image1');
                                if (isset($card_image1) && !empty($card_image1)) :
                                ?>
                                    <img decoding="async" src="<?php echo esc_url($card_image1['url']); ?>" alt="<?php echo (isset($card_image1['alt']) && !empty($card_image1['alt'])) ? esc_attr($card_image1['alt']) : ''; ?>">
                                <?php endif; ?>
                            </h4>
                            <?php
                            $card_description = get_sub_field('card_description');
                            if (isset($card_description) && !empty($card_description)) :
                            ?>
                                <?php echo wp_kses_post($card_description); ?>
                            <?php endif; ?>
                        </div>
                    </div>
                <?php endwhile; ?>
            </div>
        <?php endif; ?>
    </div>
</section>