/* Shared structure. These rules do not reset the surrounding theme table. */
.lpv-variations {
	margin-bottom: 1.5em;
}

.lpv-variations th,
.lpv-variations td,
.lpv-label,
.lpv-value {
	display: block;
	padding: .35em 0 !important;
}

.lpv-row {
	display: block;
	width: 100%;
}

.lpv-selection {
	font-weight: 400;
}

.lpv-options {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 6px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.lpv-options > .lpv-option {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.lpv-options > .lpv-option::before,
.lpv-options > .lpv-option::after,
.lpv-options > .lpv-option::marker {
	display: none !important;
	content: none !important;
}

.lpv-option > a,
.lpv-option > span {
	display: block;
	box-shadow: none !important;
	text-decoration: none !important;
}

.lpv-option.is-unavailable {
	opacity: .42;
}

.lpv-option.has-image {
	width: 64px;
	max-width: 64px;
}

.lpv-option.has-image > a,
.lpv-option.has-image > span {
	padding: 0 !important;
	overflow: hidden;
}

.lpv-option.has-image img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	object-fit: contain;
}

/* Traditional linked-variation buttons. Theme typography and table styling
 * remain intact. */
.lpv-style--buttons .lpv-option > a,
.lpv-style--buttons .lpv-option > span {
	padding: 6px 11px !important;
	background: transparent;
	border: 1px solid #c7c7c7 !important;
}

.lpv-style--buttons .lpv-option > a:hover,
.lpv-style--buttons .lpv-option > a:focus {
	border-color: #555 !important;
}

.lpv-style--buttons .lpv-option.is-current > span {
	background: rgba(0, 0, 0, .055);
	border-color: currentColor !important;
	font-weight: 700;
}

.lpv-style--buttons .lpv-option.has-image > a,
.lpv-style--buttons .lpv-option.has-image > span {
	border: 1px solid #c7c7c7 !important;
}

/* Optional, group-specific theme normalization. This cleans the surrounding
 * WooCommerce table without changing the selected Buttons/Dropdown style. */
.woocommerce div.product .lpv-normalized,
.woocommerce div.product form.cart .lpv-normalized,
.lpv-normalized {
	display: block !important;
	box-sizing: border-box;
	width: 100% !important;
	margin: 0 0 1.5em !important;
	padding: 0 !important;
	background: #fff !important;
	border: 0 !important;
	border-collapse: collapse !important;
	border-spacing: 0 !important;
	box-shadow: none !important;
}

.woocommerce div.product .lpv-normalized tbody,
.woocommerce div.product .lpv-normalized tr,
.woocommerce div.product .lpv-normalized th,
.woocommerce div.product .lpv-normalized td,
.woocommerce div.product .lpv-normalized .lpv-row,
.woocommerce div.product .lpv-normalized .lpv-label,
.woocommerce div.product .lpv-normalized .lpv-value,
.lpv-normalized tbody,
.lpv-normalized tr,
.lpv-normalized th,
.lpv-normalized td,
.lpv-normalized .lpv-row,
.lpv-normalized .lpv-label,
.lpv-normalized .lpv-value {
	display: block !important;
	box-sizing: border-box;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	background: #fff !important;
	border: 0 !important;
	box-shadow: none !important;
	text-align: left !important;
}

.woocommerce div.product .lpv-normalized tr + tr,
.lpv-normalized tr + tr {
	margin-top: 14px !important;
}

.woocommerce div.product .lpv-normalized th.label,
.woocommerce div.product .lpv-normalized .lpv-label,
.lpv-normalized th.label,
.lpv-normalized .lpv-label {
	padding-bottom: 5px !important;
}

.woocommerce div.product .lpv-normalized th.label label,
.woocommerce div.product .lpv-normalized .lpv-label-text,
.lpv-normalized th.label label,
.lpv-normalized .lpv-label-text {
	display: inline !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: inherit !important;
	font: inherit;
	font-weight: 600;
}

.woocommerce div.product .lpv-normalized .lpv-options,
.lpv-normalized .lpv-options {
	gap: 7px 14px;
	margin: 0 !important;
	background: #fff !important;
	border: 0 !important;
	box-shadow: none !important;
}

.woocommerce div.product .lpv-normalized .lpv-option,
.lpv-normalized .lpv-option {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.woocommerce div.product .lpv-normalized .lpv-option > a,
.woocommerce div.product .lpv-normalized .lpv-option > span,
.lpv-normalized .lpv-option > a,
.lpv-normalized .lpv-option > span {
	margin: 0 !important;
	color: inherit !important;
	font: inherit;
	line-height: 1.35;
}

.woocommerce div.product .lpv-normalized .lpv-option.is-current > span,
.lpv-normalized .lpv-option.is-current > span {
	font-weight: 700;
}

.woocommerce div.product .lpv-normalized .lpv-option.has-image img,
.lpv-normalized .lpv-option.has-image img {
	background: #fff !important;
	border: 0 !important;
	box-shadow: none !important;
}

.lpv-dropdown {
	box-sizing: border-box;
	width: auto;
	min-width: 220px;
	max-width: 100%;
	margin: 0;
}

/* Mobile theme protection. Some themes turn WooCommerce variation tables
 * back into two columns and restore list bullets on narrow screens. */
@media (max-width: 600px) {
	.woocommerce div.product .lpv-variations,
	.woocommerce div.product form.cart .lpv-variations,
	.lpv-variations {
		display: block !important;
		box-sizing: border-box !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		table-layout: fixed !important;
	}

	.woocommerce div.product .lpv-variations tbody,
	.woocommerce div.product .lpv-variations tr,
	.woocommerce div.product .lpv-variations th,
	.woocommerce div.product .lpv-variations td,
	.woocommerce div.product .lpv-variations .lpv-row,
	.woocommerce div.product .lpv-variations .lpv-label,
	.woocommerce div.product .lpv-variations .lpv-value,
	.lpv-variations tbody,
	.lpv-variations tr,
	.lpv-variations th,
	.lpv-variations td,
	.lpv-variations .lpv-row,
	.lpv-variations .lpv-label,
	.lpv-variations .lpv-value {
		display: block !important;
		box-sizing: border-box !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
	}

	.woocommerce div.product .lpv-variations .lpv-options,
	.lpv-variations .lpv-options {
		padding: 0 !important;
		list-style: none !important;
	}

	.woocommerce div.product .lpv-variations .lpv-option,
	.lpv-variations .lpv-option {
		display: block !important;
		min-width: 0 !important;
		list-style: none !important;
	}

	.woocommerce div.product .lpv-normalized .lpv-options:not(.lpv-options--images),
	.lpv-normalized .lpv-options:not(.lpv-options--images) {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2px 14px;
		width: 100% !important;
	}

	.woocommerce div.product .lpv-normalized .lpv-option > a,
	.woocommerce div.product .lpv-normalized .lpv-option > span,
	.lpv-normalized .lpv-option > a,
	.lpv-normalized .lpv-option > span {
		box-sizing: border-box;
		width: 100%;
		min-height: 36px;
		padding: 7px 0 !important;
		overflow-wrap: anywhere;
		white-space: normal !important;
	}

	.woocommerce div.product .lpv-options--images,
	.lpv-options--images {
		display: flex !important;
		flex-wrap: wrap !important;
	}
}

@media (max-width: 360px) {
	.woocommerce div.product .lpv-normalized .lpv-options:not(.lpv-options--images),
	.lpv-normalized .lpv-options:not(.lpv-options--images) {
		grid-template-columns: 1fr;
	}
}
