/**
 * Archiwum sklepu WooCommerce.
 *
 * @package miod-wstazka
 */

/* ─── Manufaktura: paleta i tło archiwum ─── */
.shop-layout--manufaktura {
	--shop-cream: #f5f0e8;
	--shop-ink: #1a1410;
	--shop-honey: #c8860a;
	--shop-amber: #e8a020;
	--shop-honey-border: rgba(200, 134, 10, 0.15);
	--shop-honey-line: rgba(200, 134, 10, 0.2);
	--shop-shadow-soft: 0 8px 20px rgba(26, 20, 16, 0.08);
	--shop-shadow-hover: 0 14px 36px rgba(26, 20, 16, 0.14);
	background: var(--shop-cream);
}

.shop-layout--manufaktura .shop-main {
	min-width: 0;
}

.shop-main--is-loading {
	pointer-events: none;
	opacity: 0.55;
	transition: opacity 0.2s ease;
}

/* ─── Breadcrumbs (sklep) — hero ciemny ─── */
.shop-header .breadcrumbs {
	padding: var(--space-4) 0;
	border-bottom: 1px solid rgba(232, 201, 106, 0.12);
}

.shop-header .breadcrumbs__list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-2);
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: var(--text-xs);
	color: rgba(255, 255, 255, 0.45);
}

.shop-header .breadcrumbs__list a {
	color: rgba(255, 255, 255, 0.55);
	text-decoration: none;
}

.shop-header .breadcrumbs__list a:hover {
	color: var(--color-honey-light);
}

.shop-header .breadcrumbs__list li[aria-current="page"] {
	color: rgba(255, 255, 255, 0.88);
	font-weight: 500;
}

/* ─── Shop header — ciemny „miodowy” hero (plaster + złoto) ─── */
.shop-header {
	--shop-hero-bg-1: #1a120e;
	--shop-hero-bg-2: #2a1d14;
	--shop-hero-bg-3: #1e1510;
	background: linear-gradient(
		155deg,
		var(--shop-hero-bg-1) 0%,
		var(--shop-hero-bg-2) 42%,
		var(--shop-hero-bg-3) 100%
	);
	border-bottom: none;
	padding-block: var(--space-10);
	position: relative;
	overflow: hidden;
	color: rgba(255, 255, 255, 0.92);
}

.shop-header::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2px;
	z-index: 5;
	background: linear-gradient(
		90deg,
		transparent 0%,
		var(--color-honey-deep) 22%,
		var(--color-honey) 45%,
		var(--color-honey-light) 50%,
		var(--color-honey) 55%,
		var(--color-honey-deep) 78%,
		transparent 100%
	);
	pointer-events: none;
}

.shop-header__topline {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 4;
	background: linear-gradient(
		90deg,
		transparent 0%,
		var(--color-honey-deep) 18%,
		var(--color-honey) 50%,
		var(--color-honey-light) 52%,
		var(--color-honey) 55%,
		var(--color-honey-deep) 82%,
		transparent 100%
	);
	pointer-events: none;
}

.shop-header__hc {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background-image: var(--miod-svg-pattern-honeycomb);
	background-size: 56px 64px;
	opacity: 0.14;
}

.shop-header__glow {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background:
		radial-gradient(ellipse 90% 55% at 18% 35%, rgba(200, 152, 46, 0.12) 0%, transparent 55%),
		radial-gradient(ellipse 70% 50% at 85% 20%, rgba(232, 201, 106, 0.06) 0%, transparent 45%);
}

.shop-header__deco {
	position: absolute;
	pointer-events: none;
	z-index: 0;
	background-repeat: no-repeat;
	background-position: center;
}

.shop-header__deco--drop {
	left: -2%;
	top: 42%;
	width: min(120px, 22vw);
	height: min(140px, 26vw);
	background-image: var(--miod-svg-accent-drop);
	background-size: contain;
	opacity: 0.09;
	transform: rotate(-8deg);
}

.shop-header__deco--bee {
	top: 14%;
	right: 3%;
	width: min(100px, 18vw);
	height: min(100px, 18vw);
	background-image: var(--miod-svg-accent-bee-light);
	background-size: contain;
	opacity: 0.11;
}

.shop-header__hex {
	position: absolute;
	right: -6%;
	bottom: -18%;
	width: min(240px, 42vw);
	height: auto;
	pointer-events: none;
	z-index: 0;
	opacity: 1;
}

.shop-header .container {
	position: relative;
	z-index: 2;
}

.shop-header__inner {
	position: relative;
	z-index: 1;
}

.shop-header__content {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--space-8);
	margin-top: var(--space-5);
}

@media (max-width: 767px) {
	.shop-header__content {
		flex-direction: column;
	}

	.shop-header__deco--bee {
		top: 8%;
		opacity: 0.07;
	}
}

/* Etykieta „Sklep” — ornament jak w menu restauracji */
.shop-header__intro {
	max-width: 640px;
}

.shop-header .shop-header__eyebrow.eyebrow {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: clamp(0.75rem, 2vw, 1.25rem);
	color: #e8c88a;
	font-weight: 600;
	letter-spacing: 0.28em;
	font-size: 0.7rem;
	margin-bottom: var(--space-5);
}

.shop-header .shop-header__eyebrow::before,
.shop-header .shop-header__eyebrow::after {
	content: "";
	flex: 1 1 0;
	max-width: 140px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(232, 160, 32, 0.35), rgba(200, 134, 10, 0.85));
}

.shop-header .shop-header__eyebrow::after {
	background: linear-gradient(270deg, transparent, rgba(232, 160, 32, 0.35), rgba(200, 134, 10, 0.85));
}

.shop-header__title {
	font-family: "Playfair Display", var(--font-display), Georgia, serif;
	font-size: clamp(2.1rem, 4.2vw, 3rem);
	font-weight: 600;
	color: #fffaf3;
	margin: 0 0 var(--space-6);
	line-height: 1.08;
	letter-spacing: 0.01em;
	text-shadow: 0 2px 28px rgba(0, 0, 0, 0.35);
}

.shop-header__desc {
	font-size: var(--text-md);
	color: rgba(255, 248, 240, 0.72);
	max-width: 34rem;
	line-height: 1.9;
	margin: 0;
	font-weight: 400;
}

.shop-header__cats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: flex-start;
	padding-top: var(--space-2);
}

.shop-header .shop-cat-pill {
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.06em;
	padding: 0.55rem 1.15rem;
	border-radius: 3px;
	border: 1px solid #c8860a;
	background: transparent;
	color: #c8860a;
	text-decoration: none;
	white-space: nowrap;
	transition:
		background 0.22s ease,
		border-color 0.22s ease,
		color 0.22s ease;
}

.shop-header .shop-cat-pill:hover {
	background: rgba(232, 160, 32, 0.22);
	border-color: #e8a020;
	color: #fff8e8;
}

.shop-header .shop-cat-pill.is-active {
	background: #c8860a;
	border-color: #c8860a;
	color: #fff;
	box-shadow: 0 6px 22px rgba(200, 134, 10, 0.28);
}

/* Pills w toolbarze / innych miejscach — bez zmiany (tylko w hero) */
.shop-cat-pill {
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.5px;
	padding: 7px 16px;
	border-radius: var(--radius-full);
	border: 1.5px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-text-light);
	text-decoration: none;
	white-space: nowrap;
	transition: all var(--transition-fast);
}

.shop-cat-pill:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.shop-cat-pill.is-active {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: var(--color-honey-light);
}

/* ─── Layout ─── */
.shop-layout {
	position: relative;
	padding-block: var(--space-12);
}

.shop-layout__inner {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: var(--space-8);
	align-items: start;
}

@media (max-width: 1023px) {
	.shop-layout__inner {
		grid-template-columns: 1fr;
	}
}

.shop-sidebar {
	position: sticky;
	top: calc(var(--nav-height) + var(--space-4));
}

@media (max-width: 1023px) {
	.shop-sidebar {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: min(320px, 90vw);
		z-index: var(--z-modal, 100);
		background: var(--color-cream);
		overflow-y: auto;
		padding: var(--space-6);
		transform: translateX(-100%);
		transition: transform var(--transition-slow, 0.35s ease);
		box-shadow: var(--shadow-xl);
	}

	.shop-layout--manufaktura .shop-sidebar {
		background: var(--shop-cream, #f5f0e8);
		border-right: 1px solid var(--shop-honey-border, rgba(200, 134, 10, 0.15));
	}

	.shop-sidebar.is-open {
		transform: translateX(0);
	}
}

.shop-sidebar__overlay {
	display: none;
}

@media (max-width: 1023px) {
	.shop-sidebar__overlay {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(26, 22, 18, 0.5);
		z-index: calc(var(--z-modal, 100) - 1);
		opacity: 0;
		pointer-events: none;
		transition: opacity var(--transition-base);
	}

	.shop-sidebar__overlay.is-visible {
		opacity: 1;
		pointer-events: all;
	}
}

/* ─── Filters (panel manufaktury) ─── */
.shop-layout--manufaktura .shop-filters {
	background: var(--shop-cream, #f5f0e8);
	border: 1px solid var(--shop-honey-border, rgba(200, 134, 10, 0.15));
	border-radius: 10px;
	padding: var(--space-6);
	box-shadow: var(--shop-shadow-soft, 0 8px 20px rgba(26, 20, 16, 0.06));
}

.shop-filters {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
}

.shop-filters__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--space-6);
	padding-bottom: var(--space-4);
	border-bottom: 1px solid var(--shop-honey-line, rgba(200, 134, 10, 0.2));
}

.shop-layout--manufaktura .shop-filters__header {
	border-bottom-color: var(--shop-honey-line, rgba(200, 134, 10, 0.2));
}

.shop-filters__title {
	font-family: "Playfair Display", var(--font-display), Georgia, serif;
	font-size: var(--text-lg);
	font-weight: 600;
	color: var(--shop-ink, #1a1410);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.shop-layout--manufaktura .shop-filters__title {
	color: var(--shop-ink, #1a1410);
}

.shop-filters__clear {
	font-size: 0.7rem;
	font-weight: 500;
	color: var(--shop-honey, #c8860a);
	text-decoration: none;
	letter-spacing: 0.04em;
}

.shop-filters__clear:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
	color: #a66f08;
}

.filter-group {
	border-bottom: 1px solid var(--shop-honey-line, rgba(200, 134, 10, 0.2));
	padding-block: var(--space-4);
}

.shop-layout--manufaktura .filter-group {
	border-bottom-color: var(--shop-honey-line, rgba(200, 134, 10, 0.2));
}

.filter-group:last-of-type {
	border-bottom: none;
}

.filter-group__toggle {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: transparent;
	border: none;
	cursor: pointer;
	font-family: var(--font-body);
	font-size: var(--text-sm);
	font-weight: 600;
	color: var(--color-dark);
	padding: 0;
}

.filter-group__toggle svg {
	transition: transform var(--transition-base);
}

.filter-group__toggle[aria-expanded="false"] svg {
	transform: rotate(-90deg);
}

.filter-group__body {
	margin-top: var(--space-4);
	overflow: hidden;
}

.filter-group__body[hidden] {
	display: none;
}

.filter-radio-group,
.filter-check-group {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

.filter-radio,
.filter-check {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	cursor: pointer;
}

.filter-radio input,
.filter-check input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.filter-radio__label,
.filter-check__label {
	font-size: var(--text-sm);
	color: var(--color-text-light);
	position: relative;
	transition: color 0.2s ease, padding-left 0.22s ease;
}

.shop-layout--manufaktura .filter-radio__label {
	padding-left: 0;
}

.shop-layout--manufaktura .filter-radio:hover .filter-radio__label {
	color: var(--shop-honey, #c8860a);
	padding-left: 1rem;
}

.shop-layout--manufaktura .filter-radio__label::before {
	content: "→";
	position: absolute;
	left: 0;
	top: 0.05em;
	font-size: 0.75rem;
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity 0.2s ease, transform 0.22s ease;
	pointer-events: none;
	color: var(--shop-honey, #c8860a);
}

.shop-layout--manufaktura .filter-radio:hover .filter-radio__label::before {
	opacity: 1;
	transform: translateX(0);
}

.filter-radio:has(input:checked) .filter-radio__label,
.filter-check:has(input:checked) .filter-check__label {
	color: var(--color-dark);
	font-weight: 600;
}

.shop-layout--manufaktura .filter-radio:has(input:checked) .filter-radio__label {
	color: var(--shop-ink, #1a1410);
	padding-left: 0;
}

.shop-layout--manufaktura .filter-radio:has(input:checked) .filter-radio__label::before {
	display: none;
}

.filter-check__box {
	width: 18px;
	height: 18px;
	border-radius: 4px;
	border: 1.5px solid var(--color-border);
	flex-shrink: 0;
	transition: all var(--transition-fast);
	position: relative;
}

.shop-layout--manufaktura .filter-check__box {
	border-color: var(--shop-honey, #c8860a);
	background: rgba(245, 240, 232, 0.6);
}

.filter-check:has(input:checked) .filter-check__box {
	background: var(--color-dark);
	border-color: var(--color-dark);
}

.shop-layout--manufaktura .filter-check:has(input:checked) .filter-check__box {
	background: var(--shop-honey, #c8860a);
	border-color: var(--shop-honey, #c8860a);
}

.filter-check:has(input:checked) .filter-check__box::after {
	content: "";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: center / 10px 8px no-repeat
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 5l3.5 3.5L11 1'/%3E%3C/svg%3E");
}

.price-range__labels {
	display: flex;
	justify-content: space-between;
	font-size: var(--text-xs);
	font-weight: 600;
	color: var(--color-dark);
	margin-bottom: var(--space-4);
}

.price-range__track {
	position: relative;
	height: 4px;
	background: var(--color-border);
	border-radius: var(--radius-full);
	margin-block: var(--space-2);
}

.price-range__fill {
	position: absolute;
	height: 100%;
	left: 0;
	background: var(--color-honey);
	border-radius: var(--radius-full);
}

.price-range__thumb {
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--color-dark);
	border: 3px solid var(--color-white);
	box-shadow: var(--shadow-sm);
	cursor: grab;
	transition: transform var(--transition-fast);
	padding: 0;
	appearance: none;
}

.price-range__thumb:hover {
	transform: translate(-50%, -50%) scale(1.15);
}

.price-range__thumb:active {
	cursor: grabbing;
}

.shop-filters-toggle {
	display: none;
}

@media (max-width: 1023px) {
	.shop-filters-toggle {
		display: flex;
		align-items: center;
		gap: var(--space-2);
		font-size: var(--text-sm);
		font-weight: 600;
		color: var(--color-dark);
		background: var(--color-white);
		border: 1px solid var(--color-border);
		border-radius: var(--radius-md);
		padding: var(--space-3) var(--space-4);
		cursor: pointer;
		margin-bottom: var(--space-4);
	}
}

.shop-filters-toggle__count,
.shop-filter-toggle__count {
	background: var(--color-honey);
	color: var(--color-dark);
	font-size: 10px;
	font-weight: 700;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* ─── Main bar & grid ─── */
.shop-main__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	margin-bottom: var(--space-6);
	padding-bottom: var(--space-4);
	border-bottom: 1px solid var(--shop-honey-line, rgba(200, 134, 10, 0.2));
	flex-wrap: wrap;
}

.shop-layout--manufaktura .shop-main__bar {
	border-bottom-color: var(--shop-honey-line, rgba(200, 134, 10, 0.2));
}

.shop-main__count {
	font-size: 0.75rem;
	color: rgba(90, 78, 68, 0.55);
	margin: 0;
	font-weight: 400;
	letter-spacing: 0.03em;
	line-height: 1.5;
}

.shop-layout--manufaktura .shop-main__count {
	color: rgba(90, 78, 68, 0.52);
}

.shop-main__count strong {
	font-weight: 500;
	color: rgba(90, 78, 68, 0.62);
}

.shop-sort-select {
	padding: 0.55rem 2.35rem 0.55rem 0.85rem;
	border: 1px solid rgba(200, 134, 10, 0.35);
	border-radius: 6px;
	font-family: var(--font-body);
	font-size: var(--text-sm);
	color: var(--shop-ink, #1a1410);
	background-color: rgba(255, 255, 255, 0.65);
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23c8860a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.65rem center;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.shop-sort-select:hover,
.shop-sort-select:focus {
	border-color: var(--shop-honey, #c8860a);
	box-shadow: 0 0 0 3px rgba(200, 134, 10, 0.12);
	outline: none;
}

/* ─── Pagination ─── */
.shop-pagination {
	margin-top: var(--space-10);
}

.shop-pagination .page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	list-style: none;
	margin: 0;
	padding: 0;
	justify-content: center;
	align-items: center;
}

.shop-pagination .page-numbers li a,
.shop-pagination .page-numbers li span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 0.25rem;
	border-radius: var(--radius-md);
	font-size: var(--text-sm);
	font-weight: 500;
	text-decoration: none;
	border: 1px solid var(--color-border);
	color: var(--color-text);
	transition: all var(--transition-fast);
}

.shop-pagination .page-numbers li a:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.shop-pagination .page-numbers li span.current {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: var(--color-honey-light);
}

.shop-pagination .page-numbers li .prev,
.shop-pagination .page-numbers li .next {
	width: auto;
	padding-inline: var(--space-4);
}

/* ─── Empty ─── */
.shop-empty {
	text-align: center;
	padding: var(--space-20) var(--space-4);
}

.shop-empty__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--space-4);
	line-height: 0;
}

.shop-empty__icon svg {
	color: var(--color-honey);
	stroke: var(--color-honey);
}

.shop-empty__title {
	font-family: var(--font-display);
	font-size: var(--text-3xl);
	font-weight: 700;
	color: var(--color-dark);
	margin-bottom: var(--space-4);
}

.shop-empty__desc {
	font-size: var(--text-base);
	color: var(--color-text-muted);
	margin-bottom: var(--space-8);
	max-width: 440px;
	margin-inline: auto;
}

/* ══ Siatka archiwum + karty wariant C (woocommerce/content-product.php) ══ */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products.columns-3,
.products-grid--shop {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 1.25rem !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	float: none !important;
	width: 100% !important;
	align-items: stretch;
}

@media (max-width: 1024px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.products.columns-3,
	.products-grid--shop {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 580px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.products.columns-3,
	.products-grid--shop {
		grid-template-columns: 1fr !important;
	}
}

.woocommerce ul.products li.product,
.products li.product {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	float: none !important;
	clear: none !important;
	list-style: none;
}

/* ── Karta wariant C (.sc) ── */
.sc {
	background: #fffdf9;
	border: 1px solid #ede4d4;
	border-radius: 18px;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-direction: column;
	cursor: pointer;
	height: 100%;
	transition:
		background 0.4s cubic-bezier(0.34, 1.05, 0.64, 1),
		border-color 0.4s ease,
		transform 0.4s cubic-bezier(0.34, 1.05, 0.64, 1),
		box-shadow 0.4s ease;
	opacity: 0;
	transform: translateY(20px);
	animation: miod-sc-enter 0.5s cubic-bezier(0.34, 1.1, 0.64, 1) forwards;
}

.sc:hover,
.sc:focus-within {
	background: #1a1612;
	border-color: #c8982e;
	transform: translateY(-6px);
	box-shadow:
		0 24px 64px rgba(26, 22, 18, 0.25),
		0 0 0 1px rgba(200, 152, 46, 0.2);
}

.sc__top-line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(
		90deg,
		transparent,
		#c8982e,
		#e8c96a 50%,
		#c8982e,
		transparent
	);
	opacity: 0;
	transition: opacity 0.35s ease;
	z-index: 4;
	pointer-events: none;
}

.sc:hover .sc__top-line,
.sc:focus-within .sc__top-line {
	opacity: 1;
}

.sc__img-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.sc__img {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #ede4d4;
}

.sc__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sc:hover .sc__photo,
.sc:focus-within .sc__photo {
	transform: scale(1.06);
}

.sc__placeholder {
	width: 100%;
	height: 100%;
	min-height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #c8982e;
	position: relative;
	background: linear-gradient(160deg, #f5e6b8 0%, #e0c070 50%, #b08030 100%);
}

.sc__placeholder-hc {
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='46'%3E%3Cpolygon points='20,2 38,11 38,35 20,44 2,35 2,11' fill='none' stroke='%23ffffff' stroke-width='0.6'/%3E%3C/svg%3E");
	background-size: 40px 46px;
	opacity: 0.12;
	pointer-events: none;
}

.sc__img-hc {
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='42'%3E%3Cpolygon points='18,2 34,10 34,32 18,40 2,32 2,10' fill='none' stroke='%23ffffff' stroke-width='0.5'/%3E%3C/svg%3E");
	background-size: 36px 42px;
	opacity: 0.06;
	pointer-events: none;
	z-index: 1;
	transition: opacity 0.4s ease;
}

.sc:hover .sc__img-hc,
.sc:focus-within .sc__img-hc {
	opacity: 0.1;
}

.sc__badges {
	position: absolute;
	top: 12px;
	left: 12px;
	right: 12px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	z-index: 3;
	pointer-events: none;
	gap: 6px;
}

.sc__badge {
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 20px;
	line-height: 1;
	white-space: nowrap;
}

.sc__badge--honey {
	background: #c8982e;
	color: #fff;
}

.sc__badge--dark {
	background: #1a1612;
	color: #e8c96a;
}

.sc__badge--green {
	background: #4a7c59;
	color: #fff;
}

.sc__badge-sold {
	background: rgba(26, 22, 18, 0.68);
	backdrop-filter: blur(4px);
	color: rgba(255, 255, 255, 0.85);
	font-size: 9px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 20px;
	margin-left: auto;
	white-space: nowrap;
}

.sc__body {
	padding: 1.125rem 1.25rem 1.375rem;
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 0.375rem;
	min-width: 0;
}

.sc__cat {
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 1.8px;
	text-transform: uppercase;
	color: #c8982e;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 5px;
	transition: color 0.3s ease;
}

.sc__cat::before {
	content: "";
	width: 12px;
	height: 1px;
	background: #c8982e;
	flex-shrink: 0;
	transition: background 0.3s ease;
}

.sc:hover .sc__cat,
.sc:focus-within .sc__cat {
	color: #e8c96a;
}

.sc:hover .sc__cat::before,
.sc:focus-within .sc__cat::before {
	background: #e8c96a;
}

span.sc__cat.sc__cat--plain {
	cursor: default;
	pointer-events: none;
}

.sc__rating {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 2px;
	flex-wrap: wrap;
}

.sc__stars {
	color: #c8982e;
	font-size: 11px;
	letter-spacing: 0.5px;
	transition: color 0.3s ease;
}

.sc__rating-num {
	font-size: 11px;
	font-weight: 700;
	color: #1a1612;
	transition: color 0.3s ease;
}

.sc:hover .sc__rating-num,
.sc:focus-within .sc__rating-num {
	color: #e8c96a;
}

.sc__rating-count {
	font-size: 10px;
	color: #9b8e83;
	transition: color 0.3s ease;
}

.sc:hover .sc__rating-count,
.sc:focus-within .sc__rating-count {
	color: rgba(255, 255, 255, 0.3);
}

.sc__title {
	font-family: "Playfair Display", var(--font-display), Georgia, serif;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.2;
	margin: 2px 0 0;
}

.sc__title a {
	color: #1a1612;
	text-decoration: none;
	transition: color 0.35s ease;
}

.sc:hover .sc__title a,
.sc:focus-within .sc__title a {
	color: #fff;
}

.sc__hook {
	font-size: 11px;
	color: #9b8e83;
	line-height: 1.55;
	font-style: italic;
	flex: 1;
	margin: 0;
	transition: color 0.35s ease;
}

.sc:hover .sc__hook,
.sc:focus-within .sc__hook {
	color: rgba(255, 255, 255, 0.38);
}

.sc__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding-top: 0.875rem;
	border-top: 1px solid #ede4d4;
	margin-top: auto;
	transition: border-color 0.35s ease;
}

.sc:hover .sc__footer,
.sc:focus-within .sc__footer {
	border-top-color: rgba(200, 152, 46, 0.2);
}

.sc__price-wrap {
	display: flex;
	align-items: baseline;
	gap: 6px;
	flex-wrap: wrap;
}

.sc__price,
.sc__price-sale {
	font-family: "Playfair Display", var(--font-display), Georgia, serif;
	font-size: 1.2rem;
	font-weight: 700;
	color: #1a1612;
	transition: color 0.35s ease;
}

.sc__price .woocommerce-Price-currencySymbol,
.sc__price-sale .woocommerce-Price-currencySymbol,
.sc__price-old .woocommerce-Price-currencySymbol {
	font-weight: 400;
	font-family: var(--font-body), system-ui, sans-serif;
	opacity: 0.88;
}

.sc:hover .sc__price,
.sc:hover .sc__price-sale,
.sc:focus-within .sc__price,
.sc:focus-within .sc__price-sale {
	color: #e8c96a;
}

.sc__price-old {
	font-size: 11px;
	color: #9b8e83;
	text-decoration: line-through;
	transition: color 0.35s ease;
}

.sc:hover .sc__price-old,
.sc:focus-within .sc__price-old {
	color: rgba(255, 255, 255, 0.22);
}

a.sc__cta {
	text-decoration: none;
	color: inherit;
}

.sc__cta {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	font-weight: 600;
	font-family: inherit;
	color: #9b8e83;
	cursor: pointer;
	white-space: nowrap;
	opacity: 0;
	transform: translateX(-8px);
	transition:
		opacity 0.35s ease,
		transform 0.35s ease,
		color 0.2s ease;
	border: none;
	background: transparent;
	padding: 0;
	margin: 0;
	text-align: right;
}

.sc:hover .sc__cta,
.sc:focus-within .sc__cta {
	opacity: 1;
	transform: translateX(0);
	color: #e8c96a;
}

.sc__cta svg {
	stroke: currentcolor;
	flex-shrink: 0;
	fill: none;
	transition: transform 0.2s ease;
}

.sc__cta:hover svg {
	transform: translateX(3px);
}

.sc__hex {
	position: absolute;
	bottom: -18px;
	right: -18px;
	width: 72px;
	height: 72px;
	color: #c8982e;
	opacity: 0.04;
	pointer-events: none;
	transition:
		opacity 0.4s ease,
		transform 0.4s ease;
}

.sc:hover .sc__hex,
.sc:focus-within .sc__hex {
	opacity: 0.12;
	transform: rotate(10deg) scale(1.1);
}

.sc__atc-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.sc.is-adding .sc__cta {
	color: rgba(255, 255, 255, 0.5);
	pointer-events: none;
}

.sc.is-added .sc__cta {
	color: #7ec89a;
}

.products-grid--shop > .sc:nth-child(1) {
	animation-delay: 0.05s;
}

.products-grid--shop > .sc:nth-child(2) {
	animation-delay: 0.12s;
}

.products-grid--shop > .sc:nth-child(3) {
	animation-delay: 0.19s;
}

.products-grid--shop > .sc:nth-child(4) {
	animation-delay: 0.26s;
}

.products-grid--shop > .sc:nth-child(5) {
	animation-delay: 0.33s;
}

.products-grid--shop > .sc:nth-child(6) {
	animation-delay: 0.4s;
}

.products-grid--shop > .sc:nth-child(7) {
	animation-delay: 0.47s;
}

.products-grid--shop > .sc:nth-child(8) {
	animation-delay: 0.54s;
}

.products-grid--shop > .sc:nth-child(9) {
	animation-delay: 0.61s;
}

.woocommerce ul.products li.product:nth-child(1) .sc,
.woocommerce-page ul.products li.product:nth-child(1) .sc {
	animation-delay: 0.05s;
}

.woocommerce ul.products li.product:nth-child(2) .sc,
.woocommerce-page ul.products li.product:nth-child(2) .sc {
	animation-delay: 0.12s;
}

.woocommerce ul.products li.product:nth-child(3) .sc,
.woocommerce-page ul.products li.product:nth-child(3) .sc {
	animation-delay: 0.19s;
}

.woocommerce ul.products li.product:nth-child(4) .sc,
.woocommerce-page ul.products li.product:nth-child(4) .sc {
	animation-delay: 0.26s;
}

.woocommerce ul.products li.product:nth-child(5) .sc,
.woocommerce-page ul.products li.product:nth-child(5) .sc {
	animation-delay: 0.33s;
}

.woocommerce ul.products li.product:nth-child(6) .sc,
.woocommerce-page ul.products li.product:nth-child(6) .sc {
	animation-delay: 0.4s;
}

.woocommerce ul.products li.product:nth-child(7) .sc,
.woocommerce-page ul.products li.product:nth-child(7) .sc {
	animation-delay: 0.47s;
}

.woocommerce ul.products li.product:nth-child(8) .sc,
.woocommerce-page ul.products li.product:nth-child(8) .sc {
	animation-delay: 0.54s;
}

.woocommerce ul.products li.product:nth-child(9) .sc,
.woocommerce-page ul.products li.product:nth-child(9) .sc {
	animation-delay: 0.61s;
}

@keyframes miod-sc-enter {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.sc {
		animation: none;
		opacity: 1;
		transform: none;
	}

	.sc:hover .sc__photo,
	.sc:focus-within .sc__photo {
		transform: none;
	}
}

/* Toolbar / sort — wspólne z Woo (np. domyślny sklep) */
.shop-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	margin-bottom: var(--space-6);
	flex-wrap: wrap;
}

.shop-toolbar__count {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
}

.shop-toolbar__count strong {
	color: var(--color-dark);
	font-weight: 600;
}

.woocommerce-ordering select,
.shop-toolbar select,
.shop-sort-select {
	padding: var(--space-3) var(--space-10) var(--space-3) var(--space-4);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-body);
	font-size: var(--text-sm);
	color: var(--color-dark);
	background: white;
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B5D52' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--space-3) center;
	transition: border-color var(--transition-fast);
	outline: none;
}

.woocommerce-ordering select:focus,
.shop-toolbar select:focus,
.shop-sort-select:focus {
	border-color: var(--color-honey);
	box-shadow: 0 0 0 3px rgba(200, 152, 46, 0.1);
}

.woocommerce-pagination {
	margin-top: var(--space-12);
	display: flex;
	justify-content: center;
}

.woocommerce-pagination ul {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
	justify-content: center;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
	min-width: 40px;
	height: 40px;
	border-radius: var(--radius-md);
	border: 1.5px solid var(--color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--text-sm);
	font-weight: 500;
	color: var(--color-text-light);
	text-decoration: none;
	transition: all var(--transition-base);
	padding: 0 0.35rem;
}

.woocommerce-pagination ul li a:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.woocommerce-pagination ul li span.current {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: white;
}

.woocommerce-info {
	background: var(--color-cream);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	padding: var(--space-10);
	text-align: center;
	color: var(--color-text-muted);
	font-size: var(--text-base);
}

/* ═══ Sklep — plaster miodu (hive) ═══ */
.shop-layout--hive .shop-sidebar {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.shop-layout--hive .shop-layout__inner {
	grid-template-columns: 1fr;
}

@media (min-width: 1024px) {
	.shop-layout--hive .shop-layout__inner {
		grid-template-columns: 1fr;
	}
}

/* ── Plaster: toolbar + drawer filtrów ── */
.hive-toolbar.hive-toolbar--hive {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	max-width: 1060px;
	margin: 0 auto var(--space-8);
	padding: var(--space-4) var(--space-6);
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	flex-wrap: wrap;
}

.hive-toolbar--hive .hive-toolbar__count {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
}

.hive-toolbar--hive .hive-toolbar__count strong {
	color: var(--color-dark);
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: var(--text-lg);
	font-weight: 700;
}

.hive-toolbar--hive .hive-toolbar__right {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.hive-toolbar--hive .hive-toolbar__sep {
	width: 1px;
	height: 24px;
	background: var(--color-border);
	flex-shrink: 0;
}

.hive-sort {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	position: relative;
}

.hive-sort__label {
	color: var(--color-text-muted);
	display: flex;
	align-items: center;
}

.hive-sort__label svg {
	stroke: currentColor;
}

.hive-sort__select {
	font-family: var(--font-body), sans-serif;
	font-size: var(--text-sm);
	font-weight: 500;
	color: var(--color-dark);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-8) var(--space-2) var(--space-4);
	cursor: pointer;
	outline: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B5D52' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--space-3) center;
	background-size: 14px;
	transition: border-color var(--transition-fast);
}

.hive-sort__select:focus {
	border-color: var(--color-honey);
	box-shadow: 0 0 0 3px rgba(200, 152, 46, 0.1);
}

.hive-filter-toggle {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 600;
	font-family: var(--font-body), sans-serif;
	color: var(--color-dark);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-5);
	cursor: pointer;
	transition: all var(--transition-base);
	position: relative;
}

.hive-filter-toggle svg {
	stroke: currentColor;
}

.hive-filter-toggle:hover {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: #fff;
}

.hive-filter-toggle:hover svg {
	stroke: #fff;
}

.hive-filter-toggle[aria-expanded="true"] {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: #fff;
}

.hive-filter-toggle__count {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--color-honey);
	color: var(--color-dark);
	font-size: 10px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.hive-drawer {
	position: fixed;
	inset: 0;
	z-index: 9999;
	pointer-events: none;
	visibility: hidden;
	transition: visibility 0s linear 0.4s;
}

.hive-drawer.is-open {
	pointer-events: all;
	visibility: visible;
	transition: visibility 0s;
}

.hive-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(26, 22, 18, 0.5);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity 0.35s ease;
}

.hive-drawer.is-open .hive-drawer__overlay {
	opacity: 1;
}

.hive-drawer__panel {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 360px;
	max-width: 90vw;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.4s cubic-bezier(0.34, 1.05, 0.64, 1);
	box-shadow: -8px 0 40px rgba(26, 22, 18, 0.15);
}

.hive-drawer.is-open .hive-drawer__panel {
	transform: translateX(0);
}

.hive-drawer__header {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	padding: var(--space-6) var(--space-7);
	border-bottom: 1px solid var(--color-border);
	flex-shrink: 0;
	position: relative;
}

.hive-drawer__header-line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(
		90deg,
		transparent,
		var(--color-honey) 30%,
		var(--color-honey-light) 50%,
		var(--color-honey) 70%,
		transparent
	);
}

.hive-drawer__title {
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: var(--text-xl);
	font-weight: 700;
	color: var(--color-dark);
	display: flex;
	align-items: center;
	gap: var(--space-2);
	flex: 1;
	margin: 0;
}

.hive-drawer__title svg {
	stroke: var(--color-honey);
}

.hive-drawer__close {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--color-cream);
	border: 1px solid var(--color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--color-text-light);
	transition: all var(--transition-base);
	flex-shrink: 0;
}

.hive-drawer__close:hover {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: #fff;
}

.hive-drawer__body {
	flex: 1;
	overflow-y: auto;
	padding: var(--space-6) var(--space-7);
	display: flex;
	flex-direction: column;
	gap: 0;
}

.hive-drawer__group {
	padding-bottom: var(--space-6);
	margin-bottom: var(--space-6);
}

.hive-drawer__group-title {
	font-size: var(--text-xs);
	font-weight: 700;
	letter-spacing: 1.8px;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin: 0 0 var(--space-4);
}

.hive-drawer__sep {
	height: 1px;
	background: var(--color-border-light);
	margin-bottom: var(--space-6);
}

.hive-drawer__sort-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
	margin: 0;
	padding: 0;
}

.hive-drawer__sort-item {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	padding: var(--space-3) var(--space-4);
	border-radius: var(--radius-md);
	font-size: var(--text-sm);
	color: var(--color-text-light);
	cursor: pointer;
	transition: all var(--transition-fast);
}

.hive-drawer__sort-item:hover {
	background: var(--color-cream);
	color: var(--color-dark);
}

.hive-drawer__sort-item:has(.hive-drawer__radio:checked) {
	background: var(--color-cream-dark);
	color: var(--color-dark);
	font-weight: 600;
}

.hive-drawer__sort-item:has(.hive-drawer__radio:checked)::after {
	content: "";
	width: 14px;
	height: 14px;
	margin-left: auto;
	flex-shrink: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23C8982E' stroke-width='2.5' stroke-linecap='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / contain no-repeat;
}

.hive-drawer__radio {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.hive-drawer__cat-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	margin: 0;
	padding: 0;
}

.hive-drawer__cat-item {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	padding: var(--space-3) var(--space-4);
	border-radius: var(--radius-md);
	cursor: pointer;
	transition: background var(--transition-fast);
}

.hive-drawer__cat-item:hover {
	background: var(--color-cream);
}

.hive-drawer__check {
	width: 18px;
	height: 18px;
	border-radius: var(--radius-sm);
	border: 1.5px solid var(--color-border);
	cursor: pointer;
	flex-shrink: 0;
	accent-color: var(--color-honey);
}

.hive-drawer__cat-name {
	font-size: var(--text-sm);
	color: var(--color-text-light);
	flex: 1;
}

.hive-drawer__cat-count {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	background: var(--color-cream);
	border-radius: var(--radius-full);
	padding: 1px 8px;
}

.hive-drawer__price-row {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.hive-drawer__price-field {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.hive-drawer__price-field label {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	font-weight: 500;
}

.hive-drawer__price-input {
	width: 100%;
	padding: var(--space-3) var(--space-4);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-body), sans-serif;
	font-size: var(--text-sm);
	color: var(--color-dark);
	outline: none;
	background: var(--color-cream);
	transition: border-color var(--transition-fast);
}

.hive-drawer__price-input:focus {
	border-color: var(--color-honey);
	background: #fff;
	box-shadow: 0 0 0 3px rgba(200, 152, 46, 0.08);
}

.hive-drawer__price-sep {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	padding-top: 1.5rem;
	flex-shrink: 0;
}

.hive-drawer__footer {
	display: flex;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-7);
	border-top: 1px solid var(--color-border);
	flex-shrink: 0;
	background: #fff;
}

.hive-drawer__clear {
	flex: 1;
	padding: var(--space-3) var(--space-4);
	font-size: var(--text-sm);
	font-weight: 500;
	font-family: var(--font-body), sans-serif;
	color: var(--color-text-light);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	cursor: pointer;
	transition: all var(--transition-base);
}

.hive-drawer__clear:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.hive-drawer__apply {
	flex: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
}

.hive-drawer__apply svg {
	stroke: #fff;
}

/* ── Plaster miodu: mask-image (SVG), zdjęcie cover, flip 3D ── */
.hive-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-block: 0 var(--space-10);
	width: 100%;
	overflow: visible;
}

.hive-container {
	position: relative;
	flex-shrink: 0;
	margin-inline: auto;
	perspective: 900px;
	perspective-origin: 50% 40%;
}

.hive-hex {
	position: absolute;
	width: 320px;
	height: 369px;
	cursor: pointer;
	opacity: 0;
	animation: hive-in 0.55s cubic-bezier(0.34, 1.1, 0.64, 1) forwards;
}

.hive-container > .hive-hex:nth-child(1) { animation-delay: 0.05s; }
.hive-container > .hive-hex:nth-child(2) { animation-delay: 0.1s; }
.hive-container > .hive-hex:nth-child(3) { animation-delay: 0.15s; }
.hive-container > .hive-hex:nth-child(4) { animation-delay: 0.2s; }
.hive-container > .hive-hex:nth-child(5) { animation-delay: 0.25s; }
.hive-container > .hive-hex:nth-child(6) { animation-delay: 0.3s; }
.hive-container > .hive-hex:nth-child(7) { animation-delay: 0.35s; }
.hive-container > .hive-hex:nth-child(8) { animation-delay: 0.4s; }
.hive-container > .hive-hex:nth-child(9) { animation-delay: 0.45s; }
.hive-container > .hive-hex:nth-child(10) { animation-delay: 0.5s; }
.hive-container > .hive-hex:nth-child(11) { animation-delay: 0.55s; }
.hive-container > .hive-hex:nth-child(12) { animation-delay: 0.6s; }
.hive-container > .hive-hex:nth-child(13) { animation-delay: 0.65s; }
.hive-container > .hive-hex:nth-child(14) { animation-delay: 0.7s; }
.hive-container > .hive-hex:nth-child(15) { animation-delay: 0.75s; }
.hive-container > .hive-hex:nth-child(16) { animation-delay: 0.8s; }

@keyframes hive-in {
	from {
		opacity: 0;
		transform: translateY(14px) scale(0.94);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hive-hex {
		animation: none;
		opacity: 1;
	}
}

.hive-hex::before {
	content: "";
	position: absolute;
	inset: -3px;
	z-index: 0;
	opacity: 0.3;
	transition: opacity 0.35s ease;
	pointer-events: none;
	background: linear-gradient(135deg, #e8c96a, #c8982e, #8b6914);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 326 375'%3E%3Cpolygon points='163,0 326,93.75 326,281.25 163,375 0,281.25 0,93.75' fill='white'/%3E%3C/svg%3E");
	-webkit-mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 326 375'%3E%3Cpolygon points='163,0 326,93.75 326,281.25 163,375 0,281.25 0,93.75' fill='white'/%3E%3C/svg%3E");
	mask-size: 100% 100%;
	mask-repeat: no-repeat;
}

.hive-hex:hover::before {
	opacity: 1;
}

.hive-hex__flipper {
	width: 100%;
	height: 100%;
	position: relative;
	transform-style: preserve-3d;
	transition: transform 0.65s cubic-bezier(0.34, 1.05, 0.64, 1);
	z-index: 1;
}

.hive-hex:hover .hive-hex__flipper,
.hive-hex.is-flipped .hive-hex__flipper {
	transform: rotateY(180deg);
}

.hive-hex__front,
.hive-hex__back {
	position: absolute;
	inset: 0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	overflow: hidden;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 369'%3E%3Cpolygon points='160,0 320,92.25 320,276.75 160,369 0,276.75 0,92.25' fill='white'/%3E%3C/svg%3E");
	-webkit-mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 369'%3E%3Cpolygon points='160,0 320,92.25 320,276.75 160,369 0,276.75 0,92.25' fill='white'/%3E%3C/svg%3E");
	mask-size: 100% 100%;
	mask-repeat: no-repeat;
}

.hive-hex__front {
	transform: translateZ(1px);
	background: var(--color-dark, #1a1612);
	display: flex;
	flex-direction: column;
}

.hive-hex__img {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 0.6s ease;
	pointer-events: none;
}

.hive-hex:hover .hive-hex__img {
	transform: scale(1.06);
}

.hive-hex__grad {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 65%;
	background: linear-gradient(
		to top,
		rgba(26, 22, 18, 0.97) 0%,
		rgba(26, 22, 18, 0.65) 50%,
		transparent 100%
	);
	z-index: 2;
	pointer-events: none;
}

.hive-hex__badge {
	position: absolute;
	top: 14%;
	left: 50%;
	transform: translateX(-50%);
	font-size: 7.5px;
	font-weight: 700;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	padding: 3px 12px;
	border-radius: 20px;
	white-space: nowrap;
	z-index: 5;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	pointer-events: none;
}

.hive-hex__body {
	position: absolute;
	bottom: 9%;
	left: 0;
	right: 0;
	text-align: center;
	padding: 0 12%;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	pointer-events: none;
}

.hive-hex__cat {
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--color-honey-light);
	opacity: 0.7;
	display: block;
}

.hive-hex__stars {
	color: var(--color-honey);
	font-size: 10px;
	letter-spacing: 1px;
	display: block;
}

.hive-hex__name {
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	line-height: 1.2;
	text-decoration: none;
	display: block;
	pointer-events: auto;
}

.hive-hex__price {
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: 13px;
	font-weight: 700;
	color: var(--color-honey-light);
	display: block;
}

.hive-hex__back {
	background: linear-gradient(155deg, #1a1612 0%, #2d2318 100%);
	transform: rotateY(180deg) translateZ(1px);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
}

.hive-hex__back-hc {
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='25'%3E%3Cpolygon points='11,2 20,7 20,18 11,23 2,18 2,7' fill='none' stroke='%23C8982E' stroke-width='0.5'/%3E%3C/svg%3E");
	background-size: 22px 25px;
	opacity: 0.07;
	pointer-events: none;
}

.hive-hex__back-line {
	position: absolute;
	top: 26%;
	left: 14%;
	right: 14%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(200, 152, 46, 0.45), transparent);
	pointer-events: none;
}

.hive-hex__back-inner {
	position: relative;
	z-index: 1;
	padding: 28% 15% 26%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	height: 100%;
}

.hive-hex__back-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin-bottom: 4px;
}

.hive-hex__back-tag {
	font-size: 8.5px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--color-honey);
	text-align: center;
	margin: 0;
}

.hive-hex__back-name {
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	line-height: 1.2;
	text-align: center;
	margin: 0;
}

.hive-hex__back-stars {
	color: var(--color-honey);
	font-size: 10px;
	text-align: center;
	letter-spacing: 0.5px;
	margin: 0;
}

.hive-hex__back-ings {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 3px;
	width: 100%;
	flex: 1;
	justify-content: center;
	margin: 0;
	padding: 0;
}

.hive-hex__back-ings li {
	display: flex;
	align-items: baseline;
	gap: 6px;
	width: 100%;
	font-size: 11px;
	color: rgba(255, 255, 255, 0.52);
	line-height: 1.3;
}

.hive-hex__back-ings li::before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--color-honey);
	flex-shrink: 0;
}

.hive-hex__back-ings li em {
	margin-left: auto;
	font-style: normal;
	font-size: 9px;
	color: rgba(255, 255, 255, 0.25);
}

.hive-hex__back-stars span {
	color: rgba(255, 255, 255, 0.3);
}

.hive-hex__back-hook {
	font-size: 10px;
	color: rgba(255, 255, 255, 0.4);
	font-style: italic;
	line-height: 1.6;
	text-align: center;
	flex: 1;
	display: flex;
	align-items: center;
	margin: 0;
}

.hive-hex__back-cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	margin-top: auto;
	width: 100%;
}

.hive-hex__back-price-small {
	font-family: var(--font-display), "Playfair Display", Georgia, serif;
	font-size: 13px;
	font-weight: 700;
	color: rgba(200, 152, 46, 0.7);
	text-align: center;
}

/* Sklep — rewers jak sekcja bestsellerów na stronie głównej */
.hive-wrap .hive-hex__back-inner {
	padding: clamp(28px, 19%, 58px) 10% clamp(5px, 7%, 22px);
	gap: 4px;
}

.hive-wrap .hive-hex__back-head {
	margin-top: 14px;
}

.hive-wrap .hive-hex__back-tag {
	font-size: 9px;
	letter-spacing: 1.35px;
}

.hive-wrap .hive-hex__back-name {
	font-size: 15px;
	line-height: 1.22;
}

.hive-wrap .hive-hex__back-line {
	top: 40%;
}

.hive-wrap .hive-hex__back-cta {
	transform: translateY(-14px);
}

/* Jak .bs-hex__atc na stronie głównej (bestsellery) */
.hive-hex__atc {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 100%;
	padding: 8px 14px;
	background: var(--color-honey);
	color: var(--color-dark);
	font-family: var(--font-body);
	font-size: 10px;
	font-weight: 700;
	border-radius: var(--radius-full);
	border: none;
	cursor: pointer;
	white-space: nowrap;
	transition: all var(--transition-base);
	text-decoration: none;
	box-sizing: border-box;
}

.hive-hex__atc:hover {
	background: var(--color-honey-light);
	transform: scale(1.03);
}

.hive-hex__atc svg {
	stroke: var(--color-dark);
	flex-shrink: 0;
}

@media (max-width: 1060px) {
	.hive-container {
		transform: scale(0.82);
		transform-origin: top center;
		margin-bottom: calc(var(--hive-h, 660px) * -0.18);
	}
}

@media (max-width: 860px) {
	.hive-container {
		transform: scale(0.62);
		transform-origin: top center;
		margin-bottom: calc(var(--hive-h, 660px) * -0.38);
	}
}

@media (max-width: 640px) {
	.hive-container {
		transform: scale(0.46);
		transform-origin: top center;
		margin-bottom: calc(var(--hive-h, 660px) * -0.54);
	}
}

@media (max-width: 420px) {
	.hive-container {
		transform: scale(0.34);
		transform-origin: top center;
		margin-bottom: calc(var(--hive-h, 660px) * -0.66);
	}
}

/*
 * Mobile: jedna kolumna zamiast plastra 3×N (scale zostawiał szeroki „layout box” → overflow w prawo).
 */
@media (max-width: 768px) {
	.hive-wrap {
		overflow-x: clip;
		align-items: stretch;
		padding-inline: 0;
	}

	.shop-layout--hive .hive-container,
	#hive-container {
		transform: none !important;
		transform-origin: top center;
		width: 100% !important;
		max-width: 100%;
		height: auto !important;
		min-height: 0 !important;
		margin-bottom: 0 !important;
		margin-inline: auto;
		position: relative !important;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--space-8);
	}

	.shop-layout--hive .hive-container .hive-hex,
	#hive-container .hive-hex {
		position: relative !important;
		inset: auto !important;
		left: auto !important;
		top: auto !important;
		width: min(320px, 100%) !important;
		max-width: 100%;
		height: auto !important;
		aspect-ratio: 320 / 369;
		flex-shrink: 0;
		animation: none;
		opacity: 1;
	}

	#hive-container:has(.sf-no-results) {
		height: auto !important;
		min-height: 220px;
		padding-block: var(--space-4);
	}

	.hive-legend {
		justify-content: center;
		flex-wrap: wrap;
		margin-inline: auto;
		padding-inline: var(--space-2);
	}

	.hive-legend__hint--hover {
		display: none;
	}

	.hive-legend__hint--touch {
		display: inline;
	}
}

.hive-legend__hint--touch {
	display: none;
}

.hive-legend {
	margin-top: 2.5rem;
	font-size: 11px;
	color: var(--color-text-muted);
	display: flex;
	align-items: center;
	gap: 10px;
	text-align: center;
	max-width: 992px;
}

.hive-legend::before,
.hive-legend::after {
	content: "";
	width: 28px;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--color-honey));
	flex-shrink: 0;
}

.hive-legend::after {
	background: linear-gradient(90deg, var(--color-honey), transparent);
}

/* Przycisk filtrów (hive) — współdzielony z drawerem (#shop-filter-toggle) */
.shop-toolbar__right {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.shop-filter-toggle,
.hive-filter-btn {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 500;
	font-family: var(--font-body);
	color: var(--color-dark);
	background: #fff;
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-5);
	cursor: pointer;
	transition: all var(--transition-base);
}

.shop-filter-toggle:hover,
.hive-filter-btn:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.shop-filter-toggle[aria-expanded="true"],
.hive-filter-btn[aria-expanded="true"] {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: #fff;
}

.shop-filter-toggle svg,
.hive-filter-btn svg {
	stroke: currentColor;
}

.shop-filter-drawer {
	position: fixed;
	inset: 0;
	z-index: 9999;
	pointer-events: none;
	visibility: hidden;
}

.shop-filter-drawer.is-open {
	pointer-events: all;
	visibility: visible;
}

.shop-filter-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(26, 22, 18, 0.55);
	backdrop-filter: blur(4px);
	opacity: 0;
	transition: opacity 0.35s ease;
}

.shop-filter-drawer.is-open .shop-filter-drawer__overlay {
	opacity: 1;
}

.shop-filter-drawer__panel {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 360px;
	max-width: 90vw;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.4s cubic-bezier(0.34, 1.05, 0.64, 1);
	overflow: hidden;
}

.shop-filter-drawer.is-open .shop-filter-drawer__panel {
	transform: translateX(0);
}

.shop-filter-drawer__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-6) var(--space-7);
	border-bottom: 1px solid var(--color-border);
	flex-shrink: 0;
	position: relative;
}

.shop-filter-drawer__header::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, var(--color-honey), transparent);
}

.shop-filter-drawer__title {
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 700;
	color: var(--color-dark);
}

.shop-filter-drawer__close {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--color-cream);
	border: 1px solid var(--color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--color-text-light);
	transition: all var(--transition-base);
}

.shop-filter-drawer__close:hover {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: #fff;
}

.shop-filter-drawer__body {
	flex: 1;
	overflow-y: auto;
	padding: var(--space-6) var(--space-7);
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

.shop-filter-group {
	padding-bottom: var(--space-6);
	border-bottom: 1px solid var(--color-border-light);
}

.shop-filter-group:last-child {
	border-bottom: none;
}

.shop-filter-group__title {
	font-size: var(--text-xs);
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--color-text-light);
	margin-bottom: var(--space-4);
}

.shop-filter-sort {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.shop-filter-sort__item {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	font-size: var(--text-sm);
	color: var(--color-text-light);
	cursor: pointer;
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-md);
	transition: all var(--transition-fast);
}

.shop-filter-sort__item:hover {
	background: var(--color-cream);
	color: var(--color-honey);
}

.shop-filter-sort__item.is-active {
	color: var(--color-dark);
	font-weight: 600;
}

.shop-filter-sort__radio {
	accent-color: var(--color-honey);
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.shop-filter-cats {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.shop-filter-cats__item {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	font-size: var(--text-sm);
	color: var(--color-text-light);
	cursor: pointer;
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-md);
	transition: background var(--transition-fast);
}

.shop-filter-cats__item:hover {
	background: var(--color-cream);
}

.shop-filter-cats__check {
	accent-color: var(--color-honey);
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.shop-filter-price__inputs {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.shop-filter-price__field {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.shop-filter-price__field label {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	font-weight: 500;
}

.shop-filter-price__input {
	width: 100%;
	padding: var(--space-3) var(--space-4);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-body);
	font-size: var(--text-sm);
	color: var(--color-dark);
	outline: none;
	transition: border-color var(--transition-fast);
}

.shop-filter-price__input:focus {
	border-color: var(--color-honey);
}

.shop-filter-price__sep {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	padding-top: 1.5rem;
	flex-shrink: 0;
}

.shop-filter-drawer__footer {
	display: flex;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-7);
	border-top: 1px solid var(--color-border);
	flex-shrink: 0;
}

.shop-filter-drawer__footer .btn {
	flex: 1;
	justify-content: center;
}

/* Paginacja ukrywana po filtrze AJAX składników (pełny reset przez miod_shop_loop ją przywraca). */
.shop-pagination.is-sf-hidden {
	display: none !important;
}

/* ── Toolbar + drawer filtrów składników (sf-*) ── */

.sf-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	max-width: 1060px;
	margin: 0 auto var(--space-8);
	padding: var(--space-4) var(--space-6);
	background: white;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	flex-wrap: wrap;
	position: relative;
}

.sf-toolbar::before {
	content: '';
	position: absolute;
	top: 0;
	left: 10%;
	right: 10%;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--color-honey), transparent);
	border-radius: var(--radius-full);
}

.sf-toolbar__left {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	flex-wrap: wrap;
	flex: 1;
}

.sf-toolbar__right {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.sf-toolbar__count {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	white-space: nowrap;
}

.sf-toolbar__count strong {
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 700;
	color: var(--color-dark);
}

.sf-active-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.sf-active-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-xs);
	font-weight: 500;
	color: var(--color-honey-deep);
	background: var(--color-honey-glow);
	border: 1px solid rgba(200, 152, 46, 0.3);
	border-radius: var(--radius-full);
	padding: 3px 10px;
	cursor: pointer;
	transition: all var(--transition-fast);
}

.sf-active-tag:hover {
	background: var(--color-honey);
	color: white;
	border-color: var(--color-honey);
}

.sf-active-tag svg {
	stroke: currentColor;
}

.sf-sort-select {
	font-family: var(--font-body);
	font-size: var(--text-sm);
	font-weight: 500;
	color: var(--color-dark);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-8) var(--space-2) var(--space-4);
	cursor: pointer;
	outline: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236B5D52' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	transition: border-color var(--transition-fast);
}

.sf-sort-select:focus {
	border-color: var(--color-honey);
	box-shadow: 0 0 0 3px rgba(200, 152, 46, 0.1);
}

.sf-filter-btn {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 600;
	font-family: var(--font-body);
	color: white;
	background: var(--color-dark);
	border: 1.5px solid var(--color-dark);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-5);
	cursor: pointer;
	transition: all var(--transition-base);
	position: relative;
}

.sf-filter-btn svg {
	stroke: currentColor;
}

.sf-filter-btn:hover {
	background: var(--color-honey);
	border-color: var(--color-honey);
	color: var(--color-dark);
}

.sf-filter-btn__count {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--color-honey);
	color: var(--color-dark);
	font-size: 10px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

/* ── Drawer filtrów składników — reguły klas (animacja, struktura) ── */
.sf-drawer {
	position: fixed;
	inset: 0;
	z-index: 99999;
	pointer-events: none;
	visibility: hidden;
	opacity: 0;
	transition:
		visibility 0s linear 0.4s,
		opacity 0s linear 0.4s;
}

.sf-drawer.is-open {
	pointer-events: all;
	visibility: visible;
	opacity: 1;
	transition:
		visibility 0s,
		opacity 0s;
}

.sf-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(26, 22, 18, 0.52);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity 0.35s ease;
}

.sf-drawer.is-open .sf-drawer__overlay {
	opacity: 1;
}

.sf-drawer__panel {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 400px;
	max-width: 92vw;
	background: white;
	display: flex;
	flex-direction: column;
	transform: translateX(110%);
	transition: transform 0.4s cubic-bezier(0.34, 1.05, 0.64, 1);
	box-shadow: -16px 0 56px rgba(26, 22, 18, 0.16);
	border-left: 1px solid var(--color-border);
	z-index: 1;
}

.sf-drawer.is-open .sf-drawer__panel {
	transform: translateX(0);
}

/* ── ID-reguły drawera (najwyższy priorytet, nadpisują każdy konflikt) ── */
#sf-drawer {
	position: fixed !important;
	inset: 0 !important;
	z-index: 999999 !important;
	pointer-events: none;
	visibility: hidden;
}

#sf-drawer.is-open {
	pointer-events: all !important;
	visibility: visible !important;
}

#sf-drawer .sf-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(26, 22, 18, 0.52);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity 0.35s ease;
	cursor: pointer;
}

#sf-drawer.is-open .sf-drawer__overlay {
	opacity: 1;
}

#sf-drawer .sf-drawer__panel {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: auto !important;
	width: 400px;
	max-width: 92vw;
	background: #ffffff;
	display: flex;
	flex-direction: column;
	transform: translateX(110%) !important;
	transition: transform 0.4s cubic-bezier(0.34, 1.05, 0.64, 1) !important;
	box-shadow: -12px 0 48px rgba(26, 22, 18, 0.16);
	border-left: 1px solid #ede4d4;
	z-index: 1;
	overflow: hidden;
}

#sf-drawer.is-open .sf-drawer__panel {
	transform: translateX(0) !important;
}

.sf-drawer__head {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-6);
	border-bottom: 1px solid var(--color-border);
	flex-shrink: 0;
	position: relative;
}

.sf-drawer__head-line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(
		90deg,
		transparent,
		var(--color-honey) 30%,
		var(--color-honey-light) 50%,
		var(--color-honey) 70%,
		transparent
	);
}

.sf-drawer__head-left {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	flex: 1;
}

.sf-drawer__head-title {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 700;
	color: var(--color-dark);
	margin: 0;
}

.sf-drawer__close {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--color-cream);
	border: 1px solid var(--color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--color-text-light);
	transition: all var(--transition-base);
	flex-shrink: 0;
}

.sf-drawer__close:hover {
	background: var(--color-dark);
	color: white;
	border-color: var(--color-dark);
}

.sf-search-wrap {
	padding: var(--space-4) var(--space-6);
	border-bottom: 1px solid var(--color-border-light);
	flex-shrink: 0;
	background: var(--color-cream);
}

.sf-search {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	background: white;
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-4);
	transition: border-color var(--transition-fast);
}

.sf-search:focus-within {
	border-color: var(--color-honey);
	box-shadow: 0 0 0 3px rgba(200, 152, 46, 0.08);
}

.sf-search__icon {
	stroke: var(--color-text-muted);
}

.sf-search__input {
	flex: 1;
	font-family: var(--font-body);
	font-size: var(--text-sm);
	color: var(--color-dark);
	border: none;
	outline: none;
	background: transparent;
}

.sf-search__input::placeholder {
	color: var(--color-text-muted);
}

.sf-search__clear {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-border);
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--color-text-light);
	flex-shrink: 0;
	transition: all var(--transition-fast);
}

.sf-search__clear:hover {
	background: var(--color-dark);
	color: white;
}

.sf-drawer__body {
	flex: 1;
	overflow-y: auto;
	padding: var(--space-6);
	display: flex;
	flex-direction: column;
	gap: 0;
}

.sf-section {
	margin-bottom: var(--space-6);
}

.sf-section__head {
	margin-bottom: var(--space-4);
}

.sf-section__title {
	font-size: var(--text-base);
	font-weight: 700;
	color: var(--color-dark);
	margin: 0 0 var(--space-1);
}

.sf-section__hint {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
}

.sf-sep {
	height: 1px;
	background: var(--color-border-light);
	margin-bottom: var(--space-6);
}

.sf-ings-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.sf-ing-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 500;
	color: var(--color-text-light);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-full);
	padding: var(--space-2) var(--space-4);
	cursor: pointer;
	transition: all 0.2s ease;
	user-select: none;
}

.sf-ing-tag:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
	background: var(--color-honey-glow);
}

.sf-ing-tag.is-selected {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: white;
}

.sf-ing-tag.is-selected:hover {
	background: var(--color-honey);
	border-color: var(--color-honey);
	color: var(--color-dark);
}

.sf-ing-tag__check {
	display: none;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.sf-ing-tag.is-selected .sf-ing-tag__check {
	display: inline-flex;
}

.sf-ing-tag__check svg {
	stroke: var(--color-honey-light);
}

.sf-ing-tag.is-selected:hover .sf-ing-tag__check svg {
	stroke: var(--color-dark);
}

.sf-ings-loading {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.sf-skeleton {
	height: 34px;
	width: 100px;
	border-radius: var(--radius-full);
	background: linear-gradient(
		90deg,
		var(--color-cream) 25%,
		var(--color-cream-dark) 50%,
		var(--color-cream) 75%
	);
	background-size: 200% 100%;
	animation: sf-shimmer 1.5s infinite;
}

.sf-skeleton--short {
	width: 70px;
}

@keyframes sf-shimmer {
	0% {
		background-position: 200% 0;
	}

	100% {
		background-position: -200% 0;
	}
}

.sf-hidden {
	display: none !important;
}

.sf-ings-empty {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	text-align: center;
	padding: var(--space-6) 0;
}

.sf-cats-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.sf-cat-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 500;
	color: var(--color-text-light);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-full);
	padding: var(--space-2) var(--space-4);
	cursor: pointer;
	transition: all 0.2s ease;
}

.sf-cat-tag__count {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	background: white;
	border-radius: var(--radius-full);
	padding: 1px 7px;
	margin-left: 2px;
}

.sf-cat-tag:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.sf-cat-tag.is-selected {
	background: var(--color-dark);
	border-color: var(--color-dark);
	color: white;
}

.sf-cat-tag.is-selected .sf-cat-tag__count {
	background: rgba(255, 255, 255, 0.15);
	color: rgba(255, 255, 255, 0.7);
}

.sf-price-display {
	font-size: var(--text-sm);
	font-weight: 600;
	color: var(--color-honey);
}

.sf-price-inputs {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.sf-price-field {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.sf-price-field label {
	font-size: var(--text-xs);
	font-weight: 600;
	color: var(--color-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.8px;
}

.sf-price-input-wrap {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	background: var(--color-cream);
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-4);
	transition: border-color var(--transition-fast);
}

.sf-price-input-wrap:focus-within {
	border-color: var(--color-honey);
}

.sf-price-input {
	flex: 1;
	font-family: var(--font-display);
	font-size: var(--text-base);
	font-weight: 700;
	color: var(--color-dark);
	border: none;
	outline: none;
	background: transparent;
	width: 60px;
}

.sf-price-input-wrap span {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	flex-shrink: 0;
}

.sf-price-dash {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
	flex-shrink: 0;
	padding-top: 1.4rem;
}

.sf-drawer__foot {
	display: flex;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-6);
	border-top: 1px solid var(--color-border);
	flex-shrink: 0;
	background: var(--color-cream);
}

.sf-btn-clear {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 500;
	font-family: var(--font-body);
	color: var(--color-text-light);
	background: white;
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-4);
	cursor: pointer;
	transition: all var(--transition-base);
}

.sf-btn-clear svg {
	stroke: currentColor;
}

.sf-btn-clear:hover {
	border-color: var(--color-honey);
	color: var(--color-honey);
}

.sf-btn-clear--inline {
	flex: 0 0 auto;
}

.sf-btn-apply {
	flex: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	font-size: var(--text-sm);
	font-weight: 700;
	font-family: var(--font-body);
	color: var(--color-dark);
	background: var(--color-honey);
	border: none;
	border-radius: var(--radius-md);
	padding: var(--space-4) var(--space-6);
	cursor: pointer;
	transition: all var(--transition-base);
}

.sf-btn-apply svg {
	stroke: var(--color-dark);
}

.sf-btn-apply:hover {
	background: var(--color-honey-light);
	transform: translateY(-1px);
}

.sf-btn-apply__count {
	font-size: var(--text-xs);
	opacity: 0.7;
}

.sf-hive-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-4);
	color: var(--color-text-muted);
}

.sf-hive-loading__bee {
	font-size: 48px;
	animation: bee-float 6s ease-in-out infinite;
}

.sf-hive-loading p {
	font-size: var(--text-base);
	font-weight: 500;
}

.sf-hive-loading__dots {
	display: flex;
	gap: var(--space-2);
}

.sf-hive-loading__dots span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--color-honey);
	animation: sf-dot 1s ease-in-out infinite;
}

.sf-hive-loading__dots span:nth-child(2) {
	animation-delay: 0.2s;
}

.sf-hive-loading__dots span:nth-child(3) {
	animation-delay: 0.4s;
}

@keyframes sf-dot {
	0%,
	100% {
		opacity: 0.3;
		transform: scale(0.8);
	}

	50% {
		opacity: 1;
		transform: scale(1.2);
	}
}

.sf-no-results {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-4);
	text-align: center;
	color: var(--color-text-muted);
	padding: var(--space-10);
}

.sf-no-results h3 {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 700;
	color: var(--color-dark);
	margin: 0;
}

.sf-no-results p {
	margin: 0;
}

/* ══ Dekoracje tła archiwum sklepu (Miód i Wstążka) ══ */
.shop-layout.shop-layout--hive > .container {
	position: relative;
	z-index: 1;
}

.shop-deco {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	overflow: hidden;
}

.shop-deco__tl {
	position: absolute;
	top: 60px;
	left: -20px;
	width: 180px;
	height: 220px;
}

.shop-deco__hex-tl {
	position: absolute;
	top: 0;
	left: 0;
	width: 180px;
	height: 210px;
	opacity: 0.6;
}

.shop-deco__bee-tl {
	position: absolute;
	top: 40px;
	left: 60px;
	width: 80px;
	height: 80px;
	opacity: 0.55;
	animation: deco-bee-tl 8s ease-in-out infinite;
	transform-origin: center;
}

@keyframes deco-bee-tl {
	0% {
		transform: translate(0, 0) rotate(-8deg);
	}

	25% {
		transform: translate(8px, -12px) rotate(5deg);
	}

	50% {
		transform: translate(14px, 4px) rotate(-5deg);
	}

	75% {
		transform: translate(4px, 10px) rotate(8deg);
	}

	100% {
		transform: translate(0, 0) rotate(-8deg);
	}
}

.shop-deco__tr {
	position: absolute;
	top: 40px;
	right: -10px;
	width: 160px;
	height: 220px;
}

.shop-deco__ribbon-tr {
	width: 160px;
	height: 220px;
	opacity: 0.7;
	animation: deco-ribbon 12s ease-in-out infinite;
}

@keyframes deco-ribbon {
	0%,
	100% {
		transform: rotate(-2deg) translateY(0);
	}

	50% {
		transform: rotate(2deg) translateY(-8px);
	}
}

.shop-deco__bl {
	position: absolute;
	bottom: 40px;
	left: -10px;
	width: 180px;
	height: 200px;
}

.shop-deco__drops-bl {
	width: 180px;
	height: 200px;
	opacity: 0.8;
	animation: deco-drops 10s ease-in-out infinite;
}

@keyframes deco-drops {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-6px);
	}
}

.shop-deco__br {
	position: absolute;
	bottom: 60px;
	right: 10px;
	width: 160px;
	height: 200px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

.shop-deco__bee-br {
	width: 60px;
	height: 60px;
	opacity: 0.45;
	animation: deco-bee-br 7s ease-in-out infinite;
	animation-delay: 2s;
}

@keyframes deco-bee-br {
	0% {
		transform: translate(0, 0) rotate(10deg);
	}

	33% {
		transform: translate(-10px, -8px) rotate(-5deg);
	}

	66% {
		transform: translate(6px, -14px) rotate(8deg);
	}

	100% {
		transform: translate(0, 0) rotate(10deg);
	}
}

.shop-deco__ribbon-br {
	width: 100px;
	height: 80px;
	opacity: 0.6;
	animation: deco-ribbon-br 14s ease-in-out infinite;
	animation-delay: 1s;
}

@keyframes deco-ribbon-br {
	0%,
	100% {
		transform: rotate(3deg);
	}

	50% {
		transform: rotate(-3deg) translateY(-5px);
	}
}

.shop-deco__top-center {
	position: absolute;
	top: 16px;
	left: 50%;
	transform: translateX(-50%);
	width: 300px;
}

.shop-deco__brand-text {
	width: 300px;
	height: 40px;
	opacity: 0.6;
}

@media (max-width: 1024px) {
	.shop-deco__tl,
	.shop-deco__tr,
	.shop-deco__bl,
	.shop-deco__br {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.shop-deco__bee-tl,
	.shop-deco__bee-br,
	.shop-deco__ribbon-tr,
	.shop-deco__ribbon-br,
	.shop-deco__drops-bl {
		animation: none;
	}
}