/**
 * HeerlijkBinnen Shortcode Collection Page Stylesheet v1.8.10
 *
 * Dedicated styling for pages containing [hb_filter_producten].
 * Aligned with archive.css and product-card.css design discipline.
 *
 * @package HeerlijkBinnenTheme
 * @version 1.8.10
 */

/* Article Reset for Shortcode Collection Pages (No Box-in-Box Card) */
.hb-shortcode-page-article {
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

/* Container & Page Layout */
.hb-collection-page-container {
	width: 100%;
	max-width: var(--hb-container-max, 1320px);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--hb-container-padding, 20px);
	padding-right: var(--hb-container-padding, 20px);
	box-sizing: border-box;
}

/* Archive Header for Shortcode Collection Pages */
.hb-shortcode-archive-header {
	margin-bottom: var(--hb-space-5, 32px);
}

.hb-shortcode-archive-header .hb-archive-title {
	font-family: var(--hb-font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(2rem, 3.5vw, 2.75rem);
	color: var(--hb-espresso, #2C221E);
	margin-bottom: var(--hb-space-1, 8px);
	line-height: 1.2;
}

.hb-shortcode-archive-header .hb-archive-kicker {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--hb-rose, #CAA08E);
	display: block;
	margin-bottom: var(--hb-space-1, 8px);
}

/* Shortcode Collection Section */
.hb-shortcode-collection {
	width: 100%;
	margin-bottom: var(--hb-space-6, 48px);
}

/* Entry Content Text Width Limit (SEO Text below/above shortcode) */
.hb-shortcode-collection-page .entry-content > h2,
.hb-shortcode-collection-page .entry-content > h3,
.hb-shortcode-collection-page .entry-content > h4,
.hb-shortcode-collection-page .entry-content > p,
.hb-shortcode-collection-page .entry-content > ul,
.hb-shortcode-collection-page .entry-content > ol {
	max-width: 900px;
	margin-left: 0;
	margin-right: auto;
	color: var(--hb-espresso, #2C221E);
	line-height: 1.6;
}

.hb-shortcode-collection-page .entry-content > p {
	font-size: 1.0625rem;
	margin-bottom: var(--hb-space-4, 24px);
}

.hb-shortcode-collection-page .entry-content a {
	color: var(--hb-espresso, #2C221E);
	text-decoration: underline;
	text-decoration-color: var(--hb-rose, #CAA08E);
	text-underline-offset: 4px;
	transition: var(--hb-transition, all 0.2s ease);
}

.hb-shortcode-collection-page .entry-content a:hover,
.hb-shortcode-collection-page .entry-content a:focus {
	color: var(--hb-rose, #CAA08E);
}

/* Toolbar & Result Count */
.hb-shortcode-collection .hb-catalog-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--hb-space-3, 16px) 0;
	border-top: 1px solid var(--hb-border, #EAE5E1);
	border-bottom: 1px solid var(--hb-border, #EAE5E1);
	margin-bottom: var(--hb-space-5, 32px);
	font-size: 0.875rem;
	color: var(--hb-muted, #7A706A);
}

.hb-shortcode-collection .hb-catalog-result-count {
	font-weight: 600;
	color: var(--hb-espresso, #2C221E);
}

/* Pagination Styling */
.hb-shortcode-collection .woocommerce-pagination {
	margin: var(--hb-space-6, 48px) 0 !important;
	text-align: center !important;
}

.hb-shortcode-collection .woocommerce-pagination ul.page-numbers {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	border: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.hb-shortcode-collection .woocommerce-pagination ul.page-numbers li {
	display: inline-block !important;
	border: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.hb-shortcode-collection .woocommerce-pagination ul.page-numbers a,
.hb-shortcode-collection .woocommerce-pagination ul.page-numbers span {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 40px !important;
	height: 40px !important;
	padding: 0 12px !important;
	border: 1px solid var(--hb-border, #EAE5E1) !important;
	border-radius: var(--hb-radius-sm, 4px) !important;
	background-color: var(--hb-surface, #FFFFFF) !important;
	color: var(--hb-espresso, #2C221E) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: var(--hb-transition, all 0.2s ease) !important;
}

.hb-shortcode-collection .woocommerce-pagination ul.page-numbers span.current,
.hb-shortcode-collection .woocommerce-pagination ul.page-numbers a:hover {
	background-color: var(--hb-espresso, #2C221E) !important;
	border-color: var(--hb-espresso, #2C221E) !important;
	color: #FFFFFF !important;
}

/* Mobile 2-Column Product Grid for Shortcode Pages */
@media (max-width: 640px) {
	.hb-shortcode-collection .hb-catalog-layout {
		display: block !important;
	}

	.hb-shortcode-collection ul.products {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
		width: 100% !important;
		margin: 0 0 var(--hb-space-6, 32px) 0 !important;
		padding: 0 !important;
	}

	.hb-shortcode-collection ul.products li.product {
		width: 100% !important;
		min-width: 0 !important;
	}

	.hb-shortcode-collection .hb-catalog-toolbar {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 12px !important;
	}
}