:root {
	--crave-bg: #01021e;
	--crave-panel-bg: #01021e;
	--crave-text: #ffffff;
	--crave-accent: #c89bff;
	--crave-accent-dark: #160d20;
	--crave-header-space: 94px;
	--crave-layout-max: 1500px;
	--crave-filter-width: 290px;
	--crave-font: 'Tilt Warp', sans-serif;
}

/* Break out from Elementor without transform. Transform was preventing viewport-fixed positioning. */
.crave-shop-layout {
	display: grid !important;
	grid-template-columns: 290px minmax(0, 1fr);
	gap: 30px;
	align-items: stretch;
	position: relative;
	left: 50%;
	width: 100vw !important;
	max-width: none !important;
	margin: var(--crave-header-space) 0 0 -50vw !important;
	padding:
		16px max(18px, calc((100vw - var(--crave-layout-max)) / 2))
		28px !important;
	box-sizing: border-box;
	overflow: visible !important;
	isolation: isolate;
	background: var(--crave-bg);
}


@media (min-width: 1536px) {
	.crave-shop-layout {
		left: 50%;
		width: var(--crave-layout-max) !important;
		margin-left: -750px !important;
	}
}

@media (min-width: 1025px) and (max-width: 1535px) {
	.crave-shop-layout {
		left: 50%;
		width: calc(100vw - 36px) !important;
		margin-left: calc(-50vw + 18px) !important;
	}
}

.crave-filter-column,
.crave-products-column {
	min-width: 0;
}


.crave-filter-column {
	min-height: 1px;
}

/*
 * Elementor wraps the shortcode in several nested elements.
 * In the live page, those wrappers were only as tall as the filter panel
 * (811px), while the filter column itself was 1306px tall. A sticky element
 * cannot travel beyond its immediate containing block, so it never stuck.
 * Stretch every wrapper to the full archive-column height.
 */
@media (min-width: 1025px) {
	.crave-filter-column > .e-con-inner {
		height: 100% !important;
		min-height: 100% !important;
		align-items: stretch !important;
	}

	.crave-filter-column .elementor-widget-shortcode {
		height: 100% !important;
		min-height: 100% !important;
		flex: 1 1 auto !important;
		align-self: stretch !important;
	}

	.crave-filter-column .elementor-widget-shortcode > .elementor-widget-container,
	.crave-filter-column .elementor-shortcode,
	.crave-filter-column .crave-filter-shell {
		height: 100% !important;
		min-height: 100% !important;
	}

	.crave-filter-column .crave-filter-shell {
		position: relative;
	}
}

.crave-products-column {
	overflow: visible;
	padding-right: 8px;
}

.crave-products-column .woocommerce-ordering,
.crave-products-column .woocommerce-result-count {
	display: none !important;
}

/* Desktop: native sticky. Because the layout no longer uses transform,
   the filter stays fixed while scrolling and naturally stops before the footer. */
@media (min-width: 1025px) {
	.crave-filter-column {
		align-self: stretch;
		position: relative;
		min-height: 1px;
		overflow: visible !important;
	}

	.crave-filter-column .crave-filter-panel {
		position: sticky !important;
		top: 92px !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		width: 100% !important;
		height: auto !important;
		max-height: calc(100vh - 108px) !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		box-sizing: border-box !important;
		z-index: 20;
	}
}


.crave-product-toolbar,
.crave-product-toolbar *,
.crave-filter-panel,
.crave-filter-panel *,
.crave-no-results-message,
.crave-no-results-message * {
	font-family: var(--crave-font) !important;
	font-weight: 400 !important;
}

.crave-product-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 12px 14px;
	margin: 0 0 24px;
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 12px;
	color: var(--crave-text);
	background: var(--crave-bg);
	position: sticky;
	top: 0;
	z-index: 40;
}

.crave-toolbar-left {
	display: flex;
	align-items: center;
	gap: 18px;
}

.crave-result-count {
	font-size: 16px;
	white-space: nowrap;
	color: #fff !important;
}

.crave-sort-form {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.crave-sort-form label {
	font-size: 16px;
	white-space: nowrap;
	color: #fff !important;
}

/* Fully custom dropdown so the opened menu is also black with white text. */
.crave-sort-dropdown {
	position: relative;
	min-width: 220px;
}

.crave-sort-toggle {
	width: 100%;
	height: 46px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 0 14px 0 16px;
	border: 1px solid rgba(255,255,255,.68);
	border-radius: 12px;
	background: #01021e;
	color: #fff;
	font-family: var(--crave-font);
	font-size: 15px;
	font-weight: 400;
	cursor: pointer;
	text-align: left;
}

.crave-sort-chevron {
	font-size: 18px;
	transition: transform .18s ease;
}

.crave-sort-dropdown.is-open .crave-sort-chevron {
	transform: rotate(180deg);
}

.crave-sort-menu {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	left: 0;
	z-index: 9999;
	padding: 6px;
	border: 1px solid rgba(255,255,255,.42);
	border-radius: 12px;
	background: #01021e;
	box-shadow: 0 14px 28px rgba(0,0,0,.4);
}

.crave-sort-dropdown.is-open .crave-sort-menu {
	display: grid;
	gap: 3px;
}

.crave-sort-option {
	width: 100%;
	min-height: 40px;
	padding: 8px 12px;
	border: 0;
	border-radius: 8px;
	background: #01021e;
	color: #fff;
	font-family: var(--crave-font);
	font-size: 14px;
	font-weight: 400;
	text-align: left;
	cursor: pointer;
}

.crave-sort-option:hover,
.crave-sort-option:focus,
.crave-sort-option.is-selected {
	background: #29205b;
	color: #fff;
	outline: none;
}

.crave-mobile-filter-button {
	display: none;
	align-items: center;
	gap: 8px;
	border: 1px solid rgba(255,255,255,.48);
	background: #01021e;
	color: #fff !important;
	padding: 10px 14px;
	border-radius: 12px;
	font-size: 15px;
	cursor: pointer;
	line-height: 1;
	white-space: nowrap;
	min-height: 42px;
}

.crave-filter-panel {
	background: var(--crave-panel-bg) !important;
	color: #fff !important;
	border: 1px solid rgba(255,255,255,.18);
}

.crave-filter-form {
	margin: 0;
}

.crave-filter-title {
	padding: 20px 18px 14px;
	font-size: 24px;
	border-bottom: 1px solid rgba(255,255,255,.75);
	color: #fff !important;
}

.crave-filter-mobile-head {
	display: none;
}

.crave-filter-group {
	border-bottom: 1px solid rgba(255,255,255,.14);
}

.crave-filter-group summary {
	position: relative;
	list-style: none;
	cursor: pointer;
	padding: 16px 42px 16px 18px;
	font-size: 16px;
	user-select: none;
	color: #fff !important;
}

.crave-filter-group summary::-webkit-details-marker {
	display: none;
}

.crave-filter-group summary::after {
	content: "⌄";
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-54%);
	font-size: 18px;
	transition: transform .2s ease;
	color: #fff;
}

.crave-filter-group[open] summary::after {
	transform: translateY(-45%) rotate(180deg);
}

.crave-filter-content {
	padding: 0 18px 17px;
}

.crave-filter-option {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 36px;
	font-size: 16px;
	cursor: pointer;
	color: #fff !important;
}

.crave-filter-option span,
.crave-filter-option small {
	color: #fff !important;
}

.crave-filter-option input {
	appearance: none;
	-webkit-appearance: none;
	width: 17px;
	height: 17px;
	margin: 0;
	border: 1px solid rgba(255,255,255,.85);
	background: transparent;
	position: relative;
	flex: 0 0 17px;
	border-radius: 2px;
}

.crave-filter-option input:checked {
	background: var(--crave-accent);
	border-color: var(--crave-accent);
}

.crave-filter-option input:checked::after {
	content: "✓";
	position: absolute;
	left: 2px;
	top: -3px;
	font-size: 15px;
	color: var(--crave-accent-dark);
	font-weight: 800;
}

.crave-filter-option.is-locked small {
	margin-left: auto;
	color: var(--crave-accent) !important;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .05em;
}

.crave-price-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: end;
	gap: 9px;
}

.crave-price-row label {
	display: grid;
	gap: 7px;
	font-size: 14px;
	color: #fff !important;
}

.crave-price-input {
	display: flex;
	align-items: center;
	height: 44px;
	border: 1px solid rgba(255,255,255,.55);
	background: rgba(255,255,255,.04);
	border-radius: 10px;
}

.crave-price-input b {
	padding-left: 11px;
	color: rgba(255,255,255,.9);
}

.crave-price-input input {
	width: 100%;
	min-width: 0;
	height: 42px;
	border: 0 !important;
	background: transparent !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	padding: 0 9px !important;
	box-shadow: none !important;
	outline: none !important;
	-moz-appearance: textfield;
	font-family: var(--crave-font) !important;
	font-size: 15px !important;
}

.crave-price-input input::placeholder {
	color: rgba(255,255,255,.55);
	-webkit-text-fill-color: rgba(255,255,255,.55);
}

.crave-price-separator {
	padding-bottom: 10px;
	color: rgba(255,255,255,.65);
}

.crave-price-error {
	margin: 10px 0 0;
	color: #ff8b9a;
	font-size: 13px;
}

.crave-filter-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	padding: 18px;
	background: var(--crave-panel-bg);
}

.crave-apply-filters,
.crave-reset-filters {
	min-height: 48px;
	border-radius: 12px !important;
	font-family: var(--crave-font) !important;
	font-weight: 400 !important;
	font-size: 15px !important;
}

.crave-apply-filters {
	border: 1px solid var(--crave-accent);
	background: var(--crave-accent);
	color: var(--crave-accent-dark);
	cursor: pointer;
	padding: 0 12px;
}

.crave-reset-filters {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 12px;
	border: 1px solid rgba(255,255,255,.35);
	background: transparent;
	color: #fff !important;
	text-decoration: none !important;
}

.crave-no-results-message {
	display: flex !important;
	align-items: center;
	justify-content: center;
	text-align: center !important;
	min-height: 240px;
	width: 100%;
	max-width: 900px;
	margin: 50px auto !important;
	padding: 36px 24px !important;
	border-radius: 16px;
	background: #01021e !important;
	color: #fff !important;
	font-size: 24px !important;
	line-height: 1.45 !important;
	box-sizing: border-box;
}

.crave-filter-overlay {
	display: none;
}

@media (max-width: 1024px) {
	.crave-shop-layout {
		display: block !important;
		position: relative;
		left: auto;
		width: calc(100vw - 24px) !important;
		margin: 82px auto 0 !important;
		padding-top: 12px !important;
		padding-bottom: 24px !important;
		overflow: visible;
	}

	.crave-filter-column {
		overflow: visible !important;
		width: 0 !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.crave-products-column {
		height: auto !important;
		overflow: visible !important;
		padding-right: 0;
	}

	.crave-filter-column .crave-filter-panel,
	.crave-filter-panel {
		position: fixed !important;
		z-index: 999999;
		left: 0 !important;
		top: 0 !important;
		bottom: 0 !important;
		width: min(88vw, 390px) !important;
		max-width: 390px;
		height: 100dvh;
		max-height: 100dvh !important;
		overflow-y: auto !important;
		transform: translateX(-105%);
		transition: transform .25s ease;
		box-shadow: 18px 0 45px rgba(0,0,0,.45);
	}

	.crave-filter-panel.is-open {
		transform: translateX(0);
	}

	.crave-filter-overlay {
		display: block;
		position: fixed;
		z-index: 999998;
		inset: 0;
		background: rgba(0,0,0,.67);
		opacity: 0;
		visibility: hidden;
		transition: opacity .25s ease, visibility .25s ease;
	}

	.crave-filter-overlay.is-open {
		opacity: 1;
		visibility: visible;
	}

	body.crave-filter-lock {
		overflow: hidden !important;
	}

	.crave-filter-mobile-head {
		position: sticky;
		z-index: 2;
		top: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 17px 18px;
		background: var(--crave-panel-bg);
		border-bottom: 1px solid rgba(255,255,255,.2);
		font-size: 20px;
		color: #fff;
	}

	.crave-filter-close {
		width: 38px;
		height: 38px;
		border: 0;
		background: transparent;
		color: #fff;
		font-size: 30px;
		line-height: 1;
		cursor: pointer;
	}

	.crave-filter-title {
		display: none;
	}

	.crave-filter-actions {
		position: sticky;
		bottom: 0;
		z-index: 2;
		box-shadow: 0 -12px 30px rgba(0,0,0,.38);
	}

	.crave-mobile-filter-button {
		display: inline-flex;
	}
}

@media (max-width: 600px) {
	.crave-shop-layout {
		margin-top: 74px !important;
	}

	.crave-product-toolbar {
		gap: 12px;
		margin-bottom: 16px;
		flex-wrap: wrap;
		padding: 12px;
	}

	.crave-toolbar-left {
		gap: 12px;
		width: 100%;
		justify-content: space-between;
	}

	.crave-result-count {
		font-size: 14px;
	}

	.crave-sort-form {
		width: 100%;
		justify-content: space-between;
	}

	.crave-sort-form label {
		font-size: 14px;
		display: inline-block;
	}

	.crave-sort-dropdown {
		min-width: 190px;
		max-width: 64vw;
	}

	.crave-sort-toggle {
		height: 42px;
		font-size: 14px;
	}

	.crave-price-row {
		grid-template-columns: 1fr;
	}

	.crave-price-separator {
		display: none;
	}

	.crave-no-results-message {
		min-height: 180px;
		font-size: 20px !important;
		margin: 30px auto !important;
		padding: 28px 18px !important;
	}
}


/* Archive product badges */
.crave-products-column ul.products li.product {
	position: relative !important;
}

.crave-products-column ul.products li.product .woocommerce-LoopProduct-link {
	position: relative !important;
	display: block;
}

.crave-products-column .onsale {
	display: none !important;
}

.crave-product-badges {
	position: absolute;
	z-index: 25;
	top: 12px;
	left: 12px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	max-width: calc(100% - 24px);
	pointer-events: none;
}

.crave-product-badge {
	display: inline-flex;
	align-items: center;
	min-height: 25px;
	padding: 4px 9px;
	border-radius: 999px;
	box-shadow: 0 3px 10px rgba(0,0,0,.28);
	font-family: var(--crave-font) !important;
	font-size: 11px;
	font-weight: 400 !important;
	line-height: 1;
	white-space: nowrap;
	letter-spacing: .01em;
}

.crave-product-badge-us {
	background: #c89bff;
	color: #160d20;
}

.crave-product-badge-eu {
	background: #356dff;
	color: #ffffff;
}

.crave-product-badge-silicone {
	background: #ff4fd8;
	color: #160d20;
}

.crave-product-badge-tpe {
	background: #f4a62a;
	color: #160d20;
}

@media (max-width: 600px) {
	.crave-product-badges {
		top: 8px;
		left: 8px;
		gap: 4px;
	}

	.crave-product-badge {
		min-height: 21px;
		padding: 3px 7px;
		font-size: 9px;
	}
}


/* Hide the default WooCommerce/Astra Sale bubble on doll products everywhere. */
.product_cat-dolls .onsale,
.product_cat-all-dolls .onsale,
.product_cat-tpe-dolls .onsale,
.product_cat-silicone-dolls .onsale,
.product_cat-tpe .onsale,
.product_cat-silicone .onsale,
.product_cat-dolls .ast-onsale-card,
.product_cat-all-dolls .ast-onsale-card,
.product_cat-tpe-dolls .ast-onsale-card,
.product_cat-silicone-dolls .ast-onsale-card,
.product_cat-tpe .ast-onsale-card,
.product_cat-silicone .ast-onsale-card {
	display: none !important;
}

/* Elementor host for the badge shortcode on home Loop Items and product galleries. */
.crave-badge-host {
	position: relative !important;
}

.crave-badge-host .crave-product-badges-shortcode {
	position: absolute !important;
	z-index: 40 !important;
	top: 12px !important;
	left: 12px !important;
	right: auto !important;
	bottom: auto !important;
}

@media (max-width: 600px) {
	.crave-badge-host .crave-product-badges-shortcode {
		top: 8px !important;
		left: 8px !important;
	}
}