<?php
/**
 * Title: Product categories
 * Slug: larder/product-categories
 * Categories: larder, woocommerce
 * Description: Product categories grid with gradient overlay cards and hover description reveal.
 * Keywords: categories, products, grid, shop
 */

if ( ! function_exists( 'WC' ) ) {
	return;
}

$categories = get_terms(
	array(
		'taxonomy'   => 'product_cat',
		'hide_empty' => false,
		'parent'     => 0,
		'exclude'    => array( (int) get_option( 'default_product_cat', 0 ) ),
		'orderby'    => 'name',
		'order'      => 'ASC',
	)
);

if ( empty( $categories ) || is_wp_error( $categories ) ) {
	return;
}

$placeholder = esc_url( get_theme_file_uri( 'assets/images/hero-larder.png' ) );
?>
<!-- wp:group {"align":"full","className":"larder-section-divider","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60","right":"var:preset|spacing|30","left":"var:preset|spacing|30"}}},"backgroundColor":"surface","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull larder-section-divider has-surface-background-color has-background" style="padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--30)">

	<!-- wp:group {"className":"larder-x-decoration","layout":{"type":"default"}} -->
	<div class="wp-block-group larder-x-decoration"></div>
	<!-- /wp:group -->

	<!-- wp:heading {"textAlign":"center","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|10"},"padding":{"top":"1.387em"}}}} -->
	<h2 class="wp-block-heading has-text-align-center" style="margin-bottom:var(--wp--preset--spacing--10);padding-top:1.387em"><?php echo esc_html__( 'Shop by category', 'larder' ); ?></h2>
	<!-- /wp:heading -->

	<!-- wp:paragraph {"align":"center","textColor":"muted","fontSize":"small","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|50"}}}} -->
	<p class="has-text-align-center has-muted-color has-text-color has-small-font-size" style="margin-bottom:var(--wp--preset--spacing--50)"><?php echo esc_html__( 'Browse our curated selection of organic and artisan products.', 'larder' ); ?></p>
	<!-- /wp:paragraph -->

	<!-- wp:html -->
	<div class="larder-category-grid">
		<ul class="wc-block-product-categories-list">
			<?php foreach ( $categories as $cat ) :
				$thumbnail_id = (int) get_term_meta( $cat->term_id, 'thumbnail_id', true );
				$image_url    = $thumbnail_id ? wp_get_attachment_url( $thumbnail_id ) : $placeholder;
				$link         = get_term_link( $cat );
				if ( is_wp_error( $link ) ) {
					continue;
				}
			?>
			<li class="wc-block-product-categories-list-item">
				<a href="<?php echo esc_url( $link ); ?>">
					<img src="<?php echo esc_url( $image_url ); ?>" alt="<?php echo esc_attr( $cat->name ); ?>" width="400" height="320" />
					<span class="wc-block-product-categories-list-item__name"><?php echo esc_html( $cat->name ); ?></span>
				</a>
				<span class="wc-block-product-categories-list-item-count">(<?php echo (int) $cat->count; ?>)</span>
			</li>
			<?php endforeach; ?>
		</ul>
	</div>
	<!-- /wp:html -->

</div>
<!-- /wp:group -->
