/* === KOSMOTEKA — WOOCOMMERCE ARCHIVE / SHOP === */

/* Full-bleed layout for WC content area ONLY (NOT header — header zachowuje GP default 1200px) */
body.woocommerce .site-content,
body.woocommerce-page .site-content,
body.archive .site-content,
body.tax-product_cat .site-content,
body.single-product .site-content,
body.woocommerce #content,
body.woocommerce-page #content,
body.archive #content,
body.tax-product_cat #content,
body.single-product #content {
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	display: block !important;
}

/* Tylko grid-container WEWNĄTRZ #content, nie globalnie (żeby nie psuć header inside-header) */
body.woocommerce #content .grid-container,
body.woocommerce-page #content .grid-container,
body.archive #content .grid-container,
body.tax-product_cat #content .grid-container,
body.single-product #content .grid-container {
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.woocommerce #primary,
body.woocommerce-page #primary,
body.archive #primary,
body.tax-product_cat #primary,
body.single-product #primary {
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	float: none !important;
	flex: 1 1 100% !important;
	flex-basis: 100% !important;
}

body.woocommerce .content-area,
body.woocommerce-page .content-area,
body.archive .content-area,
body.tax-product_cat .content-area,
body.single-product .content-area {
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	float: none !important;
}

body.woocommerce article,
body.woocommerce-page article,
body.archive article,
body.tax-product_cat article,
body.single-product article {
	max-width: 100% !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.woocommerce .inside-article,
body.woocommerce-page .inside-article,
body.archive .inside-article,
body.tax-product_cat .inside-article,
body.single-product .inside-article {
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	background: transparent !important;
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
}

body.woocommerce .entry-content,
body.woocommerce-page .entry-content,
body.archive .entry-content,
body.tax-product_cat .entry-content,
body.single-product .entry-content {
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Inner wrapper for WC content with sane max-width and ample horizontal padding.
   GP separate-containers + woocommerce-page renders structure:
   main.site-main > .woocommerce-archive-wrapper > .inside-article > .entry-content > ul.products
   There is NO <article> tag on category archive, so we target the actual wrappers + fall back
   to direct padding on ul.products, header, toolbar and pagination. */
body.woocommerce .woocommerce-archive-wrapper,
body.woocommerce-page .woocommerce-archive-wrapper,
body.archive.tax-product_cat .site-main > article,
body.post-type-archive-product .site-main > article,
body.single-product .site-main > article {
	margin: 0 auto;
	padding: 0 0 clamp(60px, 8vw, 120px);
	width: 100%;
	box-sizing: border-box;
}

.woocommerce-products-header {
	padding: clamp(60px, 8vw, 120px) clamp(20px, 5vw, 60px) 0;
	max-width: 1480px;
	margin: 0 auto;
	box-sizing: border-box;
}
.woocommerce-products-header__title.page-title {
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 1.5rem + 4vw, 5rem);
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.025em;
	color: var(--text-primary);
	font-variation-settings: "opsz" 144;
	margin: 0 0 16px;
}

/* Eyebrow above heading */
.woocommerce-products-header::before {
	content: "OBSERWATORIUM";
	display: block;
	font-family: var(--font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.22em;
	color: var(--nebula-cyan);
	text-transform: uppercase;
	margin-bottom: 24px;
}

.term-description {
	font-size: 1.0625rem;
	color: var(--text-secondary);
	max-width: 720px;
	line-height: 1.55;
	margin-top: 24px;
}

/* Toolbar: result count + sort — wspólny rząd z bezpiecznymi paddingami, max-width = grid */
body.woocommerce .woocommerce-result-count,
body.woocommerce-page .woocommerce-result-count,
body.archive .woocommerce-result-count,
body.tax-product_cat .woocommerce-result-count {
	font-family: var(--font-mono);
	font-size: 0.8125rem !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--text-secondary, #b6bbd0) !important;
	float: none !important;
	margin: 24px auto 16px !important;
	max-width: 1480px;
	padding: 0 clamp(20px, 5vw, 60px) !important;
	box-sizing: border-box;
	display: block;
	font-weight: 500;
}

body.woocommerce .woocommerce-ordering,
body.woocommerce-page .woocommerce-ordering,
body.archive .woocommerce-ordering,
body.tax-product_cat .woocommerce-ordering {
	float: none !important;
	margin: -40px auto 16px !important;
	max-width: 1480px;
	padding: 0 clamp(20px, 5vw, 60px) !important;
	box-sizing: border-box;
	display: flex;
	justify-content: flex-end;
}

.woocommerce-ordering select {
	background: rgba(15, 23, 41, 0.7);
	color: var(--text-primary);
	border: 1px solid var(--border-strong);
	border-radius: 999px;
	padding: 10px 20px;
	font-family: var(--font-body);
	font-size: 0.875rem;
}

/* Product grid — centered max-width wrapper, safe inline padding, calm breathing */
.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: clamp(16px, 1.8vw, 28px) !important;
	margin: 40px auto 80px !important;
	max-width: 1480px;
	padding: 0 clamp(20px, 5vw, 60px) !important;
	box-sizing: border-box;
	list-style: none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none !important; }

/* Karta produktu — ciemny kosmiczny kafelek (jak hero) */
.woocommerce ul.products li.product {
	width: auto !important;
	min-width: 0 !important;
	float: none !important;
	margin: 0 !important;
	background: linear-gradient(180deg, rgba(20, 28, 50, 0.85), rgba(10, 14, 26, 0.7)) !important;
	border: 1px solid rgba(184, 212, 255, 0.10) !important;
	border-radius: 14px !important;
	padding: clamp(14px, 1.2vw, 22px) !important;
	transition: all 320ms cubic-bezier(0.22, 1, 0.36, 1) !important;
	text-align: left !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
	position: relative !important;
}

.woocommerce ul.products li.product:hover {
	border-color: rgba(77, 217, 255, 0.4) !important;
	box-shadow: 0 0 60px rgba(77, 217, 255, 0.18), 0 20px 48px rgba(0, 0, 0, 0.45) !important;
	transform: translateY(-4px);
}

.woocommerce ul.products li.product a {
	text-decoration: none;
}

.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
	display: flex !important;
	flex-direction: column !important;
	gap: 0;
}

/* Zdjęcie produktu — IDENTYCZNA technika jak HERO (drop-shadow + SVG cutout filter z mu-plugins/kosmoteka-image-cutout.php) */
.woocommerce ul.products li.product img {
	margin: 0 0 16px !important;
	background: transparent !important;
	border-radius: 0;
	padding: 0;
	width: 100%;
	height: clamp(140px, 16vw, 200px);
	object-fit: contain;
	filter: url(#kt-cutout-white) drop-shadow(0 16px 40px rgba(0, 0, 0, 0.55));
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}
.woocommerce ul.products li.product:hover img {
	transform: scale(1.04) translateY(-4px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
	font-family: var(--font-display) !important;
	font-size: 1.0625rem !important;
	font-weight: 400 !important;
	line-height: 1.3 !important;
	color: var(--text-primary) !important;
	letter-spacing: -0.005em;
	font-variation-settings: "opsz" 30;
	padding: 0 !important;
	margin-bottom: 6px !important;
	min-height: 2.6em;
}

.woocommerce ul.products li.product .price {
	font-family: var(--font-mono) !important;
	font-size: 1rem !important;
	color: var(--star-cream) !important;
	font-weight: 600 !important;
	letter-spacing: 0.015em !important;
	margin: 4px 0 12px !important;
}
.woocommerce ul.products li.product .price del {
	color: var(--text-tertiary) !important;
	opacity: 0.6;
	font-size: 0.875rem !important;
	margin-right: 8px;
}
.woocommerce ul.products li.product .price ins {
	background: transparent !important;
	color: var(--solar-amber) !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px !important;
	font-size: 0.75rem !important;
	border-radius: 999px !important;
	margin-top: auto !important;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.woocommerce ul.products li.product .added_to_cart {
	display: inline-block;
	margin-top: 8px;
	font-size: 0.8125rem;
	color: var(--success);
}

/* Hide stock count badge */
.woocommerce ul.products li.product .stock,
.woocommerce ul.products li.product .out-of-stock { display: none !important; }

/* Hide rating star placeholders if empty */
.woocommerce ul.products li.product .star-rating { margin: 0 0 8px; }

/* Sale badge */
.woocommerce ul.products li.product .onsale {
	background: var(--solar-amber) !important;
	color: var(--space-void) !important;
	font-family: var(--font-mono) !important;
	font-size: 0.625rem !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	padding: 4px 12px !important;
	border-radius: 999px !important;
	min-height: auto !important;
	min-width: auto !important;
	line-height: 1.4 !important;
	right: 16px !important;
	top: 16px !important;
	left: auto !important;
}

/* Pagination — minimal, mono, mobile-safe, w jednym wrapperze z gridem */
.woocommerce nav.woocommerce-pagination {
	margin: 64px auto;
	text-align: center;
	max-width: 1480px;
	padding: 0 clamp(20px, 5vw, 60px);
	box-sizing: border-box;
	overflow-x: auto;
}
.woocommerce nav.woocommerce-pagination ul {
	display: inline-flex;
	gap: 8px;
	border: 0 !important;
	flex-wrap: wrap;
	justify-content: center;
	max-width: 100%;
	padding: 0 8px;
}
.woocommerce nav.woocommerce-pagination ul li {
	border: 0 !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	background: var(--space-blue) !important;
	color: var(--text-secondary) !important;
	border: 1px solid var(--border-subtle) !important;
	border-radius: 8px !important;
	padding: 12px 18px !important;
	font-family: var(--font-mono) !important;
	font-size: 0.875rem !important;
	transition: all 240ms;
}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--space-mist) !important;
	border-color: var(--nebula-cyan) !important;
	color: var(--star-white) !important;
}

/* Breadcrumbs — tighter, less shouty */
.woocommerce-breadcrumb {
	font-family: var(--font-mono);
	font-size: 0.625rem !important;
	letter-spacing: 0.14em !important;
	color: var(--text-secondary) !important;
	text-transform: uppercase;
	margin: 24px auto 0 !important;
	max-width: 1480px;
	padding: 0 clamp(20px, 5vw, 60px) !important;
	font-weight: 500;
}
.woocommerce-breadcrumb a {
	color: var(--text-secondary);
	text-decoration: none;
}
.woocommerce-breadcrumb a:hover {
	color: var(--nebula-cyan);
}

/* Single product page */
body.single-product div.product {
	max-width: 1480px;
	margin: 0 auto;
	padding: clamp(40px, 5vw, 80px) clamp(20px, 5vw, 60px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(40px, 5vw, 80px);
	overflow: hidden;
}

body.single-product div.product .woocommerce-product-gallery {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	float: none !important;
	overflow: hidden !important;
}

body.single-product div.product .summary {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.single-product div.product .woocommerce-product-gallery__trigger {
	display: none !important;
}

body.single-product div.product .woocommerce-product-gallery__image img {
	background: radial-gradient(ellipse at center, rgba(77, 217, 255, 0.2), transparent 70%);
	padding: 40px;
	border-radius: 16px;
}

body.single-product div.product .summary {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.single-product div.product .product_title {
	font-family: var(--font-display);
	font-size: clamp(2rem, 1.5rem + 1.5vw, 3rem) !important;
	font-weight: 300 !important;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--text-primary);
	font-variation-settings: "opsz" 144;
	margin-bottom: 16px !important;
}

body.single-product div.product .price {
	font-family: var(--font-mono);
	font-size: 1.75rem !important;
	color: var(--star-cream) !important;
	font-weight: 500 !important;
	letter-spacing: 0.02em;
	margin: 0 0 24px !important;
}

body.single-product div.product .woocommerce-product-details__short-description {
	font-size: 1rem;
	color: var(--text-secondary);
	line-height: 1.6;
	margin-bottom: 32px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--border-subtle);
}

body.single-product div.product form.cart {
	margin: 32px 0 !important;
}

body.single-product div.product .quantity input[type="number"] {
	background: rgba(15, 23, 41, 0.5);
	border: 1px solid var(--border-strong);
	color: var(--text-primary);
	border-radius: 8px;
	padding: 12px 16px;
}

/* Product tabs */
body.single-product .woocommerce-tabs {
	grid-column: 1 / -1;
	margin-top: 64px !important;
}

body.single-product .woocommerce-tabs ul.tabs {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex;
	gap: 4px;
	border-bottom: 1px solid var(--border-subtle) !important;
}

body.single-product .woocommerce-tabs ul.tabs::before {
	display: none !important;
}

body.single-product .woocommerce-tabs ul.tabs li {
	background: transparent !important;
	border: 0 !important;
	border-bottom: 2px solid transparent !important;
	border-radius: 0 !important;
	margin: 0 !important;
}

body.single-product .woocommerce-tabs ul.tabs li.active {
	border-bottom-color: var(--nebula-cyan) !important;
	background: transparent !important;
}

body.single-product .woocommerce-tabs ul.tabs li a {
	font-family: var(--font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--text-secondary) !important;
	padding: 16px 24px !important;
}

body.single-product .woocommerce-tabs ul.tabs li.active a {
	color: var(--star-white) !important;
}

body.single-product .woocommerce-tabs .panel {
	padding: 32px 0 !important;
	margin: 0 !important;
	color: var(--text-secondary);
	line-height: 1.65;
	font-size: 1rem;
}

body.single-product .woocommerce-tabs .panel h2 {
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--text-primary);
	margin-bottom: 20px;
}

body.single-product .related.products,
body.single-product .upsells.products {
	grid-column: 1 / -1;
	margin-top: 64px;
}

body.single-product .related.products > h2,
body.single-product .upsells.products > h2 {
	font-family: var(--font-display);
	font-size: 2rem;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: var(--text-primary);
	margin-bottom: 32px;
	font-variation-settings: "opsz" 144;
}

/* WC zoom plugin image — disable, breaks layout on every breakpoint */
img.zoomImg {
	display: none !important;
	pointer-events: none !important;
	opacity: 0 !important;
}
.woocommerce-product-gallery,
.woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery__image {
	max-width: 100% !important;
	overflow: hidden !important;
}
.woocommerce-product-gallery img {
	max-width: 100% !important;
	height: auto !important;
}

/* Responsywne breakpointy — 4→3→2→1 kolumn, paddingi zachowane */
@media (max-width: 1180px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 1024px) {
	body.single-product div.product { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		padding: 0 20px !important;
	}
	.woocommerce ul.products li.product img {
		height: clamp(140px, 28vw, 200px);
	}
}
@media (max-width: 768px) {
	body.single-product div.product {
		padding: 24px 16px !important;
		gap: 24px !important;
	}
	body.single-product div.product .woocommerce-product-gallery,
	body.single-product div.product .summary {
		width: 100% !important;
		max-width: 100% !important;
	}
	body.single-product .product_title { font-size: 1.75rem !important; }

	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
		font-size: 0.9375rem !important;
		min-height: 2.6em !important;
		line-height: 1.25 !important;
	}
	.woocommerce ul.products li.product .price {
		font-size: 0.9375rem !important;
		margin: 6px 0 12px !important;
	}
	.woocommerce ul.products li.product .button,
	.woocommerce ul.products li.product a.button {
		padding: 10px 14px !important;
		font-size: 0.75rem !important;
		width: 100%;
	}
	.woocommerce-products-header__title.page-title { font-size: 2.5rem !important; }
	.woocommerce-products-header { padding: 56px 20px 0 !important; }
	body.woocommerce .woocommerce-archive-wrapper,
	body.woocommerce-page .woocommerce-archive-wrapper,
	body.archive .site-main > article,
	body.tax-product_cat .site-main > article,
	body.post-type-archive-product .site-main > article {
		padding: 16px 0 32px !important;
	}
}
@media (max-width: 480px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products {
		grid-template-columns: 1fr !important;
		gap: 14px !important;
		padding: 0 16px !important;
	}
	.woocommerce ul.products li.product img {
		height: 180px !important;
	}
	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 1rem !important;
		min-height: auto !important;
	}
	.woocommerce-products-header { padding: 48px 16px 0 !important; }
	body.woocommerce .woocommerce-result-count,
	body.woocommerce-page .woocommerce-result-count,
	body.woocommerce .woocommerce-ordering,
	body.woocommerce-page .woocommerce-ordering {
		padding: 0 16px !important;
	}
	body.woocommerce .woocommerce-ordering,
	body.woocommerce-page .woocommerce-ordering {
		margin-top: 0 !important;
		justify-content: stretch;
	}
	.woocommerce-ordering select { width: 100%; }
	.woocommerce nav.woocommerce-pagination { padding: 0 16px !important; }
}