/* ========================================================================== 
   WooCommerce Catalog UI
   Scope: shop + product taxonomy archives (.upjau-product-catalog)
   ========================================================================== */

.wp-site-blocks .upjau-product-catalog {
	--upjau-catalog-sidebar-width: clamp(16rem, 22vw, 19rem);
	--upjau-catalog-layout-gap: clamp(var(--wp--preset--spacing--4), 2.2vw, var(--wp--preset--spacing--8));
	--upjau-catalog-grid-gap: clamp(var(--wp--preset--spacing--4), 1.8vw, var(--wp--preset--spacing--6));
	--upjau-catalog-grid-row-gap: clamp(22px, 3.2vw, 40px);
	--upjau-catalog-panel-padding: clamp(var(--wp--preset--spacing--4), 1.5vw, var(--wp--preset--spacing--6));
	--upjau-catalog-control-min-height: var(--upjau-control-touch-min, 44px);
	--upjau-catalog-sale-badge-size: calc(var(--upjau-control-touch-min, 44px) + var(--wp--preset--spacing--1, 4px));
	--upjau-catalog-sale-badge-bg: var(--upjau-sale-badge-bg, var(--wp--preset--color--sale, #f0524b));
	--upjau-catalog-sale-badge-text: var(--upjau-sale-badge-text, var(--wp--preset--color--white, #ffffff));
	--upjau-catalog-title-lines: 2;
	--upjau-catalog-title-line-height: 1.4;
	--upjau-catalog-title-price-gap: 0.25rem;
	--upjau-catalog-price-cta-gap: var(--wp--preset--spacing--2);
}

/* --------------------------------------------------------------------------
   1. Header + Meta
   -------------------------------------------------------------------------- */

.wp-site-blocks .upjau-product-catalog__header {
	margin: 0;
}

.wp-site-blocks .upjau-product-catalog__header :where(.wp-block-woocommerce-breadcrumbs, .woocommerce-breadcrumb) {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--muted);
}

.wp-site-blocks .upjau-product-catalog__header :where(.wp-block-woocommerce-breadcrumbs a, .woocommerce-breadcrumb a) {
	color: var(--wp--preset--color--forest);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.12em;
	transition: color var(--upjau-transition-fast);
}

.wp-site-blocks .upjau-product-catalog__header :where(.wp-block-woocommerce-breadcrumbs a, .woocommerce-breadcrumb a):hover {
	color: var(--wp--preset--color--leaf);
}

.wp-site-blocks .upjau-product-catalog__header :where(.wp-block-shortcode, .wp-block-shortcode p) {
	margin: 0;
	margin-inline: 0;
	max-width: none;
	width: 100%;
}

.wp-site-blocks .upjau-product-catalog__header .wp-block-query-title + .wp-block-shortcode {
	margin-top: clamp(var(--wp--preset--spacing--2), 0.9vw, var(--wp--preset--spacing--3)) !important;
}

.wp-site-blocks .upjau-product-catalog__header .wp-block-query-title + .upjau-product-catalog__banner {
	margin-top: clamp(var(--wp--preset--spacing--2), 0.9vw, var(--wp--preset--spacing--3)) !important;
}

@media (max-width: 780px) {
	.wp-site-blocks .upjau-product-catalog__header .wp-block-query-title + .wp-block-shortcode {
		margin-top: var(--wp--preset--spacing--2) !important;
	}

	.wp-site-blocks .upjau-product-catalog__header .wp-block-query-title + .upjau-product-catalog__banner {
		margin-top: var(--wp--preset--spacing--2) !important;
	}
}

.wp-site-blocks .upjau-product-catalog__banner {
	margin: 0;
	margin-inline: 0;
	max-width: none;
	width: 100%;
}

.wp-site-blocks .upjau-product-catalog__banner-media {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius-lg);
	background: var(--wp--preset--color--forest-50, var(--wp--preset--color--bg));
	aspect-ratio: 16 / 3;
}

@media (max-width: 780px) {
	.wp-site-blocks .upjau-product-catalog__banner-media {
		aspect-ratio: 16 / 6;
	}
}

.wp-site-blocks .upjau-product-catalog__banner-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.wp-site-blocks .upjau-product-catalog__header .wp-block-query-title {
	margin: 0;
	margin-inline: 0;
	max-width: none;
	text-align: left;
	line-height: 1.12;
	letter-spacing: -0.012em;
}

.wp-site-blocks .upjau-product-catalog__header :where(.wp-block-term-description, .term-description) {
	max-width: 68ch;
	margin: 0;
	margin-inline: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.55;
}

.wp-site-blocks .upjau-product-catalog__meta {
	margin: var(--wp--preset--spacing--4) 0 0;
	gap: var(--wp--preset--spacing--4);
	padding-block: var(--wp--preset--spacing--3);
	border-block: 1px solid var(--wp--preset--color--border);
}

.wp-site-blocks .upjau-product-catalog__meta > * {
	min-width: 0;
}

.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-product-results-count, .woocommerce-result-count) {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--muted);
}

.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting, .woocommerce-ordering) {
	margin: 0;
}

.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting select, .woocommerce-ordering select) {
	min-height: var(--upjau-catalog-control-min-height);
	margin: 0;
	padding: 0 var(--wp--preset--spacing--6) 0 var(--wp--preset--spacing--3);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--radius-md);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	line-height: 1.2;
	cursor: pointer;
	transition:
		border-color var(--upjau-transition-fast),
		box-shadow var(--upjau-transition-fast);
}

.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting select, .woocommerce-ordering select):hover {
	border-color: var(--wp--preset--color--leaf-100, var(--wp--preset--color--border));
}

.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting select, .woocommerce-ordering select):focus-visible {
	outline: var(--upjau-focus-outline-width) solid var(--upjau-focus-outline-color);
	outline-offset: 0;
}

/* --------------------------------------------------------------------------
   2. Main Layout
   -------------------------------------------------------------------------- */

.wp-site-blocks .upjau-product-catalog__layout {
	display: grid;
	grid-template-columns: minmax(15rem, var(--upjau-catalog-sidebar-width)) minmax(0, 1fr);
	gap: var(--upjau-catalog-layout-gap);
	margin-top: var(--wp--preset--spacing--4);
	align-items: start;
}

@media (max-width: 600px) {
	.wp-site-blocks .upjau-product-catalog {
		padding-right: var(--wp--preset--spacing--3) !important;
		padding-left: var(--wp--preset--spacing--3) !important;
	}

	.wp-site-blocks .upjau-product-catalog__meta {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
		align-items: center;
		gap: var(--wp--preset--spacing--3);
	}

	.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-product-results-count, .woocommerce-result-count) {
		grid-column: 1 / -1;
	}

	.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting, .woocommerce-ordering) {
		width: 100%;
	}

	.wp-site-blocks .upjau-product-catalog :where(.wp-block-woocommerce-catalog-sorting select, .woocommerce-ordering select) {
		width: 100%;
	}
}

.wp-site-blocks .upjau-product-catalog__sidebar,
.wp-site-blocks .upjau-product-catalog__products {
	min-width: 0;
}

.wp-site-blocks .upjau-product-catalog__details {
	margin-top: var(--wp--preset--spacing--12);
	width: 100%;
	max-width: none;
}

.wp-site-blocks .upjau-product-catalog__details.is-layout-constrained > .wp-block-upjau-theme-product-details-accordion {
	width: 100%;
	max-width: none;
}

.wp-site-blocks .upjau-product-catalog__details .wp-block-upjau-theme-product-details-accordion {
	margin: 0;
	padding: 0;
	background: var(--wp--preset--color--surface);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	overflow: hidden;
}

.wp-site-blocks .upjau-product-catalog__sidebar {
	position: sticky;
	top: calc(var(--upjau-sticky-header-stack-offset, 0px) + var(--wp--preset--spacing--4));
}

@media (max-width: 1024px) {
	.wp-site-blocks .upjau-product-catalog__layout {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--6);
	}

	.wp-site-blocks .upjau-product-catalog__sidebar {
		position: static;
		top: auto;
	}
}

/* --------------------------------------------------------------------------
   3. Filters
   -------------------------------------------------------------------------- */
