.mft-customizer {
	--mft-green: #16833d;
	--mft-red: #b42318;
	--mft-border: #d0d5dd;
	margin: 1.25rem 0;
	padding: 1.25rem;
	border: 1px solid var(--mft-border);
	border-radius: 10px;
	background: #fff;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	flex: 0 0 100% !important;
	grid-column: 1 / -1;
	order: -100;
}

/* Elementor zet het add-to-cartformulier vaak op één flexregel. Het
 * customizervak krijgt altijd een volledige regel boven aantal en knop. */
.elementor-widget-woocommerce-product-add-to-cart .elementor-add-to-cart form.cart.mft-cart-form,
.elementor-widget-woocommerce-product-add-to-cart form.cart.mft-cart-form,
form.cart.mft-cart-form,
.mft-cart-layout {
	flex-wrap: wrap !important;
	align-items: flex-start !important;
}

.mft-cart-layout > .mft-customizer,
form.cart.mft-cart-form > .mft-customizer {
	flex-basis: 100% !important;
	width: 100% !important;
	max-width: 100% !important;
	align-self: stretch;
}

.mft-customizer h3 {
	margin: 0 0 .35rem;
	font-size: 1.15em;
}

.mft-intro {
	margin: 0 0 1rem;
}

.mft-help-note {
	margin: -.45rem 0 1rem;
}

.mft-help-note a,
.mft-contact-note a {
	text-decoration: underline;
}

.mft-count,
.mft-extra-options {
	margin: 0 0 1rem;
	padding: 0;
	border: 0;
}

.mft-count legend,
.mft-extra-options legend,
.mft-slot > label {
	display: block;
	margin-bottom: .4rem;
	font-weight: 600;
}

.mft-count label + label,
.mft-extra-options label + label {
	margin-left: 1rem;
}

.mft-slot {
	margin-bottom: 1rem;
}

.mft-input-row {
	display: flex;
	gap: .5rem;
	align-items: stretch;
}

.mft-input-row .mft-item-number {
	flex: 1 1 auto;
	min-width: 0;
}

.mft-input-row .mft-check {
	flex: 0 0 auto;
}

.mft-result {
	display: flex;
	gap: .65rem;
	align-items: center;
	min-height: 1.7rem;
	margin-top: .45rem;
	font-size: .92em;
}

.mft-result-line {
	display: inline-flex;
	gap: .4rem;
	align-items: flex-start;
}

.mft-result-line.is-valid {
	color: var(--mft-green);
}

.mft-result-line.is-invalid,
.mft-form-message {
	color: var(--mft-red);
}

.mft-status-icon {
	display: inline-grid;
	place-items: center;
	flex: 0 0 1.3rem;
	width: 1.3rem;
	height: 1.3rem;
	border-radius: 50%;
	color: #fff;
	font-weight: 700;
	line-height: 1;
}

.mft-result-line.is-valid .mft-status-icon {
	background: var(--mft-green);
}

.mft-result-line.is-invalid .mft-status-icon {
	background: var(--mft-red);
}

.mft-thumbnail {
	width: 54px;
	height: 54px;
	object-fit: contain;
	border: 1px solid var(--mft-border);
	border-radius: 6px;
	background: #fff;
}

.mft-accessory {
	display: flex;
	gap: .7rem;
	align-items: center;
	margin-top: .75rem;
	padding: .85rem 1rem;
	border: 2px solid var(--mft-green);
	border-radius: 8px;
	background: #f2faf5;
	font-size: 1.05em;
	font-weight: 650;
	cursor: pointer;
}

.mft-accessory input[type="checkbox"] {
	flex: 0 0 auto;
	width: 1.3rem;
	height: 1.3rem;
	margin: 0;
	accent-color: var(--mft-green);
}

.mft-form-message {
	margin: .7rem 0 0;
	font-weight: 600;
}

.mft-contact-note {
	margin: 1rem 0 0;
	font-size: .82em;
	line-height: 1.45;
	opacity: .82;
}

.mft-customizer .is-hidden {
	display: none !important;
}

@media (max-width: 480px) {
	.mft-input-row {
		flex-direction: column;
	}

	.mft-count label,
	.mft-extra-options label {
		display: block;
	}

	.mft-count label + label,
	.mft-extra-options label + label {
		margin: .4rem 0 0;
	}
}

.mft-preview-anchor { display: none !important; }
.mft-stock-notice p { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
.mft-gallery-stack { min-width: 0; }
.mft-gallery-stack > .woocommerce-product-gallery { width: 100% !important; float: none !important; margin-bottom: 0 !important; }
.mft-preview {
	box-sizing: border-box;
	flex: 0 0 100%;
	grid-column: 1 / -1;
	clear: both;
	width: 100%;
	max-width: 100%;
	margin: 1.5rem 0 0;
	padding: 1rem;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	background: #fff;
	color: #1d2939;
}
.mft-preview .mft-preview-title { text-align: center; font-size: 1.15rem; font-weight: 600; margin: 0 0 1rem; }
.mft-preview-grid { display: grid; gap: 1rem; align-items: end; }
.mft-preview .mft-preview-card { position: static !important; transform: none !important; float: none !important; margin: 0 !important; padding: 0 !important; min-width: 0; text-align: center; background: transparent !important; box-shadow: none !important; }
.mft-preview-visual { height: 210px; display: flex; align-items: center; justify-content: center; flex-direction: column; min-width: 0; overflow: hidden; }
.mft-preview .mft-preview-minifig { display: block !important; position: static !important; transform: none !important; float: none !important; width: auto !important; height: 100% !important; min-width: 0 !important; min-height: 0 !important; max-height: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; object-fit: contain !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: transparent !important; }
.mft-preview-card figcaption { margin-top: .6rem; font-size: .95rem; line-height: 1.35; overflow-wrap: anywhere; }
.mft-preview-placeholder { color: #667085; font-size: .9rem; line-height: 1.5; max-width: 220px; }
.mft-preview-tray { box-sizing: border-box; display: block; flex: 0 0 auto; width: 70%; max-width: 140px; height: auto; aspect-ratio: 4 / 6; border: 2px solid #667085; border-radius: 4px; background: #fafafa; }
.mft-preview-tray-size { display: block; margin-top: .25rem; font-size: .8rem; line-height: 1.4; color: #667085; }
.mft-preview-universal { display: block; width: 75%; height: 82%; fill: #cbd5e1; stroke: #667085; stroke-width: 2; }
.mft-preview-universal-label { font-size: .85rem; color: #667085; }
@media (max-width: 767px) {
	.mft-gallery-stack { width: 100% !important; float: none !important; }
	.mft-preview { margin: 1.25rem 0; padding: .85rem; }
	.mft-preview-grid { gap: .6rem; }
	.mft-preview-visual { height: 170px; }
	.mft-preview-tray { max-width: 110px; }
	.mft-preview-placeholder { font-size: .78rem; }
	.mft-preview-card figcaption { font-size: .85rem; }
	.mft-customizer { min-width: 0; }
	.mft-count label, .mft-extra-options label { display: flex; gap: .35rem; align-items: baseline; flex-wrap: wrap; margin: .5rem 0 !important; }
	.mft-count input[type="radio"], .mft-extra-options input[type="radio"] { flex: 0 0 auto; }
	.mft-input-row .mft-check { white-space: normal; }
}