/**
 * Luxura editorial product grid.
 *
 * Scope is intentionally limited by the catalog body class and Konte's native
 * main-loop classes. Related products, carousels, widgets and category tiles
 * keep their native WooCommerce/Konte layout.
 */

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) {
	--lpg-column-gap: 4px;
	--lpg-edge-gap: 4px;
	--lpg-row-gap: 36px;

	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-flow: row dense;
	align-items: start;
	column-gap: var(--lpg-column-gap);
	row-gap: var(--lpg-row-gap);
	width: auto !important;
	max-width: none !important;
	margin: 0 calc(50% - 50vw) 48px !important;
	padding: 0 var(--lpg-edge-gap) !important;
	list-style: none;
}

/* Konte's clearfix pseudo-elements would otherwise become grid cells. */
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard)::before,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard)::after {
	content: none !important;
	display: none !important;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.prefix-custom-featured-product {
	float: none !important;
	clear: none !important;
	width: auto !important;
	min-width: 0;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	align-self: start;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.prefix-custom-featured-product {
	grid-column: 1 / -1;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail > a {
	display: block;
	width: 100%;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover {
	background-color: transparent;
	box-shadow: none;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail {
	margin: 0;
	background: #f7f7f5;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail img,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.custom-image-product > a,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.custom-image-product > a > img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}

/* Keep the copy inset even though the photography runs edge to edge. */
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-summary,
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .product-summary {
	transform: none !important;
	padding: 12px 16px 18px !important;
	background: #fff;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .buttons {
	display: none !important;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title {
	margin: 0 !important;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.35;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a {
	display: block;
	color: #161619;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > br {
	display: none;
}

/* HARD TO FIND / BEST DEAL / IN TRENDING: distinct metadata, not a headline. */
:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > span:first-of-type {
	display: block;
	margin: 0 0 5px;
	color: #656565 !important;
	font-size: 10px !important;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.15em !important;
	text-transform: uppercase;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > strong {
	display: block;
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: 0.01em;
	text-transform: uppercase;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > div {
	display: block;
	margin: 3px 0 0 !important;
	color: #656565;
	font-size: 14px !important;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-summary .price {
	margin-top: 8px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
}

:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) a:focus-visible {
	outline: 2px solid #161619;
	outline-offset: 2px;
}

@media (max-width: 767px) {
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) {
		--lpg-row-gap: 26px;

		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-bottom: 36px !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-summary,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .product-summary {
		padding: 10px 10px 14px !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > div {
		font-size: 13px !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > strong {
		font-size: 13px;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a > span:first-of-type {
		font-size: 9px !important;
	}
}

/*
 * iOS turns layout-changing :hover rules into a two-tap interaction. Keep the
 * touch presentation identical in every pointer state so the native first tap
 * follows the product link immediately.
 */
@media (hover: none), (pointer: coarse) {
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-summary,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .price,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .buttons,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail img,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner a {
		animation: none !important;
		transition: none !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:active {
		color: inherit;
		background-color: transparent;
		box-shadow: none !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-summary,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .product-summary,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:active .product-summary {
		transform: none !important;
		background: #fff;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .price,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .price,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:active .price {
		transform: none !important;
		opacity: 1 !important;
		user-select: auto;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .buttons,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .buttons,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:active .buttons {
		display: none !important;
		opacity: 0 !important;
		transform: none !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnails--hover img {
		opacity: 1 !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnails--hover .hover-image {
		display: none !important;
		opacity: 0 !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnails--slider .slick-arrow {
		display: none !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner .wcboost-wishlist-button,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner .add-to-wishlist-button,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .wcboost-wishlist-button,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-inner:hover .add-to-wishlist-button {
		opacity: 1 !important;
		visibility: visible !important;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-badges {
		pointer-events: none;
	}

	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .product-thumbnail > a,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) > li.product .woocommerce-loop-product__title > a {
		touch-action: manipulation;
	}
}

@media (prefers-reduced-motion: reduce) {
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) .product-inner,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) .product-summary,
	:is(ul.products.luxura-product-grid, body.luxura-product-grid-enabled ul.products.main-products.layout-standard) .product-thumbnail img {
		transition: none !important;
	}
}
