/*
 * WooCommerce product archive for the child theme.
 * Alles is beperkt tot #filter-products.
 */

#filter-products .shop-archive__breadcrumb {
	width: 100%;
}

#filter-products .shop-archive__breadcrumb .breadcrumbs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .3em;
}

#filter-products .shop-archive__breadcrumb .last {
	font-weight: 700;
}

#filter-products .shop-archive__layout {
	align-items: flex-start;
}

#filter-products .shop-filter-column,
#filter-products .shop-products-column {
	min-width: 0;
}

#filter-products .shop-loop-controls {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1.6rem 2.4rem;
	width: 100%;
	margin-bottom: 3rem;
	clear: both;
}

#filter-products .shop-loop-controls::before,
#filter-products .shop-loop-controls::after {
	content: none !important;
	display: none !important;
}

#filter-products .shop-loop-controls .woocommerce-result-count,
#filter-products .shop-loop-controls .woocommerce-ordering {
	float: none !important;
	margin: 0 !important;
}

#filter-products .shop-loop-controls .woocommerce-result-count {
	flex: 1 1 28rem;
}

#filter-products .shop-loop-controls .woocommerce-ordering {
	flex: 0 1 25rem;
	max-width: 100%;
}

#filter-products .shop-loop-controls .woocommerce-ordering select {
	width: 100%;
	margin: 0;
}

#filter-products .shop-loop-controls .wpc-filters-open-button-container,
#filter-products .shop-loop-controls .wpc-custom-selected-terms,
#filter-products .shop-loop-controls .woocommerce-notices-wrapper {
	flex: 0 0 100%;
	width: 100%;
}

/* Geen algemene themabullets in filters, chips, meldingen of paginering. */
#filter-products ul,
#filter-products ol,
#filter-products ul li,
#filter-products ol li {
	list-style: none !important;
}

#filter-products ul li,
#filter-products ol li {
	padding-left: 0;
}

#filter-products ul li::before,
#filter-products ol li::before {
	content: none !important;
	display: none !important;
}

/* Productgrid: de bestaande col-lg-4 classes bepalen drie kolommen. */
#filter-products .products.row {
	--shop-card-gap: 2.4rem;
	display: flex;
	flex-wrap: wrap;
	width: calc(100% + var(--shop-card-gap));
	clear: both;
	margin: calc(var(--shop-card-gap) / -2);
	padding: 0;
	gap: 0;
}

#filter-products .products.row::before,
#filter-products .products.row::after {
	content: none !important;
	display: none !important;
}

#filter-products .products.row > [class*="col-"] {
	min-width: 0;
	padding: calc(var(--shop-card-gap) / 2);
}

/* Productkaart op basis van de bestaande pd-block classes. */
#filter-products .product-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	min-height: 100%;
	padding: 1.2em;
	color: var(--cl-light-text, var(--cl-text, #260101));
	background-color: var(--cl-light, #fff);
	border-radius: var(--br-small, 1.2rem);
	box-shadow: 0 0 3em var(--cl-tertiary-12, rgba(38, 1, 1, .1));
	text-decoration: none;
}

#filter-products .product-card,
#filter-products .product-card * {
	box-sizing: border-box;
}

#filter-products .product-card__image,
#filter-products .pd-block__image {
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-bottom: 80%;
	margin-bottom: 1.5em;
	border-radius: var(--br-small, 1.2rem);
	background-color: var(--cl-secondary-60, #f2eded);
}

#filter-products .pd-block__image img {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100% !important;
	margin: 0;
	object-fit: cover;
	transition: transform .4s ease-in-out;
}

#filter-products .product-card:hover .pd-block__image img {
	transform: scale3d(1.04, 1.04, 1);
}

#filter-products .pd-block__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
}

#filter-products .pd-block__heading {
	margin-bottom: 0;
}

#filter-products .pd-block__title {
	margin: 0 0 .4em;
	font-family: var(--font-primary);
	font-size: 1.15em;
	font-weight: 600;
	line-height: var(--font-primary-line-height, 1.15);
	overflow-wrap: anywhere;
}

#filter-products .product-card__microcopy {
	margin-top: 0;
	line-height: 1.45;
}

#filter-products .product-card__microcopy--above-price {
	margin-bottom: 1em;
}

#filter-products .product-card__microcopy--below-stock {
	margin-bottom: 1em !important;
}

#filter-products .product-card__price {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .3em 1em;
	margin-top: auto;
	margin-bottom: .8em;
}

#filter-products .product-card__price .price-gap {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: .3em;
}

#filter-products .product-card__price del {
	opacity: .65;
	font-size: .82em;
	font-weight: 500;
}

#filter-products .product-card__price ins {
	text-decoration: none;
}

#filter-products .product-card__price small {
	font-weight: 300;
	line-height: 1.8;
}

#filter-products .product-card__stock {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .3em;
	margin: 0 0 .6em;
}

#filter-products .product-card__button {
	display: inline-flex !important;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	min-height: 3.25em;
	margin-top: auto;
	padding: .7em 3.6em .7em 1.4em !important;
	border-radius: var(--br-button, 4rem 0 4rem 4rem);
	background-color: var(--cl-primary, #df7d82) !important;
	color: var(--cl-primary-text, #fff) !important;
	font-family: var(--font-primary);
	font-weight: 600;
	line-height: 1.2;
}

#filter-products .product-card__button span,
#filter-products .product-card__button i {
	color: inherit !important;
}

#filter-products .pd-block__label {
	top: calc(1.2em + .6em);
	left: calc(1.2em + .6em);
	padding: .7em 1.4em;
	border-radius: 5em;
}

#filter-products .pd-block__label.sale {
	--cl-text: #fff;
	color: #fff;
	background-color: var(--cl-price, var(--cl-tertiary, #260101));
}

/* Filterlijsten. */
#filter-products .wpc-filters-ul-list,
#filter-products .wpc-filter-chips-list {
	margin: 0;
	padding: 0;
}

#filter-products .wpc-filters-ul-list > li,
#filter-products .wpc-filter-chips-list > li {
	margin-left: 0;
}

/* Paginering zonder bullets en zonder standaard WooCommerce-randen. */
#filter-products .woocommerce-pagination {
	width: 100%;
	margin-top: var(--space-small, 4rem);
	clear: both;
}

#filter-products .woocommerce-pagination ul.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: .6rem;
	margin: 0;
	padding: 0;
	border: 0;
}

#filter-products .woocommerce-pagination ul.page-numbers > li {
	display: block;
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
}

#filter-products .woocommerce-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.6em;
	height: 2.6em;
	padding: 0 .7em;
	border: 0;
	border-radius: var(--br-small, .8rem);
	font-family: var(--font-primary);
	font-weight: 600;
	line-height: 1;
}

#filter-products .woocommerce-pagination a.page-numbers,
#filter-products .woocommerce-pagination span.page-numbers.current {
	background-color: var(--cl-tertiary, #260101);
	color: var(--cl-tertiary-text, #fff);
}

#filter-products .woocommerce-pagination span.page-numbers.current {
	opacity: .65;
}


@media (max-width: 575.98px) {
	#filter-products .products.row {
		--shop-card-gap: 1.6rem;
	}
}

@media (max-width: 767.98px) {
	#filter-products .shop-filter-column {
		margin-bottom: 3rem;
	}

	#filter-products .shop-loop-controls {
		align-items: stretch;
	}

	#filter-products .shop-loop-controls .woocommerce-result-count,
	#filter-products .shop-loop-controls .woocommerce-ordering {
		flex-basis: 100%;
		width: 100%;
	}
}