/*
 * Kontur — podstawowe mapowanie WooCommerce na tokeny motywu.
 *
 * Arkusz wczytywany wyłącznie, gdy WooCommerce jest aktywne (inc/assets.php).
 * Zakres świadomie podstawowy: siatka produktów, karta produktu, ceny,
 * przyciski i komunikaty mają wyglądać jak reszta witryny — spójnie z paletą,
 * charakterem i osią przycisków. Bez własnych wariantów per oś.
 */

/* ── Siatka produktów ── */

.k-woo ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
	gap: var(--k-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-woo ul.products li.product {
	display: flex;
	flex-direction: column;
	gap: var(--k-space-2);
	min-inline-size: 0;
	background-color: var(--k-surface);
	border-radius: var(--k-radius-md);
	padding: var(--k-space-3);
}

.k-woo ul.products li.product img {
	inline-size: 100%;
	block-size: auto;
	border-radius: calc(var(--k-radius-md) - var(--k-border-w));
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background-color: var(--k-bg-subtle);
}

.k-woo .woocommerce-loop-product__title {
	font-family: var(--k-font-head);
	font-size: var(--k-fs-1);
	line-height: 1.3;
	color: var(--k-text);
}

.k-woo .price {
	color: var(--k-accent);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.k-woo .price del {
	color: var(--k-text-faint);
	font-weight: 400;
	margin-inline-end: 0.4em;
}

.k-woo .onsale {
	position: absolute;
	inset-block-start: var(--k-space-2);
	inset-inline-start: var(--k-space-2);
	z-index: 2;
	padding: 0.2em 0.7em;
	background-color: var(--k-accent);
	color: var(--k-accent-contrast);
	border-radius: var(--k-radius-sm);
	font-size: var(--k-fs--2);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.k-woo ul.products li.product {
	position: relative;
}

/* ── Przyciski Woo w języku przycisków motywu ── */

.k-woo .button,
.k-woo button.button,
.k-woo .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--k-space-1);
	padding: var(--k-space-1) var(--k-space-3);
	min-block-size: 44px;
	background-color: var(--k-accent);
	border: var(--k-border-w) solid var(--k-accent);
	border-radius: var(--k-radius-sm);
	color: var(--k-accent-contrast);
	font-family: var(--k-font-head);
	font-size: var(--k-fs--1);
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.k-woo .button:hover,
.k-woo button.button:hover,
.k-woo .single_add_to_cart_button:hover {
	background-color: var(--k-accent-hover);
	border-color: var(--k-accent-hover);
	color: var(--k-accent-contrast);
}

/* ── Karta produktu ── */

.k-woo div.product {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--k-space-5);
}

@media (min-width: 40em) {
	.k-woo div.product {
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		align-items: start;
	}

	.k-woo div.product .woocommerce-tabs,
	.k-woo div.product .related.products,
	.k-woo div.product .upsells.products {
		grid-column: 1 / -1;
	}
}

.k-woo div.product .woocommerce-product-gallery img {
	border-radius: var(--k-radius-md);
}

.k-woo .product_title {
	font-size: var(--k-fs-4);
	line-height: 1.15;
}

.k-woo div.product p.price {
	font-size: var(--k-fs-2);
}

.k-woo .woocommerce-product-details__short-description {
	color: var(--k-text-muted);
	line-height: var(--k-lh-body);
}

/* Zakładki opisu — podkreślenie zamiast pudełek. */
.k-woo .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k-space-3);
	margin: 0 0 var(--k-space-3);
	padding: 0;
	list-style: none;
	border-block-end: var(--k-border-w) solid var(--k-border);
}

.k-woo .woocommerce-tabs ul.tabs a {
	display: inline-block;
	padding-block: var(--k-space-1);
	color: var(--k-text-muted);
	font-weight: 600;
	text-decoration: none;
}

.k-woo .woocommerce-tabs ul.tabs li.active a {
	color: var(--k-text);
	box-shadow: inset 0 -2px 0 var(--k-accent);
}

/* ── Formularze i komunikaty ── */

.k-woo input.input-text,
.k-woo .quantity .qty,
.k-woo select {
	padding: var(--k-space-1) var(--k-space-2);
	background-color: var(--k-surface);
	border: var(--k-border-w) solid var(--k-border);
	border-radius: var(--k-radius-sm);
	color: var(--k-text);
	font: inherit;
	min-block-size: 44px;
}

.k-woo .woocommerce-message,
.k-woo .woocommerce-info,
.k-woo .woocommerce-error {
	margin-block: 0 var(--k-space-4);
	padding: var(--k-space-2) var(--k-space-3);
	background-color: var(--k-accent-subtle);
	border-inline-start: 3px solid var(--k-accent);
	border-radius: var(--k-radius-sm);
	color: var(--k-text);
	list-style: none;
}

.k-woo .woocommerce-error {
	border-inline-start-color: var(--k-accent-2);
}

/* ── Okruszki i paginacja Woo dziedziczą wygląd motywu ── */

.k-woo .woocommerce-breadcrumb {
	margin-block-end: var(--k-space-3);
	color: var(--k-text-faint);
	font-size: var(--k-fs--1);
}

.k-woo .woocommerce-breadcrumb a {
	color: var(--k-text-muted);
	text-decoration: none;
}

.k-woo nav.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k-space-1);
	margin: var(--k-space-5) 0 0;
	padding: 0;
	list-style: none;
	border: 0;
}

.k-woo nav.woocommerce-pagination ul li {
	border: 0;
}

.k-woo nav.woocommerce-pagination ul li a,
.k-woo nav.woocommerce-pagination ul li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: 44px;
	min-block-size: 44px;
	border-radius: var(--k-radius-sm);
	color: var(--k-text);
	text-decoration: none;
}

.k-woo nav.woocommerce-pagination ul li span.current {
	background-color: var(--k-accent);
	color: var(--k-accent-contrast);
}

.k-woo nav.woocommerce-pagination ul li a:hover {
	background-color: var(--k-bg-subtle);
}