/* MC Wear Product Collection
 * Shop page grid with filter bar (FILTER / SIZE / COLOR / SORT) and AJAX
 * filtering. Specificity bumped (.mcw-pc.mcw-pc ...) to beat Elementor Site
 * Settings without !important.
 *
 * Layout: full-bleed section. Sticky filter bar with top + bottom borders.
 * Product grid: 2-col on tablet+, 2-col on mobile. Cards alternate aspect
 * ratios in a 4-cycle (820 / 542 / 604 / 820) matching Figma. Mobile cards
 * collapse to a tighter 4:5 to keep image proportions readable.
 */

.mcw-pc.mcw-pc {
	box-sizing: border-box;
	width: 100%;
	background: #ffffff;
	color: #3b3e40;
}

.mcw-pc.mcw-pc *,
.mcw-pc.mcw-pc *::before,
.mcw-pc.mcw-pc *::after {
	box-sizing: border-box;
}

/* ---------- Filter bar ---------- */
.mcw-pc.mcw-pc .mcw-pc__bar {
	width: 100%;
	background: #ffffff;
	border-top: 1px solid #3b3e40;
	border-bottom: 1px solid #3b3e40;
	z-index: 50;
}

.mcw-pc.mcw-pc.mcw-pc--sticky .mcw-pc__bar {
	position: sticky;
	top: var(--mcw-pc-sticky-top, 128px);
	z-index: 90;
}

.mcw-pc.mcw-pc .mcw-pc__bar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	max-width: var(--mcw-pc-max, 1440px);
	margin: 0 auto;
	padding: 12px 80px;
	min-height: 44px;
}

.mcw-pc.mcw-pc .mcw-pc__bar-left {
	display: flex;
	align-items: center;
	gap: 40px;
}

.mcw-pc.mcw-pc .mcw-pc__bar-right {
	display: flex;
	align-items: center;
}

/* ---------- Bar button ---------- */
.mcw-pc.mcw-pc .mcw-pc__bar-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0;
	margin: 0;
	height: 20px;
	background: transparent;
	border: 0;
	color: #000000;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 400;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn-label {
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn:hover,
.mcw-pc.mcw-pc .mcw-pc__bar-btn:focus-visible {
	color: #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn:focus-visible {
	outline: 2px solid #000000;
	outline-offset: 4px;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	color: currentColor;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn-icon svg {
	display: block;
	width: 11px;
	height: 6px;
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn-icon--filter svg {
	width: 12px;
	height: 12px;
}

.mcw-pc.mcw-pc .mcw-pc__dd-toggle[aria-expanded="true"] .mcw-pc__bar-btn-icon--chev {
	transform: rotate(180deg);
}

.mcw-pc.mcw-pc .mcw-pc__bar-btn-icon--chev {
	transition: transform 0.2s ease;
}

/* ---------- Dropdown ---------- */
.mcw-pc.mcw-pc .mcw-pc__dd {
	position: relative;
	display: inline-flex;
	align-items: center;
	height: 20px;
}

.mcw-pc.mcw-pc .mcw-pc__dd-panel {
	position: absolute;
	top: calc(100% + 12px);
	left: 0;
	min-width: 200px;
	padding: 16px;
	background: #ffffff;
	border: 1px solid #3b3e40;
	display: flex;
	flex-direction: column;
	gap: 12px;
	z-index: 60;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease, visibility 0s linear 0.2s;
	pointer-events: none;
}

.mcw-pc.mcw-pc .mcw-pc__dd-panel--right {
	left: auto;
	right: 0;
}

.mcw-pc.mcw-pc .mcw-pc__dd.is-open .mcw-pc__dd-panel {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.2s ease, visibility 0s linear 0s;
	pointer-events: auto;
}

.mcw-pc.mcw-pc .mcw-pc__dd-opt {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 400;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__dd-opt input {
	width: 14px;
	height: 14px;
	margin: 0;
	accent-color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__dd-opt:hover .mcw-pc__dd-opt-label,
.mcw-pc.mcw-pc .mcw-pc__dd-opt input:checked + .mcw-pc__dd-opt-label,
.mcw-pc.mcw-pc .mcw-pc__dd-opt input:checked ~ .mcw-pc__dd-opt-label {
	color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__dd-opt-swatch {
	display: inline-block;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	background: #cdf4f3;
}

/* ---------- Main / Grid ---------- */
.mcw-pc.mcw-pc .mcw-pc__main {
	width: 100%;
	max-width: var(--mcw-pc-max, 1440px);
	margin: 0 auto;
	padding: 120px 80px 0;
}

.mcw-pc.mcw-pc .mcw-pc__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--mcw-pc-gap, 20px);
	align-items: start;
	transition: opacity 0.2s ease;
}

.mcw-pc.mcw-pc .mcw-pc__col {
	display: flex;
	flex-direction: column;
	gap: var(--mcw-pc-gap, 20px);
	min-width: 0;
}

/* Slider variant — hidden ≥768px, becomes Swiper carousel on mobile. */
.mcw-pc.mcw-pc .mcw-pc__slider.swiper,
.mcw-pc.mcw-pc .mcw-pc__slider {
	display: none;
}

.mcw-pc.mcw-pc[data-mcw-pc-loading="1"] .mcw-pc__grid {
	opacity: 0.5;
	pointer-events: none;
}

.mcw-pc.mcw-pc .mcw-pc__empty {
	grid-column: 1 / -1;
	padding: 40px 0;
	text-align: center;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #3b3e40;
}

/* ---------- Card ---------- */
.mcw-pc.mcw-pc .mcw-pc__card {
	position: relative;
	width: 100%;
	background: #f2f2f2;
	overflow: hidden;
	border-radius: 0;
	aspect-ratio: 630 / 820;
}

/* 2-col aspect pattern matching Figma. Cards are split server-side into
 * two columns alternating, then within each column heights alternate:
 *   col 1 → tall (820), square (604), tall, square...
 *   col 2 → wide (542), tall (820), wide, tall...
 */
.mcw-pc.mcw-pc .mcw-pc__col--1 .mcw-pc__card:nth-child(odd) {
	aspect-ratio: 630 / 820;
}

.mcw-pc.mcw-pc .mcw-pc__col--1 .mcw-pc__card:nth-child(even) {
	aspect-ratio: 630 / 604;
}

.mcw-pc.mcw-pc .mcw-pc__col--2 .mcw-pc__card:nth-child(odd) {
	aspect-ratio: 630 / 542;
}

.mcw-pc.mcw-pc .mcw-pc__col--2 .mcw-pc__card:nth-child(even) {
	aspect-ratio: 630 / 820;
}

.mcw-pc.mcw-pc .mcw-pc__card-link {
	position: absolute;
	inset: 0;
	display: block;
	z-index: 1;
	color: inherit;
	text-decoration: none;
}

.mcw-pc.mcw-pc .mcw-pc__media {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.mcw-pc.mcw-pc .mcw-pc__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1);
	transition: transform 0.6s ease;
}

.mcw-pc.mcw-pc .mcw-pc__card:hover .mcw-pc__img {
	transform: scale(1.02);
}

/* ---------- Card icon buttons ---------- */
.mcw-pc.mcw-pc .mcw-pc__icon-btn {
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 10px;
	background: #ffffff;
	color: #000000;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.3s ease, opacity 0.3s ease;
	z-index: 3;
	text-decoration: none;
}

.mcw-pc.mcw-pc .mcw-pc__icon-btn:hover,
.mcw-pc.mcw-pc .mcw-pc__icon-btn:focus-visible {
	background: #f7f7f7;
}

.mcw-pc.mcw-pc .mcw-pc__icon-btn:focus-visible {
	outline: 2px solid #000000;
	outline-offset: 2px;
}

.mcw-pc.mcw-pc .mcw-pc__icon-btn svg {
	display: block;
	width: 20px;
	height: 20px;
}

.mcw-pc.mcw-pc .mcw-pc__wishlist {
	top: 20px;
	right: 20px;
	opacity: 0;
	transform: translateY(-6px);
}

.mcw-pc.mcw-pc .mcw-pc__wishlist.is-active {
	color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__add {
	right: 20px;
	bottom: 20px;
	opacity: 0;
	transform: translateY(6px);
}

/* ---------- Overlay (title + price) ---------- */
.mcw-pc.mcw-pc .mcw-pc__overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	min-height: 100px;
	padding: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	background: rgba(242, 242, 242, 0.2);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	z-index: 1;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

.mcw-pc.mcw-pc .mcw-pc__card:hover .mcw-pc__overlay,
.mcw-pc.mcw-pc .mcw-pc__card:focus-within .mcw-pc__overlay {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.mcw-pc.mcw-pc .mcw-pc__card:hover .mcw-pc__wishlist,
.mcw-pc.mcw-pc .mcw-pc__card:focus-within .mcw-pc__wishlist,
.mcw-pc.mcw-pc .mcw-pc__card:hover .mcw-pc__add,
.mcw-pc.mcw-pc .mcw-pc__card:focus-within .mcw-pc__add {
	opacity: 1;
	transform: translateY(0);
}

/* Touch devices (no hover): show heart + add by default — no hover needed. */
@media (hover: none) {
	.mcw-pc.mcw-pc .mcw-pc__wishlist,
	.mcw-pc.mcw-pc .mcw-pc__add {
		opacity: 1;
		transform: translateY(0);
	}
}

.mcw-pc.mcw-pc .mcw-pc__info {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
}

.mcw-pc.mcw-pc .mcw-pc__title,
.mcw-pc.mcw-pc .mcw-pc__price {
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__title {
	color: #000000;
	font-weight: 400;
}

.mcw-pc.mcw-pc .mcw-pc__price {
	font-weight: 500;
}

.mcw-pc.mcw-pc .mcw-pc__price .amount {
	color: inherit;
}

/* ---------- Load more ---------- */
.mcw-pc.mcw-pc .mcw-pc__more-wrap {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

.mcw-pc.mcw-pc .mcw-pc__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 28px;
	background: #000000;
	color: #ffffff;
	border: 0;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.mcw-pc.mcw-pc .mcw-pc__more:hover {
	background: #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__more[disabled],
.mcw-pc.mcw-pc .mcw-pc__more.is-loading {
	opacity: 0.6;
	cursor: not-allowed;
}

/* ---------- Numbered pagination ----------
 * Sizes/colors match Figma node 4785:5615 — all buttons share a 36px
 * height, 4px radius, #d5d7da border, 8/12 padding, and Inter 14/20.
 * Number buttons hug their text via padding so "1" and "25" both fit.
 */
.mcw-pc.mcw-pc .mcw-pc__more-wrap--pagination {
	margin-top: 60px;
	margin-bottom: 40px;
}

.mcw-pc.mcw-pc .mcw-pc__pagination {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: center;
	gap: 6px;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-width: 33px;
	height: 36px;
	padding: 8px 12px;
	margin: 0;
	background: #ffffff;
	color: #050101;
	border: 1px solid #d5d7da;
	border-radius: 4px;
	overflow: hidden;
	cursor: pointer;
	font-family: "Inter", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 0;
	text-transform: none;
	transition: border-color 0.35s ease, color 0.35s ease, text-shadow 0.35s ease;
}

/* Gradient sits in a pseudo so opacity can transition — `background-image`
 * itself can't be interpolated. The image is identical to the one on the
 * current button, just faded in on hover. */
.mcw-pc.mcw-pc .mcw-pc__page-btn::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33 36' preserveAspectRatio='none'><defs><linearGradient id='g' x1='13.6008' y1='0' x2='-3.90464' y2='8.36665' gradientUnits='userSpaceOnUse'><stop stop-color='%23FFCCCC'/><stop offset='0.911836' stop-color='%23FEF3C6'/><stop offset='1' stop-color='%23CDF4F3'/></linearGradient></defs><rect width='33' height='36' rx='4' ry='4' fill='url(%23g)'/></svg>") center/100% 100% no-repeat;
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
	z-index: 0;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn > * {
	position: relative;
	z-index: 1;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn--ellipsis {
	width: 31px;
	min-width: 31px;
	padding: 8px 12px;
	cursor: default;
	color: #050101;
	letter-spacing: 2px;
}

.mcw-pc.mcw-pc .mcw-pc__page-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: currentColor;
}

.mcw-pc.mcw-pc .mcw-pc__page-icon svg {
	display: block;
	width: auto;
	height: 9px;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn:not(.mcw-pc__page-btn--ellipsis):not(.mcw-pc__page-btn--current):hover,
.mcw-pc.mcw-pc .mcw-pc__page-btn:not(.mcw-pc__page-btn--ellipsis):not(.mcw-pc__page-btn--current):focus-visible {
	color: #000000;
	/* Simulated bold — real `font-weight: 700` would reflow text width and
	 * jiggle siblings on hover. Layered text-shadow fattens the glyph in
	 * place at the same advance width. */
	text-shadow: 0 0 0.45px currentColor, 0 0 0.45px currentColor;
	border-color: transparent;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn:not(.mcw-pc__page-btn--ellipsis):not(.mcw-pc__page-btn--current):hover::before,
.mcw-pc.mcw-pc .mcw-pc__page-btn:not(.mcw-pc__page-btn--ellipsis):not(.mcw-pc__page-btn--current):focus-visible::before {
	opacity: 1;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn:focus-visible {
	outline: 2px solid #000000;
	outline-offset: 2px;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn[disabled] {
	opacity: 0.45;
	cursor: not-allowed;
}

/* Active page — Figma "Gradient - Half Card" baked into a pre-rendered SVG
 * so the exact stop positions and gradient direction match design 1:1.
 * Sibling of current gets a faint pink border per Figma. */
.mcw-pc.mcw-pc .mcw-pc__page-btn--current {
	color: #000000;
	/* Fake bold via text-shadow keeps glyph advance width identical to the
	 * non-current state — siblings don't shift when the active page moves. */
	text-shadow: 0 0 0.45px currentColor, 0 0 0.45px currentColor;
	border-color: transparent;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn--current::before {
	opacity: 1;
}

.mcw-pc.mcw-pc .mcw-pc__page-btn--current + .mcw-pc__page-btn--num {
	border-color: #dacbcc;
}

/* ---------- Drawer ---------- */
.mcw-pc.mcw-pc .mcw-pc__drawer {
	position: fixed;
	top: var(--mcw-pc-admin-bar, 0);
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
	visibility: hidden;
	pointer-events: none;
	transition: visibility 0s linear 0.35s;
}

.mcw-pc.mcw-pc .mcw-pc__drawer.is-open {
	visibility: visible;
	pointer-events: auto;
	transition: visibility 0s linear 0s;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.mcw-pc.mcw-pc .mcw-pc__drawer.is-open .mcw-pc__drawer-backdrop {
	opacity: 1;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-panel {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: min(420px, 90vw);
	background: #ffffff;
	display: flex;
	flex-direction: column;
	transform: translateX(-100%);
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.mcw-pc.mcw-pc .mcw-pc__drawer.is-open .mcw-pc__drawer-panel {
	transform: translateX(0);
}

/* WP admin bar: push drawer below it so the FILTERS header isn't covered. */
body.admin-bar .mcw-pc.mcw-pc .mcw-pc__drawer {
	--mcw-pc-admin-bar: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .mcw-pc.mcw-pc .mcw-pc__drawer {
		--mcw-pc-admin-bar: 46px;
	}
}

.mcw-pc.mcw-pc .mcw-pc__drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	border-bottom: 1px solid #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-title {
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: 0;
	cursor: pointer;
	color: #000000;
}

/* Cross icon — explicit width/height, force stroke (defeat theme overrides). */
.mcw-pc.mcw-pc .mcw-pc__drawer-close-svg {
	display: block;
	width: 14px;
	height: 14px;
	flex-shrink: 0;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-close-svg line {
	stroke: #000000;
	stroke-width: 1.5;
	stroke-linecap: round;
	fill: none;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-group-title {
	display: block;
	margin: 0 0 12px;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-list--chips {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-opt {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-opt input {
	width: 14px;
	height: 14px;
	margin: 0;
	accent-color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-count {
	font-style: normal;
	color: #888888;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border: 1px solid #3b3e40;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #3b3e40;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-chip input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-chip:hover {
	background: #f2f2f2;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-chip:has(input:checked) {
	background: #000000;
	color: #ffffff;
	border-color: #000000;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-foot {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 20px;
	border-top: 1px solid #3b3e40;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-clear {
	flex: 0 0 auto;
	padding: 12px 18px;
	background: transparent;
	color: #000000;
	border: 1px solid #3b3e40;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.mcw-pc.mcw-pc .mcw-pc__drawer-apply {
	flex: 1 1 auto;
	padding: 14px 18px;
	background: #000000;
	color: #ffffff;
	border: 0;
	cursor: pointer;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/* ---------- Responsive: Tablet (≤1499) ---------- */
@media screen and (max-width: 1499px) {
	.mcw-pc.mcw-pc .mcw-pc__bar-inner {
		padding: 12px 32px;
	}

	.mcw-pc.mcw-pc .mcw-pc__main {
		padding: 80px 32px 0;
	}

	.mcw-pc.mcw-pc .mcw-pc__bar-left {
		gap: 32px;
	}
}

/* ---------- Responsive: Mobile (≤767) ---------- */
@media screen and (max-width: 767px) {
	.mcw-pc.mcw-pc .mcw-pc__bar-inner {
		padding: 10px 16px;
		gap: 12px;
	}

	.mcw-pc.mcw-pc .mcw-pc__bar-left {
		gap: 20px;
	}

	.mcw-pc.mcw-pc .mcw-pc__main {
		padding: 40px 16px 0;
	}

	/* Hide static grid, render Swiper slider instead. */
	.mcw-pc.mcw-pc .mcw-pc__grid {
		display: none;
	}

	.mcw-pc.mcw-pc .mcw-pc__slider.swiper,
	.mcw-pc.mcw-pc .mcw-pc__slider {
		display: block;
		width: 100%;
		overflow: hidden;
	}

	/* Pre-init fallback so slides don't squash before Swiper boots. */
	.mcw-pc.mcw-pc .mcw-pc__slider .swiper-wrapper {
		gap: 16px;
	}

	.mcw-pc.mcw-pc .mcw-pc__slider .swiper-slide {
		flex: 0 0 85%;
		width: 85%;
		height: auto;
	}

	/* Once Swiper boots, let its inline width win — drop pre-init flex-basis. */
	.mcw-pc.mcw-pc .mcw-pc__slider.swiper-initialized .swiper-wrapper {
		gap: 0;
	}

	.mcw-pc.mcw-pc .mcw-pc__slider.swiper-initialized .swiper-slide {
		flex: 0 0 auto;
		width: auto;
	}

	/* Slider cards: uniform aspect, full-image, no crop letterbox on bg. */
	.mcw-pc.mcw-pc .mcw-pc__slider .mcw-pc__card {
		aspect-ratio: 4 / 5;
	}

	.mcw-pc.mcw-pc .mcw-pc__col {
		gap: 12px;
	}

	/* Mobile: simpler 4:5 cards (less aggressive variation) for scannability. */
	.mcw-pc.mcw-pc .mcw-pc__card,
	.mcw-pc.mcw-pc .mcw-pc__col--1 .mcw-pc__card:nth-child(odd),
	.mcw-pc.mcw-pc .mcw-pc__col--1 .mcw-pc__card:nth-child(even),
	.mcw-pc.mcw-pc .mcw-pc__col--2 .mcw-pc__card:nth-child(odd),
	.mcw-pc.mcw-pc .mcw-pc__col--2 .mcw-pc__card:nth-child(even) {
		aspect-ratio: 4 / 5;
	}

	.mcw-pc.mcw-pc .mcw-pc__col {
		gap: 12px;
	}

	.mcw-pc.mcw-pc .mcw-pc__icon-btn {
		width: 32px;
		height: 32px;
		padding: 8px;
	}

	.mcw-pc.mcw-pc .mcw-pc__icon-btn svg {
		width: 16px;
		height: 16px;
	}

	.mcw-pc.mcw-pc .mcw-pc__wishlist {
		top: 10px;
		right: 10px;
	}

	.mcw-pc.mcw-pc .mcw-pc__add {
		right: 10px;
		bottom: 10px;
	}

	.mcw-pc.mcw-pc .mcw-pc__overlay {
		min-height: 72px;
		padding: 12px;
	}

	.mcw-pc.mcw-pc .mcw-pc__title,
	.mcw-pc.mcw-pc .mcw-pc__price {
		font-size: 11px;
		line-height: 16px;
	}

	.mcw-pc.mcw-pc .mcw-pc__info {
		gap: 6px;
	}

	/* Mobile reveal — first tap on card shows overlay/icons, second tap navigates. */
	.mcw-pc.mcw-pc .mcw-pc__card.is-revealed .mcw-pc__overlay {
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}

	.mcw-pc.mcw-pc .mcw-pc__card.is-revealed .mcw-pc__wishlist,
	.mcw-pc.mcw-pc .mcw-pc__card.is-revealed .mcw-pc__add {
		opacity: 1;
		transform: translateY(0);
	}

	.mcw-pc.mcw-pc .mcw-pc__dd-panel {
		min-width: 160px;
	}

	/* Mobile uses Swiper against the full catalogue — pagination is hidden
	 * and the slider query already returns every product. */
	.mcw-pc.mcw-pc .mcw-pc__more-wrap--pagination {
		display: none;
	}
}

/* ===========================================================================
   Search results page (search.php). Reuses .mcw-pc card styling via a wrapper
   with the .mcw-pc class, but its own grid (the widget's .mcw-pc__grid is
   hidden on mobile for the slider, so search must not use it).
   =========================================================================== */
.mcw-search {
	max-width: 1440px;
	margin: 0 auto;
	padding: 64px 80px 96px; /* side padding matches the header container */
	box-sizing: border-box;
}
.mcw-search__head {
	margin: 0 0 32px;
}
/* .mcw-search prefix beats Elementor's kit `p` rule, which otherwise leaks a
   bottom margin onto the eyebrow/count and bloats the spacing. */
.mcw-search .mcw-search__eyebrow {
	margin: 0 0 10px;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 11px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #717680;
}
/* .mcw-search prefix bumps specificity above Elementor's kit `h1` rule
   (.elementor-kit-N h1), which otherwise forces an oversized heading. */
.mcw-search .mcw-search__title {
	margin: 0 0 8px;
	font-family: "Ivy Mode", "Cormorant Garamond", Georgia, serif;
	font-weight: 300;
	font-size: 56px;
	line-height: 1.05;
	letter-spacing: 1px;
	color: #000000;
}
.mcw-search .mcw-search__count {
	margin: 14px 0 0;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 13px;
	letter-spacing: 0.5px;
	color: #717680;
}
.mcw-search .mcw-search__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 56px 28px;
}
/* No-results state — centered editorial block with explore links + CTA. */
.mcw-search .mcw-search__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	max-width: 540px;
	margin: 0 auto;
	padding: 48px 0 110px;
}
.mcw-search__empty-icon {
	color: #cfcfcf;
	margin-bottom: 26px;
}
.mcw-search__empty-icon svg { display: block; }
.mcw-search .mcw-search__empty-title {
	margin: 0 0 12px;
	font-family: "Ivy Mode", "Cormorant Garamond", Georgia, serif;
	font-weight: 300;
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.1;
	letter-spacing: 1px;
	color: #000000;
}
.mcw-search .mcw-search__empty-text {
	margin: 0 0 34px;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.2px;
	color: #717680;
}
.mcw-search__empty-explore {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	margin: 0 0 38px;
}
.mcw-search__empty-explore-label {
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 11px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #717680;
}
.mcw-search__empty-explore-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 18px;
}
.mcw-search .mcw-search__empty-explore-list a {
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
	letter-spacing: 0.5px;
	color: #000000;
	text-decoration: none;
	padding-bottom: 2px;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s ease;
}
.mcw-search .mcw-search__empty-explore-list a:hover {
	border-bottom-color: #000000;
}
/* The CTA uses the real MCW Button widget markup (.mcw-button), so its
   animated hover comes from button.css — no extra styling here, just spacing. */
.mcw-search .mcw-search__empty-btn { margin: 0; }

/* Pagination (the_posts_pagination → nav.pagination .nav-links). */
.mcw-search .pagination {
	margin-top: 48px;
	display: flex;
	justify-content: center;
}
.mcw-search .pagination .nav-links {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}
.mcw-search .pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 10px;
	box-sizing: border-box;
	font-family: "Mona Sans Expanded", "Mona Sans", -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
	letter-spacing: 0.5px;
	color: #000000;
	text-decoration: none;
	border: 1px solid transparent;
	transition: border-color 0.15s ease;
}
.mcw-search .pagination a.page-numbers:hover {
	border-color: #000000;
}
.mcw-search .pagination .page-numbers.current {
	border-color: #000000;
	font-weight: 500;
}
.mcw-search .pagination .page-numbers.dots {
	min-width: 0;
	padding: 0 4px;
	border: 0;
	color: #717680;
}

/* Side padding tracks the header container's breakpoints (80 → 32 → 16). */
@media (max-width: 1499px) {
	.mcw-search { padding-left: 32px; padding-right: 32px; }
}
@media (max-width: 1024px) {
	.mcw-search .mcw-search__grid { grid-template-columns: repeat(2, 1fr); gap: 40px 24px; }
}
@media (max-width: 767px) {
	.mcw-search { padding: 40px 16px 56px; }
	.mcw-search__head { margin-bottom: 28px; }
	.mcw-search .mcw-search__title { font-size: 34px; }
	.mcw-search .mcw-search__grid { grid-template-columns: repeat(2, 1fr); gap: 28px 12px; }
}
