/* Product information is deliberately table-like without using table markup:
   each label remains associated with its value while the rows can collapse on
   a narrow screen. */
.product-specifications {
	margin: 1.5rem 0 0;
}

.hk-product > .product-layout {
	align-items: flex-start;
	margin-block-start: 0.75rem;
}

.product-summary > .wp-block-post-title {
	font-size: clamp(2rem, 3vw, 2.75rem);
	line-height: 1.1;
	margin-block: 0 0.75rem;
}

.product-summary > .wp-block-post-excerpt {
	margin: 0;
}

.product-summary > .wp-block-post-excerpt p {
	margin: 0;
}

/* WooCommerce puts the gallery trigger at z-index 99. Contain it below the
   sticky site header instead of letting it escape over the navigation while
   the product image scrolls underneath. */
.hk-product .wp-block-woocommerce-product-image-gallery {
	position: relative;
	z-index: 0;
	isolation: isolate;
}

.hk-product .woocommerce-product-gallery__trigger {
	z-index: 1 !important;
}

.product-specifications .row {
	display: grid;
	grid-template-columns: minmax(7rem, 2fr) minmax(0, 3fr);
	column-gap: 1rem;
	padding: 0.5rem 0;
	border-bottom: 1px solid var(--wp--preset--color--harjedalskok-separator);
}

.product-specifications .row:first-child {
	border-top: 1px solid var(--wp--preset--color--harjedalskok-separator);
}

.product-specifications dt {
	font-weight: 700;
}

.product-specifications dd {
	margin: 0;
}

.product-summary .price-line {
	align-items: baseline;
	justify-content: flex-start;
	gap: 0.5rem;
	margin: 0;
	padding-block: 2rem;
	padding-left: 0 !important;
	padding-inline-start: 0 !important;
	width: 100%;
}

.product-summary .price-line .wp-block-woocommerce-product-price,
.product-summary .price-line .wc-block-components-product-price,
.product-summary .price-line .suffix {
	margin: 0;
}

.product-summary .price-line .suffix {
	font-size: 0.875rem;
}

.product-summary .purchase-area {
	margin-block-start: 0;
	padding: 0;
}

.product-summary .purchase-area > .wp-block-add-to-cart-form {
	margin-block-start: 0;
}

.product-summary .hk-product-quantity {
	background: var(--wp--preset--color--white, #fff);
	display: inline-flex;
	margin: 0 !important;
}

.product-summary .hk-product-cart-form:not(.variations_form):not(.grouped_form) {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	width: fit-content;
}

.product-summary .hk-product-cart-form:not(.variations_form):not(.grouped_form)::before,
.product-summary .hk-product-cart-form:not(.variations_form):not(.grouped_form)::after {
	content: none;
	display: none;
}

.product-summary .hk-product-cart-hint {
	color: var(--wp--preset--color--harjedalskok-main);
	display: block;
	font-size: 0.875rem;
	align-self: center;
	line-height: 1.25rem;
	margin: 0 !important;
	min-height: 1.25rem;
	text-align: center;
	white-space: nowrap;
}

.product-summary .hk-product-cart-hint[hidden] {
	display: block;
	visibility: hidden;
}

.product-summary .hk-product-cart-form[data-pending="true"] .single_add_to_cart_button {
	background-color: #555 !important;
	color: var(--wp--preset--color--harjedalskok-white, #fff) !important;
	cursor: wait;
	opacity: 1;
}

/* The native Related Products collection uses the same product blocks as the
   category template. Its wrapper opts into that shared card component; these
   rules only align its measure and responsive grid with one catalogue row. */
.related-products .catalog-body > .wp-block-woocommerce-product-collection {
	width: 100%;
	max-width: var(--wp--style--global--content-size) !important;
}

.related-products .wc-block-product-template.is-flex-container {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(max(150px, calc(20% - 1em)), 1fr));
}

.related-products .wc-block-product-template.is-flex-container > li.wc-block-product {
	width: auto;
}

.related-products .wc-block-product-template .wp-block-post-title,
.related-products .wc-block-product-template .wp-block-post-title a {
	font-size: 14px !important;
}

@media (max-width: 480px) {
	.product-specifications .row {
		grid-template-columns: minmax(6.5rem, 2fr) minmax(0, 3fr);
	}
}

@media (min-width: 782px) and (max-width: 1100px) {
	.hk-product > .product-layout {
		gap: 1.25rem;
	}

	.product-summary > .wp-block-post-title {
		font-size: 2rem;
	}

	.product-summary .price-line {
		align-items: flex-start;
		flex-direction: column;
		gap: 0;
	}
}

@media (min-width: 782px) {
	.hk-product > .product-layout {
		align-items: stretch;
	}

	.hk-product > .product-layout > .wp-block-column {
		flex: 1 1 0;
		min-width: 0;
	}

	.hk-product > .product-layout > .product-summary {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-block: 0.25rem;
	}

	.hk-product > .product-layout > .product-gallery > .wp-block-woocommerce-product-image-gallery {
		margin-inline-start: auto;
		max-width: 100%;
		width: fit-content;
	}
}

@media (max-width: 940px) {
	.product-summary .price-line {
		padding-block: 1.5rem;
	}
}

@media (max-width: 781px) {
	.hk-product > .product-layout {
		gap: 1.5rem;
	}

	.hk-product > .product-layout > .product-gallery {
		margin-inline: auto;
		max-width: min(100%, 30rem);
	}

	.product-summary .price-line {
		align-items: flex-start;
		flex-direction: column;
	}
}