/**
 * KAUFLOND — Catalog / PLP
 *
 * Scope: shop and product-category archives — page-title bar, subcategory
 * shortcuts, breadcrumb + result-count / sorting toolbar, grid container,
 * pagination. Card internals live in product-card.css; filters in filters.css.
 *
 * All values from tokens.css.
 *
 * @package Kauflond
 */

/* =========================================================================
 * 1. PAGE TITLE BAR — neutral surface, left-aligned, compact
 *
 * WoodMart's `title-design-default` + `title-size-small` + `color-scheme-dark`
 * are set in Theme Settings; this only tunes proportion.
 * ====================================================================== */

.woocommerce-shop .wd-page-title,
.tax-product_cat .wd-page-title {
	background-color: var(--kfl-color-surface-subtle);
	border-bottom: var(--kfl-border-width) solid var(--kfl-color-border);
	padding-block: var(--kfl-space-5);
	margin-bottom: var(--kfl-space-5);
}

.wd-page-title .wd-title-wrapper {
	margin-bottom: var(--kfl-space-3);
}

.wd-page-title .entry-title {
	margin: 0;
	font-size: var(--kfl-font-size-2xl);
	font-weight: var(--kfl-font-weight-bold);
	line-height: var(--kfl-line-height-tight);
	color: var(--kfl-color-text-primary);
}

/* Category description (optional short intro) */
.wd-page-title .term-description,
.tax-product_cat .term-description {
	max-width: 72ch;
	margin-top: var(--kfl-space-2);
	font-size: var(--kfl-font-size-base);
	color: var(--kfl-color-text-secondary);
}

/* =========================================================================
 * 2. SUBCATEGORY SHORTCUTS — WoodMart's title categories nav
 *
 * Real markup: ul.wd-nav-product-cat > li.cat-item > a.category-nav-link >
 * span.nav-link-summary > .nav-link-text + .nav-link-count, with nested
 * ul.children for deeper levels. Rendered here as compact chips; depth is the
 * mega menu's and the sidebar's job, so nested lists are hidden.
 * ====================================================================== */

.wd-page-title .wd-nav-product-cat {
	display: flex;
	flex-wrap: wrap;
	gap: var(--kfl-space-2);
	justify-content: flex-start;
	margin: 0;
}

.wd-page-title .wd-nav-product-cat > li.cat-item {
	margin: 0;
}

.wd-page-title .wd-nav-product-cat > li.cat-item > a.category-nav-link {
	display: inline-flex;
	align-items: center;
	height: var(--kfl-btn-height-sm);
	min-height: 0;
	line-height: 1;
	padding-inline: var(--kfl-space-3);
	border: var(--kfl-border-width) solid var(--kfl-color-border);
	border-radius: var(--kfl-radius-md);
	background: var(--kfl-color-surface);
	color: var(--kfl-color-text-primary);
}

.wd-page-title .wd-nav-product-cat .nav-link-summary {
	display: inline-flex;
	align-items: baseline;
	gap: var(--kfl-space-2);
}

.wd-page-title .wd-nav-product-cat .nav-link-text {
	font-size: var(--kfl-font-size-sm);
	font-weight: var(--kfl-font-weight-medium);
	text-transform: none;
	letter-spacing: 0;
}

.wd-page-title .wd-nav-product-cat .nav-link-count {
	font-size: var(--kfl-font-size-xs);
	font-weight: var(--kfl-font-weight-normal);
	color: var(--kfl-color-text-muted);
}

.wd-page-title .wd-nav-product-cat > li > a:hover,
.wd-page-title .wd-nav-product-cat > li.current-cat > a {
	border-color: var(--kfl-color-brand-primary);
	color: var(--kfl-color-brand-primary);
}

/* No underline decoration from WoodMart's "underline" nav style. */
.wd-page-title .wd-nav-product-cat.wd-style-underline > li > a::after {
	display: none;
}

.wd-page-title .wd-nav-product-cat .children,
.wd-page-title .wd-nav-product-cat .wd-sub-menu {
	display: none;
}

/* =========================================================================
 * 3. TOOLBAR — breadcrumb + result count | filter trigger · per-page · sort
 * ====================================================================== */

.shop-loop-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--kfl-space-3);
	margin-bottom: var(--kfl-space-4);
	padding-bottom: var(--kfl-space-3);
	border-bottom: var(--kfl-border-width) solid var(--kfl-color-border);
}

.shop-loop-head .wd-shop-tools {
	display: flex;
	align-items: center;
	gap: var(--kfl-space-4);
	margin: 0;
}

/* WoodMart hides the count when its own shop builder is off
 * (`.wd-builder-off .woocommerce-result-count{display:none}`). The brief wants a
 * compact count, so it is shown again — same specificity, later cascade. */
.wd-builder-off .shop-loop-head .woocommerce-result-count,
.shop-loop-head .woocommerce-result-count {
	display: block;
	margin: 0;
	font-size: var(--kfl-font-size-sm);
	font-weight: var(--kfl-font-weight-medium);
	color: var(--kfl-color-text-secondary);
	white-space: nowrap;
}

/* Breadcrumb inside the toolbar: separate from the count with a rule. */
.shop-loop-head .wd-breadcrumbs + .woocommerce-result-count {
	padding-inline-start: var(--kfl-space-4);
	border-inline-start: var(--kfl-border-width) solid var(--kfl-color-border);
}

/* Per-page links */
.shop-loop-head .wd-products-per-page {
	font-size: var(--kfl-font-size-sm);
	color: var(--kfl-color-text-secondary);
}

.shop-loop-head .wd-products-per-page .per-page-variation {
	color: var(--kfl-color-text-secondary);
}

.shop-loop-head .wd-products-per-page .per-page-variation.current-variation {
	color: var(--kfl-color-brand-primary);
	font-weight: var(--kfl-font-weight-bold);
}

/* Sorting select */
.shop-loop-head .woocommerce-ordering {
	margin: 0;
}

.shop-loop-head .woocommerce-ordering select,
.shop-loop-head .woocommerce-ordering .wd-ordering-select {
	height: var(--kfl-btn-height-sm);
	padding-inline: var(--kfl-space-3) var(--kfl-space-8);
	border: var(--kfl-border-width) solid var(--kfl-color-border);
	border-radius: var(--kfl-radius-md);
	font-size: var(--kfl-font-size-sm);
	font-weight: var(--kfl-font-weight-medium);
	color: var(--kfl-color-text-primary);
	background-color: var(--kfl-color-surface);
}

/* WoodMart renders the sort as a custom dropdown too — same look. */
.shop-loop-head .woocommerce-ordering .wd-ordering-dropdown,
.shop-loop-head .woocommerce-ordering .wd-dropdown {
	border-radius: var(--kfl-radius-md);
	border: var(--kfl-border-width) solid var(--kfl-color-border);
	box-shadow: var(--kfl-shadow-md);
}

/* View-mode switcher (grid columns): keep, but quiet. */
.shop-loop-head .wd-products-shop-view a {
	color: var(--kfl-color-text-muted);
}

.shop-loop-head .wd-products-shop-view a.current-variation {
	color: var(--kfl-color-brand-primary);
}

/* Off-canvas filter trigger — WoodMart shows it below desktop. */
.shop-loop-head .wd-show-sidebar-btn > a {
	display: inline-flex;
	align-items: center;
	gap: var(--kfl-space-2);
	height: var(--kfl-btn-height-sm);
	padding-inline: var(--kfl-space-3);
	border: var(--kfl-border-width) solid var(--kfl-color-border-strong);
	border-radius: var(--kfl-radius-md);
	font-size: var(--kfl-font-size-sm);
	font-weight: var(--kfl-font-weight-bold);
	text-transform: none;
	letter-spacing: 0;
	color: var(--kfl-color-text-primary);
}

/* =========================================================================
 * 4. GRID CONTAINER
 * ====================================================================== */

.wd-products.products-bordered-grid-ins {
	--wd-col-gap: var(--kfl-space-3);
	--wd-row-gap: var(--kfl-space-3);
}

/* =========================================================================
 * 5. PAGINATION — native WooCommerce/WoodMart, restyled
 * ====================================================================== */

.woocommerce-pagination,
.wd-pagination {
	margin-top: var(--kfl-space-6);
	padding-top: var(--kfl-space-4);
	border-top: var(--kfl-border-width) solid var(--kfl-color-border);
}

.woocommerce-pagination ul.page-numbers {
	display: flex;
	justify-content: center;
	gap: var(--kfl-space-1);
	border: none;
}

.woocommerce-pagination .page-numbers li {
	border: none;
}

.woocommerce-pagination .page-numbers a,
.woocommerce-pagination .page-numbers span.current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--kfl-btn-height);
	height: var(--kfl-btn-height);
	padding-inline: var(--kfl-space-2);
	border: var(--kfl-border-width) solid var(--kfl-color-border);
	border-radius: var(--kfl-radius-md);
	font-size: var(--kfl-font-size-sm);
	font-weight: var(--kfl-font-weight-medium);
	color: var(--kfl-color-text-primary);
	background: var(--kfl-color-surface);
}

.woocommerce-pagination .page-numbers a:hover {
	border-color: var(--kfl-color-brand-primary);
	color: var(--kfl-color-brand-primary);
}

.woocommerce-pagination .page-numbers span.current {
	background: var(--kfl-color-brand-primary);
	border-color: var(--kfl-color-brand-primary);
	color: var(--kfl-color-brand-on-primary);
}

/* No products */
.woocommerce-no-products-found .woocommerce-info {
	border-color: var(--kfl-color-border);
	background: var(--kfl-color-surface-subtle);
	color: var(--kfl-color-text-primary);
}