.vm-vanity-shell {
	background: #f7f7f5;
	color: #171717;
	max-width: none;
	min-height: 760px;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.vm-vanity-react-host {
	background: #fff;
	border-radius: 0;
	box-shadow: none;
	height: 760px;
	overflow: visible;
	position: relative;
	width: 100%;
}

.vm-vanity-react-root {
	height: 100%;
	min-height: 100%;
	overflow: visible;
	width: 100%;
}

.vm-vanity-react-root > div {
	height: 100%;
	min-height: 100%;
	position: relative;
	width: 100%;
}

.vm-vanity-react-root *,
.vm-vanity-react-root *::before,
.vm-vanity-react-root *::after {
	box-sizing: border-box;
}

.vm-vanity-react-root canvas {
	display: block;
}

.vm-vanity-react-root h1[class~="tracking-[0.2em]"][class~="py-5"] {
	display: none !important;
}

.vm-vanity-react-root [class~="fixed"][class~="inset-0"][class~="bg-black/60"] {
	align-items: center !important;
	background: rgba(0, 0, 0, .68) !important;
	box-sizing: border-box;
	display: flex !important;
	inset: 0 !important;
	justify-content: center !important;
	padding: 24px !important;
	position: fixed !important;
	z-index: 999999 !important;
}

.vm-vanity-react-root [class~="fixed"][class~="inset-0"][class~="bg-black/60"] > div {
	background: #fff;
	box-shadow: 0 24px 80px rgba(0, 0, 0, .28);
	box-sizing: border-box;
	max-height: calc(100vh - 48px) !important;
	overflow: auto !important;
}

.vm-vanity-react-root [class~="fixed"][class~="inset-0"][class~="bg-black/60"] img {
	height: auto !important;
	max-height: min(70vh, 680px) !important;
	max-width: 100% !important;
	object-fit: contain !important;
	width: auto !important;
}

.vm-vanity-react-root .vm-vanity-info-overlay[class~="fixed"][class~="inset-0"][class~="bg-black/60"] {
	background: rgba(0, 0, 0, .62) !important;
	padding: 30px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal {
	background: #fff !important;
	border-radius: 38px !important;
	box-shadow: none !important;
	color: #111827 !important;
	max-height: calc(100vh - 60px) !important;
	max-width: 768px !important;
	overflow: auto !important;
	padding: 42px 40px 38px !important;
	width: min(768px, calc(100vw - 60px)) !important;
}

.vm-vanity-react-root .vm-vanity-info-modal > [class~="flex"] {
	gap: 30px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="min-w-[240px]"] {
	min-width: 0 !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="mb-3"][class~="justify-between"] {
	align-items: flex-start !important;
	gap: 26px !important;
	margin-bottom: 14px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal h3 {
	color: #111827 !important;
	font-size: 20px !important;
	font-weight: 900 !important;
	letter-spacing: 0 !important;
	line-height: 1.1 !important;
	margin: 0 !important;
	text-transform: uppercase !important;
}

.vm-vanity-react-root .vm-vanity-info-modal h3 + p {
	color: #475569 !important;
	font-size: 12px !important;
	line-height: 1.45 !important;
	margin-top: 8px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="shrink-0"] p {
	color: #94a3b8 !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	letter-spacing: .09em !important;
	margin-bottom: 6px !important;
	text-transform: uppercase !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="shrink-0"] div {
	align-items: center !important;
	background: #4b5563 !important;
	color: #fff !important;
	display: flex !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	height: 32px !important;
	justify-content: center !important;
	min-width: 90px !important;
	padding: 0 14px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="grid-cols-[max-content_1fr]"] {
	column-gap: 28px !important;
	display: grid !important;
	grid-template-columns: 74px minmax(0, 1fr) !important;
	row-gap: 3px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="grid-cols-[max-content_1fr]"] span {
	font-size: 14px !important;
	line-height: 1.25 !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="grid-cols-[max-content_1fr]"] span:nth-child(odd) {
	color: #111827 !important;
	font-weight: 800 !important;
}

.vm-vanity-react-root .vm-vanity-info-modal [class~="grid-cols-[max-content_1fr]"] span:nth-child(even) {
	color: #334155 !important;
	font-weight: 400 !important;
}

.vm-vanity-react-root .vm-vanity-info-modal hr {
	border-color: #cbd5e1 !important;
	margin: 24px 0 26px !important;
}

.vm-vanity-react-root .vm-vanity-info-modal hr + p {
	color: #64748b !important;
	font-size: 13px !important;
	line-height: 1.7 !important;
	margin: 0 !important;
}

.vm-vanity-react-root > div {
	background: #fff;
}

.vm-vanity-react-root [class~="md:w-2/5"][class~="md:border-l"] {
	background: #fff;
}

.vm-vanity-react-root [class~="bg-gray-100"][class~="hover:bg-gray-200"][class~="text-left"] {
	background: #f3f4f6 !important;
}

.vm-vanity-react-root [class~="bg-gray-100"][class~="hover:bg-gray-200"][class~="text-left"]:hover {
	background: #e5e7eb !important;
}

.vm-vanity-react-root [class~="tracking-widest"][class~="uppercase"][class~="rounded-full"],
.vm-vanity-react-root [class~="tracking-wide"][class~="text-sm"]:last-child {
	background-color: #232427 !important;
	border-color: #232427 !important;
	color: #fff !important;
}

.vm-vanity-react-root [class~="tracking-widest"][class~="uppercase"][class~="rounded-full"][class~="cursor-default"],
.vm-vanity-react-root button:disabled {
	background-color: transparent !important;
	border-color: #d1d5db !important;
	color: #d1d5db !important;
	cursor: default !important;
}

.vm-vanity-react-root [class~="tracking-wide"][class~="text-sm"]:disabled {
	background-color: #e5e7eb !important;
	border-color: #e5e7eb !important;
	color: #fff !important;
}

.vm-vanity-react-root [role="menu"] {
	border-radius: 4px !important;
	box-shadow: 0 10px 24px rgba(15, 23, 42, .14) !important;
	min-width: 148px !important;
	overflow: hidden;
	z-index: 40 !important;
}

.vm-vanity-react-root [role="menuitem"] {
	cursor: pointer !important;
}

.vm-vanity-react-root [class~="px-5"][class~="pt-4"] {
	padding: 16px 18px 0 !important;
}

.vm-vanity-react-root hr[class~="mt-5"] {
	margin-top: 14px !important;
}

.vm-vanity-react-root [class~="mt-5"][class~="flex-wrap"] {
	column-gap: 18px !important;
	margin-top: 16px !important;
	row-gap: 12px !important;
}

.vm-vanity-react-root [class~="px-5"][class~="py-5"] {
	padding: 16px 18px !important;
}

.vm-vanity-react-root [class~="grid-cols-5"] {
	gap: 12px 10px !important;
	grid-template-columns: repeat(auto-fill, 72px) !important;
	justify-content: start !important;
}

.vm-vanity-react-root [class~="grid-cols-4"] {
	gap: 12px !important;
	grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)) !important;
}

.vm-vanity-react-root [class~="grid-cols-3"] {
	gap: 14px 12px !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.vm-vanity-react-root [class~="grid-cols-3"] > button,
.vm-vanity-react-root [class~="grid-cols-3"] > [class~="flex-col"] {
	align-items: center !important;
}

.vm-vanity-react-root [class~="aspect-square"][class~="overflow-hidden"] {
	border-radius: 0 !important;
}

.vm-vanity-react-root [class~="grid-cols-5"] > [class~="flex-col"] {
	width: 72px !important;
}

.vm-vanity-react-root [class~="grid-cols-5"] [class~="aspect-square"] {
	height: 72px !important;
	width: 72px !important;
}

.vm-vanity-react-root [class~="grid-cols-3"] [class~="aspect-square"] {
	aspect-ratio: 1 / 1 !important;
	flex: none !important;
	height: auto !important;
	margin: 0 !important;
	max-width: none !important;
	min-height: 0 !important;
	width: 100% !important;
}

.vm-vanity-react-root [class~="grid-cols-4"] [class~="aspect-square"] {
	flex: 0 0 auto !important;
	height: 82px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 100% !important;
	width: 82px !important;
}

.vm-vanity-react-root [class~="grid-cols-3"] img,
.vm-vanity-react-root [class~="grid-cols-4"] img {
	height: 100% !important;
	object-fit: contain !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] {
	column-gap: 16px !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	padding: 20px !important;
	row-gap: 20px !important;
}

.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] > button {
	align-items: center !important;
	gap: 6px !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] [class~="aspect-square"] {
	aspect-ratio: 1 / 1 !important;
	flex: none !important;
	height: auto !important;
	margin: 0 !important;
	max-width: none !important;
	min-height: 0 !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] img {
	height: 100% !important;
	object-fit: contain !important;
	width: 100% !important;
}

.vm-vanity-react-root [class~="grid-cols-5"] img {
	height: 100% !important;
	object-fit: cover !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] {
	gap: 6px !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	justify-content: stretch !important;
}

.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] > [class~="flex-col"] {
	gap: 4px !important;
	min-width: 0 !important;
	width: auto !important;
}

.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] [class~="aspect-square"] {
	aspect-ratio: 1 / 1 !important;
	height: auto !important;
	width: 100% !important;
}

.vm-vanity-react-root [class~="h-14"][class~="border"] {
	height: 52px !important;
}

.vm-vanity-react-root button[class~="flex-1"][class~="min-w-0"] [class~="h-14"][class~="border"] {
	height: 50px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 100% !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-size-row {
	align-items: flex-start !important;
}

.vm-vanity-react-root .vm-vanity-size-options {
	column-gap: 12px !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-image {
	border-color: transparent !important;
	border-style: solid !important;
	border-width: 1px !important;
	height: 50px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 100% !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-image.is-selected,
.vm-vanity-react-root .vm-vanity-size-option.is-selected .vm-vanity-size-image,
.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-image[class~="border-gray-800"] {
	border-color: #1f2937 !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-label {
	color: #374151 !important;
	font-weight: 500 !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-label.is-selected,
.vm-vanity-react-root .vm-vanity-size-option.is-selected .vm-vanity-size-label,
.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-label[class~="font-bold"] {
	color: #111827 !important;
	font-weight: 700 !important;
}

.vm-vanity-react-root .vm-vanity-filter-chip {
	font-weight: 500 !important;
}

.vm-vanity-react-root .vm-vanity-filter-chip.is-selected,
.vm-vanity-react-root .vm-vanity-filter-chip[class~="border-gray-800"] {
	font-weight: 700 !important;
}

.vm-vanity-react-root .vm-vanity-product-tile {
	background-color: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
}

.vm-vanity-react-root .vm-vanity-product-tile.is-selected,
.vm-vanity-react-root .vm-vanity-product-tile[class~="bg-gray-100"] {
	background-color: #f3f4f6 !important;
	border-color: #d1d5db !important;
	box-shadow: none !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-rule {
	align-items: center !important;
	display: flex !important;
	margin-top: 6px !important;
	padding-left: 4px !important;
	padding-right: 4px !important;
	width: 100% !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-rule > span:first-child,
.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-rule > span:last-child {
	background: #4b5563 !important;
	border-radius: 9999px !important;
	flex-shrink: 0 !important;
	height: 5px !important;
	width: 5px !important;
}

.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-rule > span:nth-child(2) {
	background: #9ca3af !important;
	flex: 1 1 auto !important;
	height: 1px !important;
}

.vm-vanity-react-root .vm-vanity-size-all {
	align-self: flex-start !important;
	padding-top: 0 !important;
}

.vm-vanity-react-root .vm-vanity-size-all .vm-vanity-filter-all {
	margin-top: 0 !important;
}

.vm-vanity-react-root button[class~="px-5"][class~="py-2.5"],
.vm-vanity-react-root button[class~="px-5"][class~="md:py-1.5"] {
	align-items: center !important;
	display: inline-flex !important;
	height: 34px !important;
	justify-content: center !important;
	min-width: 74px !important;
	padding: 7px 14px !important;
}

.vm-vanity-react-root .vm-vanity-color-grid [class~="scale-95"],
.vm-vanity-react-root .vm-vanity-color-grid [class~="border-gray-900"] {
	border-color: #111827 !important;
	box-shadow: inset 0 0 0 1px #111827 !important;
	transform: none !important;
}

@media (max-width: 767px) {
	.vm-vanity-shell {
		min-height: 860px;
	}

	.vm-vanity-react-host {
		height: 860px;
	}

	.vm-vanity-react-root [class~="fixed"][class~="inset-0"][class~="bg-black/60"] {
		padding: 12px !important;
	}

	.vm-vanity-react-root [class~="fixed"][class~="inset-0"][class~="bg-black/60"] > div {
		border-radius: 22px !important;
		max-height: calc(100vh - 24px) !important;
	}

	.vm-vanity-react-root .vm-vanity-info-overlay[class~="fixed"][class~="inset-0"][class~="bg-black/60"] {
		padding: 14px !important;
	}

	.vm-vanity-react-root .vm-vanity-info-modal {
		border-radius: 28px !important;
		max-height: calc(100vh - 28px) !important;
		padding: 30px 24px 28px !important;
		width: calc(100vw - 28px) !important;
	}

	.vm-vanity-react-root .vm-vanity-info-modal > [class~="flex"] {
		flex-direction: column !important;
		gap: 24px !important;
	}

	.vm-vanity-react-root .vm-vanity-info-modal [class~="mb-3"][class~="justify-between"] {
		gap: 16px !important;
	}

	.vm-vanity-react-root .vm-vanity-info-modal h3 {
		font-size: 18px !important;
	}

	.vm-vanity-react-root .vm-vanity-info-modal [class~="grid-cols-[max-content_1fr]"] {
		column-gap: 18px !important;
		grid-template-columns: 84px minmax(0, 1fr) !important;
	}

	.vm-vanity-react-root [class~="grid-cols-5"],
	.vm-vanity-react-root [class~="grid-cols-4"] {
		grid-template-columns: repeat(auto-fill, 68px) !important;
	}

	.vm-vanity-react-root [class~="grid-cols-3"] {
		gap: 12px 10px !important;
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}

	.vm-vanity-react-root [class~="grid-cols-5"] > [class~="flex-col"] {
		width: 68px !important;
	}

	.vm-vanity-react-root [class~="grid-cols-5"] [class~="aspect-square"] {
		height: 68px !important;
		width: 68px !important;
	}

	.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] {
		gap: 6px !important;
		grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	}

	.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] > [class~="flex-col"] {
		width: auto !important;
	}

	.vm-vanity-react-root .vm-vanity-color-grid[class~="grid-cols-5"] [class~="aspect-square"] {
		height: auto !important;
		width: 100% !important;
	}

	.vm-vanity-react-root [class~="grid-cols-3"] [class~="aspect-square"] {
		height: auto !important;
		min-height: 0 !important;
		width: 100% !important;
	}

	.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] {
		column-gap: 16px !important;
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		padding: 20px !important;
		row-gap: 20px !important;
	}

	.vm-vanity-react-root .vm-vanity-product-grid[class~="grid-cols-3"] [class~="aspect-square"] {
		height: auto !important;
		width: 100% !important;
	}

	.vm-vanity-react-root [class~="grid-cols-4"] [class~="aspect-square"] {
		height: 72px !important;
		width: 72px !important;
	}

	.vm-vanity-react-root button[class~="flex-1"][class~="min-w-0"] [class~="h-14"][class~="border"] {
		height: 46px !important;
		width: 100% !important;
	}

	.vm-vanity-react-root .vm-vanity-size-option .vm-vanity-size-image {
		height: 46px !important;
		width: 100% !important;
	}

	.vm-vanity-react-root button[class~="px-5"][class~="py-2.5"],
	.vm-vanity-react-root button[class~="px-5"][class~="md:py-1.5"] {
		min-width: 68px !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}

.vmvc-cart-preview-image,.vmkc-cart-preview-image,.vmwc-cart-preview-image{display:block;width:80px;height:80px;object-fit:contain;background:#f7f7f7;border:1px solid #e5e7eb}
.woocommerce-cart-form .product-thumbnail img.vmvc-cart-preview-image,.woocommerce-cart-form .product-thumbnail img.vmkc-cart-preview-image,.woocommerce-cart-form .product-thumbnail img.vmwc-cart-preview-image{max-width:96px;width:96px;height:auto}

