<?php


/**
 * The Template for displaying product archives, including the main shop page which is a post type archive
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.4.0
 */
defined('ABSPATH') || exit;
get_header('shop');


/**
 * Hook: woocommerce_before_main_content.
 *
 * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
 * @hooked woocommerce_breadcrumb - 20
 * @hooked WC_Structured_Data::generate_website_data() - 30
 */
 $product_categories = $terms = get_terms( 'product_cat', array(
    'hide_empty' => false,
));

if($product_categories && is_array($product_categories)) {
    $product_categories = array_filter($product_categories, function($category) {
        return $category->slug !== "uncategorized";
    });
}

global $wp_query;
$query_var = get_query_var('product_cat', "-1");
?>
<?php
$banner_link = get_field('banner_link', 'option');
if( $banner_link ):
    $link_url = $banner_link['url'];
    $link_title = $banner_link['title'];
    $link_target = $banner_link['target'] ? $banner_link['target'] : '_self';
    ?>
    <div class="fmc_container">
        <a class="banner_link" href="<?php echo esc_url( $link_url ); ?>" aria-label="<?php echo esc_html( $link_title ); ?>" target="<?php echo esc_attr( $link_target ); ?>">
        <?php endif; ?>
        <?php
            $featured_image = get_field('featured_image', 'option');
            $size = 'full';
            if( $featured_image ) { ?>
            <?php echo wp_get_attachment_image( $featured_image, $size, "", array( "class" => "store_featured_image" ) ); ?>
        <?php } ?>
        <?php if( $banner_link ): ?>
        </a>
    </div>
<?php endif; ?>
<!-- ADDING -->
            <?php if (have_rows('hero_section', 'option')): ?>
    <div class="fmc_hero_sections">
        <?php while (have_rows('hero_section', 'option')): the_row(); ?>
            <?php            
            $central_image = get_sub_field('central_image'); 
            $left_image = get_sub_field('left_image'); 
            $right_image = get_sub_field('right_image'); 
            $central_text = get_sub_field('central_text'); 
            $button_text = get_sub_field('button_text'); 
            $button_link = get_sub_field('hero_section_button_link');
            ?>
            <div class="fmc_hero_section">
                <!-- Central Image -->
                <figure class="fmc_hero_image_container">
                    <?php if (!empty($central_image)): ?>
                        <img class="fmc_hero_image" src="<?php echo esc_url($central_image); ?>" alt="Central Hero Image">
                    <?php endif; ?>
                </figure>
                <!-- Left Image -->
                <figure class="fmc_hero_image_left_container">
                    <?php if (!empty($left_image)): ?>
                        <img class="fmc_hero_image_left" src="<?php echo esc_url($left_image); ?>" alt="Left Hero Image">
                    <?php endif; ?>
                </figure>
                <!-- Right Image -->
                <figure class="fmc_hero_image_right_container">
                    <?php if (!empty($right_image)): ?>
                        <img class="fmc_hero_image_right" src="<?php echo esc_url($right_image); ?>" alt="Right Hero Image">
                    <?php endif; ?>
                </figure>
                <!-- Central Text -->
                <div class="fmc_hero_content">
                   <a href="" class="pill-button">Shop</a>
                    <?php if (!empty($central_text)): ?>
                        <h1 class="fmc_hero_h1"><?php echo esc_html($central_text); ?></h1>
                    <?php endif; ?>
                    <a href="<?php echo esc_url($button_link); ?>" class="fmc_btn_hero"><?php echo esc_html($button_text)?></a>
                </div>
            </div>
        <?php endwhile; ?>
    </div>
<?php endif; ?>




     <section class="fmc_container featured-products-section">
    <?php
        $section_title = get_field('section_title', 'option');
        $button_text = get_field('button_text', 'option'); 
        $button_link = get_field('button_link', 'option'); 
        $absolute_image = get_field('absolute_image', 'option'); 
    ?>

    <?php if ($section_title): ?>
        <h3 class="featured-products-h3"><?php echo esc_html($section_title); ?></h3>
    <?php endif; ?>

    <div class="products columns-4 featured-products-container">
        <?php
        $featured_product_ids = wc_get_featured_product_ids();
        $categories = get_the_terms(get_the_ID(), 'product_cat');

        if (!empty($featured_product_ids)) {
            $args = array(
                'post_type' => 'product',
                'post__in' => $featured_product_ids,
                'posts_per_page' => 6,
            );
            $featured_query = new WP_Query($args);

            if ($featured_query->have_posts()) :
                while ($featured_query->have_posts()) : $featured_query->the_post();

                    $product_id = get_the_ID();
                    ?>
                    
                    <div class="fmc_product">
                        
                        
                            <a href="<?php the_permalink(); ?>" class="fmc_product_link--abs"></a>
                        

                        <figure class="fmc_grid_figure">
                            <?php echo get_the_post_thumbnail($product_id, 'large'); ?>
                        </figure>
                        <h3 class="fmc_grid_title"><?php the_title(); ?></h3>

                        <div class="fmc_product_grid_bottom">
                            <span><?php woocommerce_template_loop_price(); ?></span>
                            <a href="<?php the_permalink(); ?>" class="fmc_btn">Buy Now</a>
                        </div>
                    </div>

                <?php endwhile;
                wp_reset_postdata();
            endif;
        } else {
            echo '<p>No featured products found.</p>';
        }
        ?>

        <?php if ($absolute_image): ?>
            <img class="absolute-image" src="<?php echo esc_url($absolute_image); ?>" alt="Featured Section Background">
        <?php endif; ?>
    </div>

    <?php if ($button_text && $button_link): ?>
        <div class="btn-container">
            <a href="<?php echo esc_url($button_link); ?>">
                <?php echo esc_html($button_text); ?>
            </a>
        </div>
    <?php endif; ?>
</section>


        
                <!-- icon and text benefits -->
            <?php if(have_rows('product_features','option')): ?>        
            <div class="flex-list">     
                <?php while(have_rows('product_features','option')): the_row();
                $icon = get_sub_field('icon_image');
                $title = get_sub_field('feature_title');
                ?>
                <div class="fmc_content_container">
                    <?php if ($icon): ?>
                        <img src="<?php echo esc_url($icon); ?>" alt="<?php echo esc_attr($title); ?>">
                    <?php endif; ?>
                    <?php if($title): ?>
                        <p><?php echo esc_html($title); ?></p>
                 <?php endif; ?>
                </div>      
                <?php endwhile; ?>
            </div>
            <?php endif; ?>
            
            <!-- product benefits section -->
            <?php if (have_rows('product_benefits_section', 'option')): ?>
    <section class="healthy-living-essentials">
        <?php while (have_rows('product_benefits_section', 'option')): the_row(); ?>
            <?php
            $subheading = get_sub_field('subheading');
            $heading = get_sub_field('heading');
            $description = get_sub_field('description');
            $benefits_list = get_sub_field('benefits_list'); 
            $image = get_sub_field('image');
            $reverse_layout = get_sub_field('reverse_layout');
            $decoration_image = get_sub_field('decoration_image');
            ?>
            <div class="section-content-split <?php echo $reverse_layout ? 'reverse-layout' : ''; ?>">
                                    <?php if ($image): ?>
                                    <div class="image-container image-container-healthy-living-essentials">
                                    <img class="image-healthy-living-essentials" src="<?php echo esc_url($image); ?>" alt="<?php echo esc_attr($heading); ?>">
                                    <img class="<?php echo $reverse_layout ? 'decoration-reverse-image' : 'decoration-normal-image'; ?>" src="<?php echo esc_url($decoration_image); ?>" alt="decoration image">
                                    </div>
                                    <?php endif; ?>
                <div class="info">
                    <?php if ($subheading): ?>
                        <p class="sunfish-font"><?php echo esc_html($subheading); ?></p>
                    <?php endif; ?>
                    <?php if ($heading): ?>
                        <h3><?php echo esc_html($heading); ?></h3>
                    <?php endif; ?>
                    <?php if ($description): ?>
                        <p class="healthy-living-description-p"><?php echo esc_html($description); ?></p>
                    <?php endif; ?>
                    <?php if ($benefits_list): ?>
                        <ul class="content-ul">
                            <?php foreach ($benefits_list as $benefit): ?>
                                <li><img src="/wp-content/uploads/2025/06/checkbox.png" alt=""><?php echo esc_html($benefit['benefit_text']); ?></li>
                            <?php endforeach; ?>
                        </ul>
                    <?php endif; ?>
                </div>
            </div>
        <?php endwhile; ?>
    </section>
<?php endif; ?>
<?php if (have_rows('scrolling_banner', 'option')): ?>
    <div class="scrolling-banner">
        <div class="scrolling-content">
            <?php
            // Generiši osnovni set stavki
            while (have_rows('scrolling_banner', 'option')): the_row();
                $text = get_sub_field('banner_text');
                $image = get_sub_field('banner_image');
            ?>
                <div class="scrolling-item">
                    <?php if ($text): ?>
                        <span><?php echo esc_html($text); ?></span>
                    <?php endif; ?>
                    <?php if ($image): ?>
                        <img src="<?php echo esc_url($image); ?>" alt="<?php echo esc_attr($text); ?>">
                    <?php endif; ?>
                </div>
            <?php endwhile; ?>
            <?php
            // Dupliraj sadržaj za kontinuiranu animaciju
            if (have_rows('scrolling_banner', 'option')):
                while (have_rows('scrolling_banner', 'option')): the_row();
                    $text = get_sub_field('banner_text');
                    $image = get_sub_field('banner_image');
            ?>
                <div class="scrolling-item">
                    <?php if ($text): ?>
                        <span><?php echo esc_html($text); ?></span>
                    <?php endif; ?>
                    <?php if ($image): ?>
                        <img src="<?php echo esc_url($image); ?>" alt="<?php echo esc_attr($text); ?>">
                    <?php endif; ?>
                </div>
            <?php endwhile; endif; ?>
        </div>
    </div>
<?php endif; ?>

            <!-- fmc benefits section -->
             <?php if(have_rows('benefits_image_section','option')): ?>
            <div class="fmc_benefits">
                <?php while(have_rows('benefits_image_section','option')): the_row(); ?>
                <?php
                    $left_image = get_sub_field('left_image');
                    $right_image = get_sub_field('right_image');
          $central_image = get_sub_field('central_image');
          $subheading = get_sub_field('subheading');
          $heading = get_sub_field('heading');
          $description = get_sub_field('description');
          $icon_text_benefits = get_sub_field('icon_text_benefits');
                ?>
                  <?php if ($central_image): ?>
                <figure class="fmc_benefits_image_container">
                    <img class="fmc_benefits_image" src="<?php echo esc_url($central_image); ?>" alt="Cover image">
                </figure>
            <?php endif; ?>
            <?php if ($left_image): ?>
                <figure class="fmc_benefits_image_left_container">
                    <img class="fmc_benefits_image_left" src="<?php echo esc_url($left_image); ?>" alt="Left image product">
                </figure>
            <?php endif; ?>
            <?php if ($right_image): ?>
                <figure class="fmc_benefits_image_right_container">
                    <img class="fmc_benefits_image_right" src="<?php echo esc_url($right_image); ?>" alt="Right image product">
                </figure>
            <?php endif; ?>
                        <div class="fmc_benefits_content">
                <?php if ($subheading): ?>
                    <p class="special-text"><?php echo esc_html($subheading); ?></p>
                <?php endif; ?>
                <?php if ($heading): ?>
                    <h2 class="fmc_benefits_h2"><?php echo esc_html($heading); ?></h2>
                <?php endif; ?>
                <?php if ($description): ?>
                    <p class="fmc_benefits_p"><?php echo esc_html($description); ?></p>
                <?php endif; ?>
                                
                                <?php if ($icon_text_benefits): ?>
                    <ul class="fmc_benefits_ul">
                        <?php foreach ($icon_text_benefits as $benefit): ?>
                                                    
                            <li>
                                <div>
                                    <?php if (!empty($benefit['icon_image'])): ?>
                                        <img src="<?php echo esc_url($benefit['icon_image']); ?>" alt="Benefit icon">
                                    <?php endif; ?>
                                                                        <?php if (!empty($benefit['icon_text'])): ?>
                                                 <p><?php echo esc_html($benefit['icon_text']); ?></p>
                                                 <?php endif; ?>
                                </div>
                            </li>
                        <?php endforeach; ?>
                    </ul>
                <?php endif; ?>
            </div>
        <?php endwhile; ?>
    </div>
<?php endif; ?>

                                                                    


<!-- TEST -->


<?php
if (have_rows('shop_homepage_products', 'option')): ?>
    <section class="fmc-big-products">
        <?php while (have_rows('shop_homepage_products', 'option')): the_row(); 
            $text_content = get_sub_field('text_content'); 
            $block_image = get_sub_field('block_image');  
            $header_color = get_sub_field('header_color');
            $product = get_sub_field('product');
            $related_recipes = get_field('related_recipes', $product->ID);
       
                    
        ?>
            <div class="fmc-big-text">
             
                <?php if ($text_content): ?>
                    <!-- <p class="fmc-big-text-p" style="color: <?php // echo esc_attr($header_color); ?>;"><?php // echo esc_html($text_content); ?></p> -->
                    <p class="fmc-big-text-p" style="color: <?php echo esc_attr($header_color); ?>;">
                        <?php
                        $text_with_breaks = str_replace(' ', '<br>', esc_html($text_content));
                        echo $text_with_breaks;
                        ?>
                    </p>
                <?php endif; ?>
               
                <?php if ($block_image): ?>
                    <img class="big-products-img" src="<?php echo esc_url($block_image); ?>" alt="Shop Product Image">
                <?php endif; ?>
            </div>
                        
                            <!--- Left side container-->
                         <div class="fmc-product-container">
    <?php
$connections = get_posts([
    'post_type' => 'connection',
    'posts_per_page' => -1,
    'meta_query' => [
        [
            'key' => 'connected_product',
            'value' => '"' . $product->ID . '"',
            'compare' => 'LIKE'
        ]
    ]
]);

$connection_recipe = null;
$connection_url = '';
$current_product = $product; 

if ($connections) {
    foreach ($connections as $connection) {
        $connection_recipes = get_field('recipes', $connection->ID);
        if ($connection_recipes) {
            $connection_recipe = $connection_recipes[0];
            $connection_url = get_permalink($connection->ID);
            break;
        }
    }
}

if ($connection_recipe) :
?>

<div class="fmc_product_connected fmc_archive_wrap spacing_1_0">
    <div class="fmc_archive_inner fmc_product_connected">
        <?php
        global $post;
        $post = $connection_recipe;
        setup_postdata($post);
        get_template_part('template-parts/recipe/recipe', 'shop');
        wp_reset_postdata(); 
        $product = $current_product;
        ?>
    </div>
    <a href="<?php echo esc_url($connection_url); ?>" class="fmc_btn-s fmc_btn_shop">
        View All Recipes
        <span class="btn_icon" style="margin-left: 12px;margin-right: 4px;">
            <svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" clip-rule="evenodd" d="M6.29289 0.292893C6.68342 -0.097631 7.31658 -0.0976311 7.70711 0.292893L11.7071 4.29289C12.0976 4.68342 12.0976 5.31658 11.7071 5.70711L7.70711 9.70711C7.31658 10.0976 6.68342 10.0976 6.29289 9.70711C5.90237 9.31658 5.90237 8.68342 6.29289 8.29289L8.58579 6L1 6C0.447716 6 -2.41411e-08 5.55228 0 5C2.41411e-08 4.44772 0.447716 4 1 4H8.58579L6.29289 1.70711C5.90237 1.31658 5.90237 0.683418 6.29289 0.292893Z" fill="#98A2B3"></path>
            </svg>
        </span>
    </a>
</div>

<?php endif; ?>
                                    
                <!-- Middle empty space -->
                <div class="fmc-empty-space" >
                                <?php if ($block_image): ?>
                    <img class="no-opacity-img" src="<?php echo esc_url($block_image); ?>" alt="Shop Product Image">
                <?php endif; ?>
                                </div>
                <!-- Right side product information -->
                <div class="fmc-product-info">
                    <?php if ($product): ?>
                        <h3 class="fmc-product-container-h3"><?php echo esc_html($product->post_title); ?></h3>
                                            
                                        
                       
                                                <!-- RATING -->
                                                <?php if ($product): ?>
                                            <?php
                                                $product_obj = wc_get_product($product->ID);
                                                if ($product_obj):
                                                $average_rating = $product_obj->get_average_rating();
                                              $review_count = $product_obj->get_review_count();
                                                        
                                                    if ($average_rating > 0): ?>
                                                    <div class="woocommerce-product-rating-shop">
                                                        <?php echo wc_get_rating_html($average_rating); ?>
                                                        <span class="reviews-number">
                                                          (<?php echo esc_html($review_count); ?> reviews)
                                                     </span>
                                                    </div>
                                                <?php else: ?>
                                                    <div class="woocommerce-product-rating">
                                                        <div class="star-rating">
                                                            <span>★★★★★</span> <!-- Prazne zvezdice -->
                                                                                <span class="reviews-number">( No reviews )</span>
                                                        </div>
                                                    </div>
                                                <?php endif; ?>
                                            <?php endif; ?>
                                        <?php endif; ?>
                                        <?php
                                                // Dohvati opis proizvoda
                                                $description = $product_obj->get_short_description();
                                                // Skrati opis na 30 reči
                                                $trimmed_description = wp_trim_words($description, 30, '...');
                                                // Prikaz skraćenog opisa
                                                if (!empty($trimmed_description)): ?>
                                                   <div class="fmc-product-description" style="margin-top: 10px;">
                                                        <p><?php echo wp_kses_post($trimmed_description); ?></p>
                                                    </div>
                                                <?php endif; ?>
                                
                                                <!-- Cena i dugmići -->
                                        <p class="fmc-product-container-price"><?php echo get_post_meta($product->ID, '_price', true); ?> USD</p>
                                        <div class="link-wrapper">
                                        <a href="<?php echo get_permalink($product->ID); ?>" class="fmc_btn product-link-btn">
                                                 Buy Now
                                        </a>
                                        </div>
                                        
                         
                    <?php endif; ?>
                </div>
            </div>
        <?php endwhile; ?>
    </section>
<?php endif; ?>



<!-- <script>
    document.addEventListener("DOMContentLoaded", function () {
        // scrollImages(); 
        if (typeof scrollImages === "function") {
      scrollImages();
    }
    });

    
</script> -->


<!-- </section> -->

<!-- <div class="fmc_app spacing_0_1 big-mg-top">
    <div class="fmc_container">
        <div class="img_bg">
        <?php
            $app_image = get_field('app_image', 'option');
            $size = 'full'; // (thumbnail, medium, large, full or custom size)
            if( $app_image ) {
                echo wp_get_attachment_image( $app_image, $size );
            } ?>
        </div>
        <div class="fmc_app_inner">
            <span class="fmc_fa_prefix"><?php the_field('app_prefix', 'option'); ?></span>
            <h2 class="fmc_title_2 title_spacing_2"><?php the_field('app_title', 'option'); ?></h2>
            <div class="fmc_fa_content"><?php the_field('app_content', 'option'); ?></div>
            <?php get_template_part('template-parts/app-badges'); ?>
        </div>
        <div class="fmc_app_leaf">
            <?php
            $corner_image = get_field('corner_image', 'option');
            $size = 'full';
            if( $corner_image ) {
                echo wp_get_attachment_image( $corner_image, $size, "", array( "class" => "corner_image" ) );
            } ?>
        </div>
    </div>
</div> -->

<?php /**
 * Hook: woocommerce_after_main_content.
 *
 * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
 */
do_action('woocommerce_after_main_content');


get_footer('shop');