.unyk-designer-widget {
	margin: 18px 0;
}

/* Product CTA: a prominent, full-width button in the theme's primary (add-to-cart) style. */
.unyk-open-designer {
	width: 100%;
}

/* Linked-design: one simple, neutral card — thumbnail + label + edit button. */
.unyk-linked-design {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 14px 0;
	padding: 12px;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	background: #fff;
}

.unyk-linked-preview {
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
	object-fit: contain;
	border: 1px solid #e6e6e6;
	border-radius: 6px;
	background: #fff;
}

.unyk-linked-design-body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.unyk-linked-design-body strong {
	font-size: 15px;
}

.unyk-linked-design-id {
	font-size: 13px;
	color: #666;
}

.unyk-edit-design {
	align-self: flex-start;
	margin-top: 4px;
}

.unyk-add-new-design {
	align-self: flex-start;
	margin-top: 2px;
	font-size: 13px;
	color: #666;
	text-decoration: underline;
}

.unyk-linked-design-hidden-by-setting,
.unyk-linked-preview-hidden-by-setting {
	display: none !important;
}

.unyk-designer-instruction {
	display: block;
	margin-top: 3px;
	color: rgba(255,255,255,.86);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.25;
	text-align: center;
}

.unyk-designer-widget .is-hidden,
.unyk-template-editor-widget .is-hidden,
.unyk-modal.is-hidden,
.unyk-mobile-designer .is-hidden {
	display: none !important;
}

.unyk-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background: rgba(0,0,0,.55);
	display: grid;
	place-items: center;
	padding: 14px;
}

body > .unyk-modal {
	z-index: 2147483000 !important;
	isolation: isolate;
}

.unyk-modal-inner {
	width: min(980px, 100%);
	max-height: 94vh;
	overflow: hidden;
	background: #fff;
	border-radius: 18px;
	display: grid;
	grid-template-rows: 70px minmax(0, 1fr) auto;
	box-shadow: 0 20px 70px rgba(0,0,0,.28);
}

.unyk-modal-topbar {
	background: #7a302e;
	color: #fff;
	display: grid;
	grid-template-columns: 52px 1fr 52px;
	gap: 10px;
	align-items: center;
	padding: 0 12px;
}

.unyk-modal-topbar button {
	border: 0;
	background: rgba(255,255,255,.12);
	color: #fff;
	border-radius: 10px;
	font-size: 28px;
	height: 44px;
}

.unyk-modal-topbar strong,
.unyk-modal-topbar span {
	display: block;
	line-height: 1.2;
}

.unyk-modal-topbar span {
	font-size: 13px;
	opacity: .85;
}

.unyk-canvas-wrap {
	background: #f6f6f6;
	display: grid;
	place-items: center;
	padding: 12px;
	min-height: 0;
	overflow: hidden;
}

.unyk-canvas {
	max-width: 100%;
	max-height: 58vh;
	background: #fff;
	box-shadow: 0 4px 18px rgba(0,0,0,.08);
	touch-action: none;
}

.unyk-controls {
	border-top: 1px solid #eee;
	padding: 14px;
	background: #fff;
}

.unyk-controls label {
	display: grid;
	gap: 7px;
	font-weight: 700;
	margin-bottom: 10px;
}

.unyk-controls textarea,
.unyk-controls select,
.unyk-controls input[type="range"] {
	width: 100%;
}

.unyk-controls textarea,
.unyk-controls select {
	border: 1px solid #ddd;
	border-radius: 10px;
	padding: 10px;
}

.unyk-control-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.unyk-button-row {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.unyk-help {
	margin: 10px 0 0;
	font-size: 13px;
	color: #777;
}

.unyk-cart-preview {
	display: block;
	width: 130px;
	max-width: 100%;
	height: auto;
	border: 1px solid #ddd;
	border-radius: 6px;
	margin-top: 8px;
}

.unyk-order-design {
	margin-top: 10px;
	padding: 10px;
	background: #fff8f8;
	border: 1px solid #ead6d6;
	border-radius: 8px;
}

.unyk-order-design img {
	display: block;
	width: 180px;
	max-width: 100%;
	height: auto;
	border: 1px solid #ddd;
	border-radius: 6px;
	margin: 8px 0;
}

@media (max-width: 640px) {
	.unyk-modal {
		padding: 0;
		align-items: stretch;
		overflow: hidden;
	}

	.unyk-modal-inner {
		height: 100vh;
		max-height: 100vh;
		height: 100dvh;
		max-height: 100dvh;
		border-radius: 0;
		grid-template-rows: 64px minmax(0, 1fr) auto;
	}

	.unyk-canvas {
		max-height: 100%;
	}

	.unyk-control-grid {
		grid-template-columns: 1fr;
	}

	.unyk-button-row .button {
		flex: 1;
	}
}


/* V1.2 verbeteringen */

.unyk-modal-topbar .unyk-close-modal,
.unyk-modal-topbar .unyk-confirm-design {
	display: grid !important;
	place-items: center !important;
	width: 46px !important;
	min-width: 46px !important;
	height: 46px !important;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
	border-radius: 12px !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

.unyk-modal-topbar .unyk-close-modal {
	background: rgba(255,255,255,.08) !important;
}

.unyk-modal-topbar .unyk-confirm-design {
	background: #2f746b !important;
	font-size: 30px !important;
}

.unyk-main-design-preview {
	width: 100%;
	display: grid;
	place-items: center;
	background: #fff;
	border-radius: inherit;
}

.unyk-main-design-preview img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.woocommerce-product-gallery.unyk-has-design-preview .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-of-type {
	display: none !important;
}

.unyk-controls {
	box-shadow: 0 -4px 16px rgba(0,0,0,.04);
}

.unyk-button-row .button {
	border-radius: 8px !important;
}

@media (min-width: 860px) {
	.unyk-modal-inner {
		grid-template-columns: minmax(0, 1fr) 340px;
		grid-template-rows: 70px minmax(0, 1fr);
	}

	.unyk-modal-topbar {
		grid-column: 1 / -1;
	}

	.unyk-canvas-wrap {
		grid-column: 1;
		grid-row: 2;
	}

	.unyk-controls {
		grid-column: 2;
		grid-row: 2;
		border-top: 0;
		border-left: 1px solid #eee;
		overflow: auto;
	}

	.unyk-canvas {
		max-height: 72vh;
	}
}

@media (max-width: 640px) {
	.unyk-modal-topbar {
		grid-template-columns: 46px 1fr 46px;
	}

	.unyk-modal-topbar strong {
		font-size: 15px;
	}

	.unyk-modal-topbar span {
		font-size: 12px;
	}

	.unyk-controls {
		max-height: 42vh;
		overflow: auto;
	}
}


/* V1.3 product flow improvements */

/* .unyk-flow-note styling now comes from WooCommerce's native .woocommerce-info notice. */

.unyk-cart-flow {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: flex-start;
}

.unyk-cart-flow .unyk-designer-widget {
	flex: 1 1 100%;
	order: 1;
}

.unyk-cart-flow .quantity,
.unyk-cart-flow .single_add_to_cart_button,
.unyk-cart-flow button[name="add-to-cart"] {
	order: 2;
}

.unyk-cart-flow .quantity {
	min-width: 78px;
}

.unyk-cart-flow .single_add_to_cart_button,
.unyk-cart-flow button[name="add-to-cart"] {
	min-width: 220px;
}

.unyk-qty-wrap.unyk-disabled-block {
	opacity: .45;
	pointer-events: none;
}

.unyk-cart-disabled,
.unyk-cart-flow .single_add_to_cart_button.unyk-cart-disabled,
.unyk-cart-flow button[name="add-to-cart"].unyk-cart-disabled {
	background: #c9c4bc !important;
	border-color: #c9c4bc !important;
	color: #fff !important;
	opacity: 1 !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
}

/* Linked-design card styling is consolidated near the top of this file. */

.unyk-cart-flow.unyk-needs-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-needs-design button[name="add-to-cart"] {
	opacity: 1 !important;
}

@media (max-width: 680px) {
	.unyk-cart-flow {
		display: grid;
		grid-template-columns: 1fr;
	}

	.unyk-cart-flow .quantity,
	.unyk-cart-flow .single_add_to_cart_button,
	.unyk-cart-flow button[name="add-to-cart"] {
		width: 100%;
		min-width: 0;
	}
}


/* V1.4: Add to cart pas tonen nadat ontwerp klaar is */

.unyk-cart-flow.unyk-needs-design .quantity,
.unyk-cart-flow.unyk-needs-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-needs-design button[name="add-to-cart"] {
	display: none !important;
}

/* First paint before JS runs: server-set body class keeps the native qty + add-to-cart
   hidden so the gated state matches the final JS state (no flash / layout shift). Once JS
   runs, updatePurchaseState toggles inline display (inline !important wins) and reveals them
   as soon as a design is linked. */
body.unyk-designer-gated form.cart .quantity,
body.unyk-designer-gated form.cart .single_add_to_cart_button,
body.unyk-designer-gated form.cart button[name="add-to-cart"] {
	display: none !important;
}

.unyk-cart-flow.unyk-has-design .quantity,
.unyk-cart-flow.unyk-has-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-has-design button[name="add-to-cart"] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
}

/* .unyk-ready-note styling now comes from WooCommerce's native .woocommerce-message notice. */

.unyk-cart-flow.unyk-has-design {
	margin-top: 12px;
}

.unyk-cart-flow.unyk-has-design .quantity {
	height: 52px;
}

.unyk-cart-flow.unyk-has-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-has-design button[name="add-to-cart"] {
	min-height: 52px;
	border-radius: 10px !important;
	font-weight: 800 !important;
}

.unyk-cart-flow.unyk-needs-design .unyk-open-designer {
	margin-bottom: 0 !important;
}

.unyk-cart-flow.unyk-has-design .unyk-open-designer {
	display: none !important;
}


@media (max-width: 680px) {
	.unyk-cart-flow.unyk-has-design .quantity,
	.unyk-cart-flow.unyk-has-design .single_add_to_cart_button,
	.unyk-cart-flow.unyk-has-design button[name="add-to-cart"] {
		width: 100%;
		display: flex !important;
	}
}


/* V1.5: hoofdafbeelding links zichtbaar houden */

.woocommerce-product-gallery.unyk-has-design-preview .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-of-type {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.woocommerce-product-gallery__image.unyk-design-main-image {
	display: block !important;
	width: 100% !important;
	min-height: 300px;
	background: #fff;
	text-align: center;
}

.woocommerce-product-gallery__image.unyk-design-main-image a {
	display: block !important;
	width: 100% !important;
}

.woocommerce-product-gallery__image.unyk-design-main-image img,
.unyk-gallery-preview-img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	object-fit: contain !important;
	margin: 0 auto !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.unyk-main-design-preview {
	display: none !important;
}


/* V1.6: preview in cart en checkout */

.unyk-cart-thumb-preview {
	display: block !important;
	width: 88px !important;
	max-width: 88px !important;
	height: auto !important;
	object-fit: contain !important;
	border: 1px solid #e2e2e2 !important;
	border-radius: 8px !important;
	background: #fff !important;
	padding: 4px !important;
}

.unyk-checkout-inline-preview {
	margin-top: 8px;
}

.unyk-checkout-inline-preview img {
	display: block !important;
	width: 90px !important;
	max-width: 90px !important;
	height: auto !important;
	object-fit: contain !important;
	border: 1px solid #e2e2e2 !important;
	border-radius: 8px !important;
	background: #fff !important;
	padding: 4px !important;
}

.wc-block-cart-items__row .wc-block-cart-item__image img[src^="data:image"],
.wc-block-components-order-summary-item__image img[src^="data:image"],
.wc-block-components-product-image img[src^="data:image"] {
	object-fit: contain !important;
	background: #fff !important;
	border-radius: 8px !important;
}


/* V1.7: veilige hoofdpreview zonder WooCommerce zoom/crop */

.woocommerce-product-gallery.unyk-safe-preview-active {
	position: relative;
}

.unyk-safe-main-preview {
	width: 100%;
	min-height: 460px;
	max-height: 640px;
	aspect-ratio: 1 / 1;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	margin: 0 0 18px;
	padding: 18px;
	box-sizing: border-box;
}

.unyk-safe-main-preview-img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
	margin: 0 auto !important;
	transform: none !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.woocommerce-product-gallery.unyk-safe-preview-active .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child {
	display: none !important;
}

.woocommerce-product-gallery.unyk-safe-preview-active .zoomImg {
	display: none !important;
}

.woocommerce-product-gallery.unyk-safe-preview-active .woocommerce-product-gallery__trigger {
	z-index: 5;
}

@media (max-width: 700px) {
	.unyk-safe-main-preview {
		min-height: 320px;
		max-height: 480px;
		padding: 12px;
	}
}


/* V1.8: cart/checkout preview + edit link */

.unyk-cart-js-preview {
	margin-top: 10px;
	padding: 10px;
	background: #fff8f8;
	border: 1px solid #ead6d6;
	border-radius: 10px;
	max-width: 220px;
}

.unyk-cart-js-preview strong {
	display: block;
	margin-bottom: 7px;
	color: #7a302e;
	font-size: 13px;
}

.unyk-cart-js-preview img {
	display: block !important;
	width: 120px !important;
	max-width: 120px !important;
	height: auto !important;
	object-fit: contain !important;
	background: #fff !important;
	border: 1px solid #e2e2e2 !important;
	border-radius: 8px !important;
	padding: 4px !important;
	margin-bottom: 8px !important;
}

.unyk-cart-js-preview a,
.unyk-cart-edit-link {
	display: inline-block;
	margin-top: 5px;
	padding: 7px 10px;
	background: #2f746b;
	color: #fff !important;
	border-radius: 8px;
	text-decoration: none !important;
	font-size: 12px;
	font-weight: 700;
}

.unyk-cart-thumb-preview-js {
	object-fit: contain !important;
	background: #fff !important;
	border-radius: 8px !important;
}

.wc-block-cart-item__image .unyk-cart-thumb-preview-js,
.wc-block-components-order-summary-item__image .unyk-cart-thumb-preview-js {
	width: 90px !important;
	height: auto !important;
}


/* V1.9: harde correctie productflow */

.unyk-cart-flow .unyk-open-designer.is-hidden,
.unyk-cart-flow .unyk-linked-design.is-hidden,
.unyk-cart-flow .unyk-ready-note.is-hidden,
.unyk-cart-flow .unyk-flow-note.is-hidden {
	display: none !important;
}

.unyk-cart-flow.unyk-needs-design .quantity,
.unyk-cart-flow.unyk-needs-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-needs-design button[name="add-to-cart"],
.unyk-cart-flow.unyk-needs-design input[name="add-to-cart"] {
	display: none !important;
}

.unyk-cart-flow.unyk-has-design .quantity {
	display: inline-flex !important;
	align-items: center !important;
}

.unyk-cart-flow.unyk-has-design .single_add_to_cart_button,
.unyk-cart-flow.unyk-has-design button[name="add-to-cart"],
.unyk-cart-flow.unyk-has-design input[name="add-to-cart"] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

.unyk-cart-flow.unyk-has-design .unyk-cart-disabled {
	opacity: 1 !important;
}

.unyk-modal.is-hidden {
	display: none !important;
}

@media (max-width: 680px) {
	.unyk-cart-flow.unyk-has-design .quantity,
	.unyk-cart-flow.unyk-has-design .single_add_to_cart_button,
	.unyk-cart-flow.unyk-has-design button[name="add-to-cart"],
	.unyk-cart-flow.unyk-has-design input[name="add-to-cart"] {
		width: 100% !important;
		display: flex !important;
	}
}


/* V1.12: stabiele gallery-overlay zonder layout te slopen */

/* Undo oude veilige preview-blokken uit eerdere testversies */
.unyk-safe-main-preview,
.unyk-product-design-main-preview,
.unyk-main-design-preview {
	display: none !important;
}

.woocommerce-product-gallery.unyk-safe-preview-active .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child,
.woocommerce-product-gallery.unyk-has-design-preview .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-of-type,
.woocommerce-product-gallery.unyk-gallery-secondary .woocommerce-product-gallery__image:first-child,
.images.unyk-gallery-secondary .woocommerce-product-gallery__image:first-child {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.woocommerce-product-gallery.unyk-gallery-overlay-active,
.images.unyk-gallery-overlay-active {
	position: relative !important;
	overflow: visible !important;
}

/* De overlay vult het hoofdvlak, maar laat de thumbnails onderin zichtbaar. */
.unyk-gallery-design-overlay {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: calc(100% - 110px) !important;
	min-height: 360px !important;
	z-index: 4 !important;
	pointer-events: none !important;
	background: #fff !important;
	border-radius: 12px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 18px !important;
	box-sizing: border-box !important;
}

.unyk-gallery-design-overlay-inner {
	width: 100% !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.unyk-gallery-design-overlay img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
	margin: 0 auto !important;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.woocommerce-product-gallery.unyk-gallery-overlay-active .woocommerce-product-gallery__trigger {
	z-index: 6 !important;
}

/* Thumbnails blijven klikbaar en zichtbaar. */
.woocommerce-product-gallery.unyk-gallery-overlay-active .flex-control-thumbs,
.images.unyk-gallery-overlay-active .flex-control-thumbs {
	position: relative !important;
	z-index: 5 !important;
}

@media (max-width: 700px) {
	.unyk-gallery-design-overlay {
		height: calc(100% - 90px) !important;
		min-height: 300px !important;
		padding: 12px !important;
	}
}


/* V1.14 Conversion Designer - eigen conversiegerichte tool op basis van stabiele v1.12 */

.unyk-modal {
	padding: 0 !important;
	background: rgba(0,0,0,.58) !important;
}

.unyk-conversion-designer {
	width: min(1120px, 100%) !important;
	height: min(920px, 96dvh) !important;
	max-height: 96dvh !important;
	background: #f7f4ef !important;
	border-radius: 22px !important;
	overflow: hidden !important;
	display: grid !important;
	grid-template-rows: 74px 58px minmax(0, 1fr) auto 72px !important;
	box-shadow: 0 24px 90px rgba(0,0,0,.32) !important;
}

.unyk-conversion-designer .unyk-modal-topbar {
	background: #7a302e !important;
	color: #fff !important;
	display: grid !important;
	grid-template-columns: 58px 1fr 92px !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 9px 16px !important;
}

.unyk-conv-title {
	min-width: 0;
}

.unyk-conv-title strong,
.unyk-conv-title span {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
}

.unyk-conv-title strong {
	font-size: 20px;
	line-height: 1.1;
	white-space: nowrap;
}

.unyk-conv-title span {
	font-size: 13px;
	opacity: .88;
	margin-top: 4px;
	white-space: nowrap;
}

.unyk-conversion-designer .unyk-close-modal,
.unyk-conversion-designer .unyk-confirm-design {
	height: 54px !important;
	border: 0 !important;
	border-radius: 16px !important;
	color: #fff !important;
	display: grid !important;
	place-items: center !important;
	font-weight: 900 !important;
	box-shadow: none !important;
}

.unyk-conversion-designer .unyk-close-modal {
	width: 54px !important;
	min-width: 54px !important;
	background: rgba(255,255,255,.09) !important;
	border: 1px solid rgba(255,255,255,.22) !important;
	font-size: 36px !important;
	padding: 0 !important;
}

.unyk-conversion-designer .unyk-modal-topbar .unyk-confirm-design {
	background: #2f746b !important;
	font-size: 15px !important;
	padding: 0 15px !important;
	white-space: nowrap;
}

.unyk-conv-progress {
	background: #fff !important;
	display: grid;
	grid-template-columns: auto 1fr auto 1fr auto;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-bottom: 1px solid #eee3da;
}

.unyk-conv-step {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: #8b7d72;
	font-size: 13px;
	font-weight: 900;
	white-space: nowrap;
}

.unyk-conv-step b {
	width: 28px;
	height: 28px;
	border-radius: 999px;
	background: #eee5dc;
	color: #7a302e;
	display: grid;
	place-items: center;
	font-size: 13px;
}

.unyk-conv-step.is-active b {
	background: #2f746b;
	color: #fff;
}

.unyk-conv-line {
	height: 2px;
	background: #eee5dc;
	border-radius: 999px;
}

.unyk-preview-card {
	position: relative;
	width: 100%;
	height: 100%;
	display: grid;
	place-items: center;
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 10px 32px rgba(65,43,28,.10);
	padding: 16px;
}

.unyk-conversion-designer .unyk-canvas-wrap {
	padding: 18px !important;
	background: #f7f4ef !important;
	display: grid !important;
	place-items: center !important;
	min-height: 0 !important;
	overflow: hidden !important;
}

.unyk-conversion-designer .unyk-canvas {
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
	background: #fff !important;
	touch-action: none !important;
}

.unyk-preview-label {
	position: absolute;
	left: 16px;
	top: 16px;
	background: #f4eee8;
	color: #7a302e;
	border-radius: 999px;
	padding: 7px 11px;
	font-size: 12px;
	font-weight: 900;
	z-index: 2;
}

.unyk-preview-hint {
	position: absolute;
	left: 50%;
	bottom: 14px;
	transform: translateX(-50%);
	background: rgba(43,26,18,.78);
	color: #fff;
	border-radius: 999px;
	padding: 8px 12px;
	font-size: 12px;
	font-weight: 800;
	white-space: nowrap;
	z-index: 2;
}

.unyk-conversion-designer .unyk-controls {
	background: #fff !important;
	border-top: 1px solid #eee !important;
	padding: 0 !important;
}

.unyk-conv-panel {
	padding: 16px 18px 18px;
}

.unyk-conv-panel-head {
	margin-bottom: 12px;
}

.unyk-conv-panel-head strong {
	display: block;
	font-size: 21px;
	color: #2b1a12;
	line-height: 1.15;
}

.unyk-conv-panel-head span {
	display: block;
	font-size: 14px;
	color: #7b6d60;
	margin-top: 4px;
}

.unyk-field {
	display: grid;
	gap: 7px;
	margin-bottom: 12px;
	font-weight: 900;
	color: #3d2c24;
}

.unyk-field span {
	font-size: 14px;
}

.unyk-field textarea,
.unyk-field select {
	width: 100%;
	border: 1px solid #ded7cf !important;
	border-radius: 14px !important;
	padding: 14px !important;
	font-size: 17px !important;
	background: #fff !important;
	color: #2b1a12 !important;
}

.unyk-style-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.unyk-style-row input[type="range"] {
	width: 100%;
	accent-color: #2f746b;
}

.unyk-main-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-top: 6px;
}

.unyk-main-actions .button {
	border: 0 !important;
	border-radius: 14px !important;
	background: #2f746b !important;
	color: #fff !important;
	min-height: 54px !important;
	font-weight: 950 !important;
	font-size: 15px !important;
}

.unyk-secondary-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-top: 10px;
}

.unyk-secondary-actions button {
	border: 1px solid #e5dad1;
	border-radius: 12px;
	background: #fff;
	color: #7a302e;
	min-height: 42px;
	font-weight: 900;
}

.unyk-trust-note {
	margin-top: 12px;
	background: #f4fbf6;
	border: 1px solid #d7eadd;
	color: #2f746b;
	border-radius: 12px;
	padding: 11px 12px;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.45;
}

.unyk-sticky-confirm {
	background: #fff;
	border-top: 1px solid #eee;
	padding: 10px 16px;
	display: grid;
}

.unyk-confirm-bottom {
	width: 100%;
	border: 0 !important;
	border-radius: 15px !important;
	background: #7a302e !important;
	color: #fff !important;
	min-height: 52px !important;
	font-size: 17px !important;
	font-weight: 950 !important;
}

@media (min-width: 900px) {
	.unyk-conversion-designer {
		grid-template-columns: minmax(0, 1fr) 390px !important;
		grid-template-rows: 74px 58px minmax(0, 1fr) 72px !important;
	}

	.unyk-conversion-designer .unyk-modal-topbar,
	.unyk-conv-progress {
		grid-column: 1 / -1;
	}

	.unyk-conversion-designer .unyk-canvas-wrap {
		grid-column: 1;
		grid-row: 3 / 5;
		padding: 24px !important;
	}

	.unyk-conversion-designer .unyk-controls {
		grid-column: 2;
		grid-row: 3;
		border-left: 1px solid #eee !important;
		border-top: 0 !important;
		overflow: auto;
	}

	.unyk-sticky-confirm {
		grid-column: 2;
		grid-row: 4;
		border-left: 1px solid #eee;
	}
}

@media (max-width: 640px) {
	.unyk-modal {
		align-items: stretch !important;
	}

	.unyk-conversion-designer {
		width: 100% !important;
		height: 100dvh !important;
		max-height: 100dvh !important;
		border-radius: 0 !important;
		grid-template-rows: 76px 52px minmax(0, 1fr) auto 72px !important;
	}

	.unyk-conversion-designer .unyk-modal-topbar {
		grid-template-columns: 54px 1fr 78px !important;
		padding: 10px 12px !important;
	}

	.unyk-conv-title strong {
		font-size: 18px;
	}

	.unyk-conv-title span {
		white-space: normal;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.unyk-conv-step span {
		display: none;
	}

	.unyk-conversion-designer .unyk-canvas-wrap {
		padding: 8px !important;
	}

	.unyk-preview-card {
		border-radius: 12px;
		padding: 8px;
	}

	.unyk-preview-label,
	.unyk-preview-hint {
		display: none;
	}

	.unyk-conv-panel {
		padding: 14px;
		max-height: 38dvh;
		overflow: auto;
	}

	.unyk-conv-panel-head strong {
		font-size: 18px;
	}

	.unyk-style-row {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.unyk-main-actions {
		grid-template-columns: 1fr 1fr;
	}

	.unyk-main-actions .button {
		min-height: 50px !important;
		font-size: 14px !important;
	}

	.unyk-secondary-actions {
		grid-template-columns: 1fr 1fr;
	}

	.unyk-trust-note {
		display: none;
	}
}


/* V1.15: echte live preview */

.unyk-add-text {
	background: #f4fbf6 !important;
	color: #2f746b !important;
	border: 1px solid #d6eadf !important;
	cursor: default !important;
}

.unyk-add-text::after {
	content: " ✓";
}

.unyk-preview-label {
	background: #e9f7ef !important;
	color: #2f746b !important;
}

.unyk-conv-panel-head strong::after {
	content: " live";
	display: inline-block;
	margin-left: 7px;
	background: #e9f7ef;
	color: #2f746b;
	border-radius: 999px;
	font-size: 12px;
	padding: 4px 8px;
	vertical-align: middle;
}


/* V1.16 mobiele designerflow */
.unyk-mobile-designer{width:100%!important;height:100vh!important;max-height:100vh!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;background:#efefef!important;overflow:hidden!important;display:grid!important;grid-template-rows:60px minmax(0,1fr) auto auto auto!important}
.unyk-topbar{background:#7d3633;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:8px 10px}
.unyk-topbar-left,.unyk-topbar-right{display:flex;align-items:center;gap:8px}
.unyk-top-icon,.unyk-top-confirm{border:0;background:transparent;color:#fff;display:grid;place-items:center;height:40px;min-width:40px;border-radius:10px;font-size:24px;line-height:1}
.unyk-top-confirm{background:rgba(255,255,255,.15);min-width:48px;font-size:28px;font-weight:700}
.unyk-main-stage{min-height:0;overflow:auto;background:#dcdcdc}
.unyk-mobile-designer .unyk-canvas-wrap{display:grid!important;place-items:center!important;padding:0!important;background:#dcdcdc!important;min-height:100%}
.unyk-mobile-designer .unyk-canvas{width:100%!important;height:auto!important;max-width:none!important;background:#f2f2f2!important}
.unyk-bottom-nav{background:#fff;border-top:1px solid #ddd;display:grid;grid-template-columns:repeat(4,1fr)}
.unyk-nav-btn{border:0;background:#fff;color:#7c4a46;display:grid;place-items:center;gap:2px;padding:8px 4px 10px;font-size:13px;font-weight:500}
.unyk-nav-btn span{font-size:28px;line-height:1}.unyk-nav-btn.is-active{background:#f7efe2;color:#e2ae28}
.unyk-subpanel,.unyk-context-panel{background:#f7f7f7;border-top:1px solid #ddd;padding:10px 12px 14px;max-height:38dvh;overflow:auto}.unyk-subpanel.is-hidden,.unyk-context-panel.is-hidden{display:none!important}
.unyk-subpanel-handle{width:52px;height:4px;background:#d4d4d4;border-radius:999px;margin:0 auto 12px}
.unyk-subpanel-field textarea{width:100%;border:1px solid #ddd!important;border-radius:8px!important;padding:14px!important;font-size:18px!important;background:#fff!important;color:#556070!important;resize:none}
.unyk-gold-btn{background:#e8b129!important;color:#fff!important;border:0!important;border-radius:6px!important;padding:10px 16px!important;font-size:16px!important;font-weight:700!important;text-transform:uppercase}
.unyk-subpanel-note{margin:0;color:#666;font-size:14px}
.unyk-design-category-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.unyk-category-btn{border:0;background:#f1f1f1;min-height:98px;padding:10px 8px;display:grid;place-items:center;align-content:center;color:#853f3b}.unyk-category-btn span{font-size:34px;line-height:1;color:#111}.unyk-category-btn strong{font-size:12px;font-weight:500;text-align:center;letter-spacing:.2px}
.unyk-library-head{display:grid;grid-template-columns:40px 1fr;gap:8px;align-items:center;margin-bottom:12px}.unyk-back-library{border:0;background:#fff;border-radius:6px;height:40px;font-size:26px;color:#7e3633}.unyk-library-title{background:#fff;border-radius:8px;padding:10px 12px;font-size:15px;color:#5f6d84;text-transform:uppercase}
.unyk-design-library-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}.unyk-library-item{border:0;background:transparent;min-height:82px;display:grid;place-items:center}.unyk-library-preview{display:grid;place-items:center;width:100%;height:100%}.unyk-library-preview span{font-size:56px;line-height:1;color:#111}
.unyk-context-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}.unyk-context-row-main{grid-template-columns:1.2fr 70px 1fr}.unyk-context-action,.unyk-context-size,.unyk-context-font{border:1px solid #d5cfc9;background:#fff;border-radius:2px;min-height:44px;padding:8px;color:#7d433f;font-size:14px}.unyk-context-action{font-weight:500}.unyk-context-size{text-align:center}
.unyk-layer-list{display:grid;gap:8px}.unyk-layer-row{border:1px solid #ddd;background:#fff;padding:10px;border-radius:8px;text-align:left;display:grid}.unyk-layer-row small{color:#777}.unyk-layer-empty{color:#666;padding:8px 4px}
@media(min-width:900px){.unyk-mobile-designer{max-width:420px!important;margin-left:auto}}


/* V1.17 — layout fix: canvas volledig zichtbaar, bottom sheets als overlay */

.unyk-modal {
	padding: 0 !important;
	align-items: center !important;
	justify-content: center !important;
	background: rgba(0,0,0,.58) !important;
}

.unyk-mobile-designer {
	position: relative !important;
	width: min(430px, 100vw) !important;
	height: min(860px, 100dvh) !important;
	max-height: 100dvh !important;
	margin: auto !important;
	border-radius: 0 !important;
	background: #e9e9e9 !important;
	overflow: hidden !important;
	display: grid !important;
	grid-template-rows: 58px minmax(0, 1fr) 72px !important;
	grid-template-columns: 1fr !important;
	box-sizing: border-box !important;
}

.unyk-topbar {
	grid-row: 1 !important;
	height: 58px !important;
	min-height: 58px !important;
	background: #7e3633 !important;
	color: #fff !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 7px 9px !important;
	box-sizing: border-box !important;
	z-index: 20 !important;
}

.unyk-topbar-left,
.unyk-topbar-right {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
}

.unyk-top-icon,
.unyk-top-confirm {
	border: 0 !important;
	background: transparent !important;
	color: #fff !important;
	width: 38px !important;
	min-width: 38px !important;
	height: 38px !important;
	border-radius: 9px !important;
	padding: 0 !important;
	display: grid !important;
	place-items: center !important;
	font-size: 22px !important;
	line-height: 1 !important;
	box-shadow: none !important;
}

.unyk-top-confirm {
	background: rgba(255,255,255,.16) !important;
	width: 48px !important;
	min-width: 48px !important;
	font-size: 27px !important;
	font-weight: 900 !important;
}

.unyk-main-stage {
	grid-row: 2 !important;
	position: relative !important;
	min-height: 0 !important;
	height: 100% !important;
	overflow: hidden !important;
	background: #dcdcdc !important;
	display: grid !important;
	place-items: center !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-canvas-wrap {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	display: grid !important;
	place-items: center !important;
	padding: 10px !important;
	background: #dcdcdc !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-canvas {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	background: #f3f3f3 !important;
	touch-action: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	object-fit: contain !important;
}

.unyk-bottom-nav {
	grid-row: 3 !important;
	height: 72px !important;
	min-height: 72px !important;
	background: #fff !important;
	border-top: 1px solid #ddd !important;
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	z-index: 30 !important;
	box-sizing: border-box !important;
}

.unyk-nav-btn {
	border: 0 !important;
	background: #fff !important;
	color: #7c4a46 !important;
	display: grid !important;
	place-items: center !important;
	align-content: center !important;
	gap: 2px !important;
	padding: 6px 2px 8px !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	line-height: 1.1 !important;
	box-shadow: none !important;
}

.unyk-nav-btn span {
	font-size: 25px !important;
	line-height: 1 !important;
}

.unyk-nav-btn strong {
	font-size: 12px !important;
	font-weight: 500 !important;
}

.unyk-nav-btn.is-active {
	background: #f7efe2 !important;
	color: #e2ae28 !important;
}

/* Panels zijn nu overlay-bottom-sheets, niet meer onderdeel van gridhoogte */
.unyk-subpanel,
.unyk-context-panel {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 72px !important;
	z-index: 40 !important;
	background: #f7f7f7 !important;
	border-top: 1px solid #ddd !important;
	box-shadow: 0 -12px 35px rgba(0,0,0,.12) !important;
	padding: 10px 12px 14px !important;
	max-height: min(48dvh, 390px) !important;
	overflow: auto !important;
	box-sizing: border-box !important;
}

.unyk-subpanel.is-hidden,
.unyk-context-panel.is-hidden {
	display: none !important;
}

.unyk-subpanel-handle {
	width: 52px !important;
	height: 4px !important;
	background: #d4d4d4 !important;
	border-radius: 999px !important;
	margin: 0 auto 12px !important;
}

.unyk-subpanel-field textarea {
	width: 100% !important;
	border: 1px solid #ddd !important;
	border-radius: 8px !important;
	padding: 14px !important;
	font-size: 18px !important;
	background: #fff !important;
	color: #556070 !important;
	resize: none !important;
	box-sizing: border-box !important;
}

.unyk-subpanel-actions {
	margin-top: 14px !important;
}

.unyk-gold-btn {
	background: #e8b129 !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 6px !important;
	padding: 10px 16px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	box-shadow: none !important;
}

.unyk-design-category-grid {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 5px !important;
}

.unyk-category-btn {
	border: 0 !important;
	background: #f1f1f1 !important;
	min-height: 92px !important;
	padding: 10px 8px !important;
	display: grid !important;
	place-items: center !important;
	align-content: center !important;
	color: #853f3b !important;
	box-shadow: none !important;
}

.unyk-category-btn span {
	font-size: 31px !important;
	line-height: 1 !important;
	color: #111 !important;
}

.unyk-category-btn strong {
	font-size: 12px !important;
	font-weight: 500 !important;
	text-align: center !important;
	letter-spacing: .2px !important;
}

.unyk-library-head {
	display: grid !important;
	grid-template-columns: 40px 1fr !important;
	gap: 8px !important;
	align-items: center !important;
	margin-bottom: 12px !important;
}

.unyk-back-library {
	border: 0 !important;
	background: #fff !important;
	border-radius: 6px !important;
	height: 40px !important;
	font-size: 26px !important;
	color: #7e3633 !important;
	box-shadow: none !important;
}

.unyk-library-title {
	background: #fff !important;
	border-radius: 8px !important;
	padding: 10px 12px !important;
	font-size: 15px !important;
	color: #5f6d84 !important;
	text-transform: uppercase !important;
}

.unyk-design-library-grid {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 14px 16px !important;
}

.unyk-library-item {
	border: 0 !important;
	background: transparent !important;
	min-height: 82px !important;
	display: grid !important;
	place-items: center !important;
	box-shadow: none !important;
}

.unyk-library-preview {
	display: grid !important;
	place-items: center !important;
	width: 100% !important;
	height: 100% !important;
}

.unyk-library-preview span {
	font-size: 52px !important;
	line-height: 1 !important;
	color: #111 !important;
}

/* Aanpasbalk netjes boven het menu */
.unyk-context-panel {
	max-height: 150px !important;
	background: #fff !important;
}

.unyk-context-row {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 8px !important;
	margin-bottom: 8px !important;
}

.unyk-context-row-main {
	grid-template-columns: 1.2fr 70px 1fr !important;
}

.unyk-context-action,
.unyk-context-size,
.unyk-context-font {
	border: 1px solid #d5cfc9 !important;
	background: #fff !important;
	border-radius: 3px !important;
	min-height: 42px !important;
	padding: 7px !important;
	color: #7d433f !important;
	font-size: 13px !important;
	box-shadow: none !important;
}

.unyk-context-size {
	text-align: center !important;
}

.unyk-layer-list {
	display: grid !important;
	gap: 8px !important;
}

.unyk-layer-row {
	border: 1px solid #ddd !important;
	background: #fff !important;
	padding: 10px !important;
	border-radius: 8px !important;
	text-align: left !important;
	display: grid !important;
	box-shadow: none !important;
}

.unyk-layer-row small {
	color: #777 !important;
}

.unyk-layer-empty {
	color: #666 !important;
	padding: 8px 4px !important;
}

@media (max-width: 640px) {
	.unyk-mobile-designer {
		width: 100vw !important;
		height: 100dvh !important;
		max-height: 100dvh !important;
		border-radius: 0 !important;
	}

	.unyk-mobile-designer .unyk-canvas-wrap {
		padding: 6px !important;
	}

	.unyk-subpanel,
	.unyk-context-panel {
		max-height: min(50dvh, 390px) !important;
	}
}

@media (min-width: 900px) {
	.unyk-mobile-designer {
		width: min(430px, 100vw) !important;
		height: min(860px, 96dvh) !important;
		max-width: 430px !important;
		margin: auto !important;
		border-radius: 18px !important;
	}

	.unyk-modal {
		padding: 20px !important;
	}
}


/* V1.18 — functionaliteit netjes maken op v1.17 */

.unyk-subpanel-title {
	font-size: 18px !important;
	font-weight: 800 !important;
	color: #3b2a24 !important;
	margin: 0 0 10px !important;
}

.unyk-text-options {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 10px !important;
	margin-top: 10px !important;
}

.unyk-text-options label {
	display: grid !important;
	gap: 5px !important;
	color: #7c4a46 !important;
	font-size: 12px !important;
	font-weight: 700 !important;
}

.unyk-text-options select,
.unyk-text-options input[type="range"] {
	width: 100% !important;
	box-sizing: border-box !important;
}

.unyk-text-options select {
	min-height: 42px !important;
	border: 1px solid #d5cfc9 !important;
	border-radius: 6px !important;
	background: #fff !important;
	color: #333 !important;
	padding: 8px !important;
}

.unyk-text-options input[type="range"] {
	accent-color: #e8b129 !important;
}

.unyk-upload-box {
	display: grid !important;
	place-items: center !important;
	text-align: center !important;
	gap: 5px !important;
	margin-top: 14px !important;
	padding: 22px 14px !important;
	border: 2px dashed #d8c7bd !important;
	border-radius: 12px !important;
	background: #fff !important;
	color: #7c4a46 !important;
	cursor: pointer !important;
}

.unyk-upload-box input {
	display: none !important;
}

.unyk-upload-box span {
	font-size: 16px !important;
	font-weight: 800 !important;
}

.unyk-upload-box small {
	color: #8c7b72 !important;
	font-size: 12px !important;
}

.unyk-library-item {
	border-radius: 10px !important;
	background: #fff !important;
}

.unyk-library-item:active {
	transform: scale(.98) !important;
}

.unyk-layer-row {
	grid-template-columns: 1fr auto !important;
	align-items: center !important;
}

.unyk-layer-row span {
	font-weight: 700 !important;
	color: #3b2a24 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.unyk-layer-row small {
	background: #f7efe2 !important;
	color: #7c4a46 !important;
	border-radius: 999px !important;
	padding: 4px 8px !important;
	font-size: 11px !important;
}

.unyk-context-action:hover,
.unyk-nav-btn:hover,
.unyk-category-btn:hover,
.unyk-library-item:hover,
.unyk-layer-row:hover {
	filter: brightness(.98) !important;
}

@media (max-width: 640px) {
	.unyk-text-options {
		grid-template-columns: 1fr !important;
	}
}


/* V1.19 — bewerkpaneel rechts + verwijderknop op canvas */

@media (min-width: 760px) {
	.unyk-mobile-designer {
		width: min(920px, 96vw) !important;
		height: min(820px, 96dvh) !important;
		max-width: 920px !important;
		margin: auto !important;
		border-radius: 18px !important;
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 280px !important;
		grid-template-rows: 58px minmax(0, 1fr) 72px !important;
		background: #e9e9e9 !important;
	}

	.unyk-topbar {
		grid-column: 1 / -1 !important;
		grid-row: 1 !important;
	}

	.unyk-main-stage {
		grid-column: 1 !important;
		grid-row: 2 / 4 !important;
		min-height: 0 !important;
		height: 100% !important;
	}

	.unyk-mobile-designer .unyk-canvas-wrap {
		padding: 14px !important;
	}

	.unyk-bottom-nav {
		grid-column: 2 !important;
		grid-row: 3 !important;
		height: 72px !important;
		min-height: 72px !important;
		border-left: 1px solid #ddd !important;
	}

	/* Geselecteerd object aanpassen rechts */
	.unyk-context-panel {
		position: static !important;
		grid-column: 2 !important;
		grid-row: 2 !important;
		align-self: stretch !important;
		height: 100% !important;
		max-height: none !important;
		overflow: auto !important;
		border-left: 1px solid #ddd !important;
		border-top: 0 !important;
		box-shadow: none !important;
		background: #fff !important;
		padding: 14px !important;
		display: block !important;
		box-sizing: border-box !important;
	}

	.unyk-context-panel.is-hidden {
		display: none !important;
	}

	.unyk-context-row,
	.unyk-context-row-main {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 10px !important;
		margin-bottom: 10px !important;
	}

	.unyk-context-action,
	.unyk-context-size,
	.unyk-context-font {
		width: 100% !important;
		min-height: 46px !important;
		border-radius: 8px !important;
		font-size: 14px !important;
		text-align: center !important;
	}

	/* Tekst, designs, upload en lagen ook rechts als paneel */
	.unyk-subpanel {
		position: static !important;
		grid-column: 2 !important;
		grid-row: 2 !important;
		align-self: stretch !important;
		height: 100% !important;
		max-height: none !important;
		overflow: auto !important;
		border-left: 1px solid #ddd !important;
		border-top: 0 !important;
		box-shadow: none !important;
		background: #f7f7f7 !important;
		padding: 14px !important;
		box-sizing: border-box !important;
	}

	.unyk-subpanel.is-hidden {
		display: none !important;
	}

	.unyk-subpanel-handle {
		display: none !important;
	}

	.unyk-design-category-grid,
	.unyk-design-library-grid {
		grid-template-columns: 1fr 1fr !important;
	}

	.unyk-category-btn {
		min-height: 88px !important;
	}

	.unyk-library-item {
		min-height: 76px !important;
	}
}

/* Op mobiel blijft de bestaande bottom-sheet flow actief */
@media (max-width: 759px) {
	.unyk-context-panel {
		bottom: 72px !important;
	}
}


/* V1.20 — alles blijft onderin, ook op desktop. Canvas-verwijderknop blijft behouden. */

@media (min-width: 760px) {
	.unyk-mobile-designer {
		width: min(430px, 100vw) !important;
		height: min(860px, 96dvh) !important;
		max-width: 430px !important;
		margin: auto !important;
		border-radius: 18px !important;
		background: #e9e9e9 !important;
		overflow: hidden !important;
		display: grid !important;
		grid-template-columns: 1fr !important;
		grid-template-rows: 58px minmax(0, 1fr) 72px !important;
	}

	.unyk-topbar {
		grid-column: 1 !important;
		grid-row: 1 !important;
	}

	.unyk-main-stage {
		grid-column: 1 !important;
		grid-row: 2 !important;
		min-height: 0 !important;
		height: 100% !important;
	}

	.unyk-mobile-designer .unyk-canvas-wrap {
		padding: 10px !important;
	}

	.unyk-bottom-nav {
		grid-column: 1 !important;
		grid-row: 3 !important;
		height: 72px !important;
		min-height: 72px !important;
		border-left: 0 !important;
		border-top: 1px solid #ddd !important;
	}

	.unyk-subpanel,
	.unyk-context-panel {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 72px !important;
		z-index: 40 !important;
		height: auto !important;
		max-height: min(48dvh, 390px) !important;
		overflow: auto !important;
		border-left: 0 !important;
		border-top: 1px solid #ddd !important;
		box-shadow: 0 -12px 35px rgba(0,0,0,.12) !important;
		background: #f7f7f7 !important;
		padding: 10px 12px 14px !important;
		box-sizing: border-box !important;
		align-self: auto !important;
		grid-column: auto !important;
		grid-row: auto !important;
	}

	.unyk-context-panel {
		background: #fff !important;
		max-height: 150px !important;
	}

	.unyk-subpanel.is-hidden,
	.unyk-context-panel.is-hidden {
		display: none !important;
	}

	.unyk-subpanel-handle {
		display: block !important;
	}

	.unyk-context-row {
		display: grid !important;
		grid-template-columns: repeat(4, 1fr) !important;
		gap: 8px !important;
		margin-bottom: 8px !important;
	}

	.unyk-context-row-main {
		grid-template-columns: 1.2fr 70px 1fr !important;
	}

	.unyk-context-action,
	.unyk-context-size,
	.unyk-context-font {
		width: auto !important;
		min-height: 42px !important;
		border-radius: 3px !important;
		font-size: 13px !important;
		text-align: center !important;
	}

	.unyk-design-category-grid,
	.unyk-design-library-grid {
		grid-template-columns: 1fr 1fr !important;
	}
}


/* V1.21 — rustiger bewerken + uitgebreid positie-menu + templates */

.unyk-context-row-main {
	grid-template-columns: repeat(3, 1fr) !important;
}

.unyk-position-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 7px !important;
	margin-top: 8px !important;
}

.unyk-position-grid.is-hidden {
	display: none !important;
}

.unyk-position-grid button {
	border: 1px solid #d5cfc9 !important;
	background: #fff !important;
	color: #7d433f !important;
	border-radius: 6px !important;
	min-height: 40px !important;
	padding: 6px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	box-shadow: none !important;
}

.unyk-template-grid {
	display: grid !important;
	gap: 8px !important;
	margin-top: 12px !important;
}

.unyk-template-btn {
	border: 1px solid #ddd !important;
	background: #fff !important;
	border-radius: 10px !important;
	padding: 12px !important;
	text-align: left !important;
	box-shadow: none !important;
	color: #3b2a24 !important;
	display: grid !important;
	gap: 3px !important;
}

.unyk-template-btn span {
	font-weight: 800 !important;
	font-size: 15px !important;
}

.unyk-template-btn small {
	color: #8c7b72 !important;
	font-size: 12px !important;
}

.unyk-template-btn:active,
.unyk-position-grid button:active {
	transform: scale(.98) !important;
}

@media (max-width: 640px) {
	.unyk-position-grid {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}


/* V1.22 — upload terug, tekstgrootte weg, canvas bediening herstellen */

.unyk-text-options {
	grid-template-columns: 1fr !important;
}

/* De grootte-slider is volledig vervallen. */
.unyk-text-size,
.unyk-context-size {
	display: none !important;
}

/* 5 knoppen onderin */
.unyk-bottom-nav {
	grid-template-columns: repeat(5, 1fr) !important;
}

.unyk-nav-btn {
	min-width: 0 !important;
}

.unyk-nav-btn span {
	font-size: 23px !important;
}

.unyk-nav-btn strong {
	font-size: 11px !important;
}

/* Canvas blijft altijd klik/sleepbaar. */
.unyk-main-stage,
.unyk-canvas-wrap,
.unyk-canvas {
	pointer-events: auto !important;
	touch-action: none !important;
}

/* Panelen mogen alleen zichzelf raken, niet onzichtbaar over canvas heen liggen. */
.unyk-subpanel.is-hidden,
.unyk-context-panel.is-hidden,
.unyk-position-grid.is-hidden {
	display: none !important;
	pointer-events: none !important;
}

.unyk-subpanel,
.unyk-context-panel {
	pointer-events: auto !important;
}

/* Positie-menu zonder grootte/dupliceren. */
.unyk-context-row-main {
	grid-template-columns: repeat(3, 1fr) !important;
}

/* Upload duidelijker */
.unyk-upload-box {
	background: #fff !important;
	border-color: #d1b89e !important;
}

.unyk-upload-box span::after {
	content: " → zwart/grijs";
	display: block;
	font-size: 12px;
	color: #7c4a46;
	font-weight: 600;
	margin-top: 3px;
}


/* V1.23 — canvasbediening opnieuw strak gezet */

.unyk-mobile-designer {
	user-select: none !important;
	-webkit-user-select: none !important;
}

.unyk-main-stage {
	position: relative !important;
	overflow: hidden !important;
}

.unyk-mobile-designer.unyk-context-open .unyk-main-stage {
	padding-bottom: 132px !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer.unyk-panel-open .unyk-main-stage {
	padding-bottom: min(48dvh, 390px) !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-canvas-wrap {
	height: 100% !important;
	min-height: 0 !important;
	display: grid !important;
	place-items: center !important;
	pointer-events: auto !important;
}

.unyk-mobile-designer .unyk-canvas {
	display: block !important;
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
	touch-action: none !important;
	pointer-events: auto !important;
	cursor: grab !important;
	-webkit-user-drag: none !important;
}

.unyk-mobile-designer .unyk-canvas:active {
	cursor: grabbing !important;
}

.unyk-context-panel {
	max-height: 132px !important;
}

.unyk-context-panel .unyk-context-row-main {
	grid-template-columns: repeat(3, 1fr) !important;
}

.unyk-context-panel .unyk-edit-selected-text[style*="display: none"] {
	display: none !important;
}

.unyk-position-grid {
	max-height: 170px !important;
	overflow: auto !important;
}

.unyk-subpanel,
.unyk-context-panel {
	z-index: 60 !important;
}

.unyk-bottom-nav {
	z-index: 70 !important;
}

.unyk-text-size,
.unyk-context-size {
	display: none !important;
}

.unyk-upload-box span::after {
	content: " → zwart/grijs";
	display: block;
	font-size: 12px;
	color: #7c4a46;
	font-weight: 600;
	margin-top: 3px;
}


/* V1.24 — canvasklik sluit open paneel, resetknop weg */

.unyk-context-panel .unyk-context-row-main {
	grid-template-columns: repeat(2, 1fr) !important;
}

.unyk-context-panel .unyk-edit-selected-text[style*="display: none"] + .unyk-open-position {
	grid-column: 1 / -1 !important;
}


/* V1.27 — vaste middenlijnen + Positie-knop weg */

.unyk-open-position,
.unyk-position-grid {
	display: none !important;
}

.unyk-context-panel .unyk-context-row-main {
	grid-template-columns: 1fr !important;
}

/* Bij uploads/designs is er geen tekstknop; dan mag het contextbalkje praktisch leeg blijven. */
.unyk-context-panel .unyk-context-row-main:empty {
	display: none !important;
}


/* V1.28 — duidelijk klaar-vinkje + overbodige topbar-iconen weg */

.unyk-confirm-design {
	border: 3px solid #1f9d55 !important;
	background: #ffffff !important;
	color: #1f8f4d !important;
	box-shadow: 0 0 0 4px rgba(31, 157, 85, .16), 0 6px 16px rgba(31, 157, 85, .22) !important;
	font-weight: 900 !important;
}

.unyk-confirm-design:hover,
.unyk-confirm-design:focus {
	background: #eafff1 !important;
	border-color: #168746 !important;
	color: #137a3d !important;
	box-shadow: 0 0 0 5px rgba(31, 157, 85, .22), 0 8px 20px rgba(31, 157, 85, .28) !important;
}

/* Niet-gebruikte topbar knoppen verbergen wanneer oude markup nog door CSS/markup blijft bestaan. */
.unyk-search-btn,
.unyk-menu-btn,
.unyk-more-btn,
.unyk-topbar-search,
.unyk-topbar-menu,
.unyk-topbar-more {
	display: none !important;
}


/* V1.29 — groene middenlijnen alleen tijdens slepen */


/* V1.30 — tekst direct typen op het canvas */

.unyk-canvas-wrap {
	position: relative !important;
}

.unyk-inline-text-editor {
	position: absolute !important;
	z-index: 90 !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	background: rgba(255, 255, 255, .96) !important;
	border: 2px solid #1f9d70 !important;
	border-radius: 10px !important;
	padding: 8px !important;
	box-shadow: 0 10px 30px rgba(0,0,0,.18) !important;
	transform-origin: center center !important;
}

.unyk-inline-text-editor.is-hidden {
	display: none !important;
}

.unyk-inline-text-input {
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	color: #111 !important;
	text-align: center !important;
	resize: none !important;
	overflow: hidden !important;
	line-height: 1.15 !important;
	min-width: 120px !important;
	min-height: 44px !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.unyk-inline-text-done {
	border: 2px solid #1f9d55 !important;
	background: #eafff1 !important;
	color: #137a3d !important;
	border-radius: 999px !important;
	width: 38px !important;
	height: 38px !important;
	min-width: 38px !important;
	display: grid !important;
	place-items: center !important;
	font-size: 21px !important;
	font-weight: 900 !important;
	box-shadow: 0 3px 12px rgba(31, 157, 85, .28) !important;
	padding: 0 !important;
}

.unyk-context-font {
	border: 1px solid #d5cfc9 !important;
	background: #fff !important;
	color: #3b2a24 !important;
	border-radius: 8px !important;
	min-height: 42px !important;
	padding: 0 8px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	width: 100% !important;
}

.unyk-context-panel .unyk-context-row-main {
	grid-template-columns: 1fr 1fr !important;
}

@media (max-width: 420px) {
	.unyk-inline-text-editor {
		max-width: calc(100% - 24px) !important;
	}

	.unyk-inline-text-input {
		max-width: 210px !important;
	}
}


/* V1.31 — Enter is nieuwe regel + uitgebreid lettertypepakket */

.unyk-inline-text-input {
	white-space: pre-wrap !important;
}

.unyk-context-font {
	font-size: 12px !important;
}

.unyk-text-font {
	font-size: 13px !important;
}


/* V1.32 — tekstopties duidelijker zichtbaar */

.unyk-context-panel {
	border: 2px solid #1f9d70 !important;
	background: #f1fff7 !important;
	border-radius: 14px 14px 0 0 !important;
	box-shadow: 0 -10px 30px rgba(31, 157, 112, .24) !important;
	padding: 12px !important;
}

.unyk-context-panel:not(.is-hidden)::before {
	content: "Tekst geselecteerd";
	display: block;
	margin: 0 0 8px;
	padding: 6px 10px;
	border-radius: 999px;
	background: #1f9d70;
	color: #fff;
	font-size: 12px;
	font-weight: 900;
	text-align: center;
	letter-spacing: .02em;
}

.unyk-context-panel .unyk-context-row-main {
	gap: 10px !important;
	align-items: stretch !important;
}

.unyk-context-panel .unyk-edit-selected-text,
.unyk-context-panel .unyk-context-font {
	border: 2px solid #1f9d70 !important;
	background: #ffffff !important;
	color: #174f38 !important;
	border-radius: 10px !important;
	min-height: 46px !important;
	font-weight: 900 !important;
	box-shadow: 0 4px 12px rgba(31, 157, 112, .12) !important;
}

.unyk-context-panel .unyk-edit-selected-text:hover,
.unyk-context-panel .unyk-context-font:hover,
.unyk-context-panel .unyk-edit-selected-text:focus,
.unyk-context-panel .unyk-context-font:focus {
	background: #eafff1 !important;
	border-color: #168746 !important;
	outline: none !important;
}

.unyk-context-panel .unyk-context-font {
	padding: 0 10px !important;
}


/* V1.33 — Vet-knop voor tekst */

.unyk-context-panel .unyk-context-row-main {
	grid-template-columns: 1fr .65fr 1fr !important;
}

.unyk-bold-selected {
	border: 2px solid #1f9d70 !important;
	background: #ffffff !important;
	color: #174f38 !important;
	border-radius: 10px !important;
	min-height: 46px !important;
	font-weight: 900 !important;
	box-shadow: 0 4px 12px rgba(31, 157, 112, .12) !important;
}

.unyk-bold-selected.is-active,
.unyk-bold-selected[aria-pressed="true"] {
	background: #1f9d70 !important;
	color: #ffffff !important;
	border-color: #168746 !important;
	box-shadow: 0 0 0 4px rgba(31, 157, 112, .18), 0 6px 18px rgba(31, 157, 112, .28) !important;
}

@media (max-width: 420px) {
	.unyk-context-panel .unyk-context-row-main {
		grid-template-columns: 1fr .55fr 1fr !important;
	}
}


/* V1.34 — shopknop + kort ontwerpnummer */

.unyk-loop-design-button {
	background: #1f9d70 !important;
	border-color: #1f9d70 !important;
	color: #fff !important;
	font-weight: 800 !important;
}

.unyk-loop-design-button:hover,
.unyk-loop-design-button:focus {
	background: #168746 !important;
	border-color: #168746 !important;
	color: #fff !important;
}

.unyk-linked-design-id {
	font-variant-numeric: tabular-nums !important;
	letter-spacing: .04em !important;
}


/* V1.35 — tekst geselecteerd balk weg, leeg tekstvak sluit automatisch */

.unyk-context-panel:not(.is-hidden)::before {
	content: none !important;
	display: none !important;
}

.unyk-context-panel {
	padding-top: 12px !important;
}


/* V1.36 — upload bijsnijden voor graveren */

.unyk-crop-modal {
	position: absolute !important;
	inset: 0 !important;
	z-index: 120 !important;
	background: rgba(18, 18, 18, .72) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 18px !important;
}

.unyk-crop-modal.is-hidden {
	display: none !important;
}

.unyk-crop-card {
	width: min(720px, calc(100% - 8px)) !important;
	background: #fff !important;
	border-radius: 18px !important;
	box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
	overflow: hidden !important;
}

.unyk-crop-head {
	padding: 16px 18px 12px !important;
	border-bottom: 1px solid #ece3da !important;
	background: #f9f6f1 !important;
}

.unyk-crop-head > div {
	font-size: 18px !important;
	font-weight: 900 !important;
	color: #2f221c !important;
}

.unyk-crop-head small {
	display: block !important;
	margin-top: 6px !important;
	color: #6d5b52 !important;
	font-size: 12px !important;
	line-height: 1.45 !important;
}

.unyk-crop-stage {
	padding: 14px !important;
	background: #181818 !important;
}

.unyk-crop-canvas {
	width: 100% !important;
	height: auto !important;
	display: block !important;
	border-radius: 14px !important;
	background: #1d1d1d !important;
	touch-action: none !important;
}

.unyk-crop-actions {
	display: flex !important;
	justify-content: flex-end !important;
	gap: 10px !important;
	padding: 14px 16px 16px !important;
	background: #fff !important;
}

.unyk-crop-cancel,
.unyk-crop-apply {
	min-height: 44px !important;
	padding: 0 16px !important;
	border-radius: 10px !important;
	font-weight: 800 !important;
	border: 2px solid transparent !important;
}

.unyk-crop-cancel {
	background: #f3eee8 !important;
	color: #54423a !important;
	border-color: #e4d8cd !important;
}

.unyk-crop-apply {
	background: #1f9d70 !important;
	color: #fff !important;
	border-color: #1f9d70 !important;
}

.unyk-crop-apply:hover,
.unyk-crop-apply:focus {
	background: #168746 !important;
	border-color: #168746 !important;
}


/* V1.37 — lagen slepen en volgorde wijzigen */

.unyk-layer-row {
	cursor: grab !important;
	position: relative !important;
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease !important;
}

.unyk-layer-row:active {
	cursor: grabbing !important;
}

.unyk-layer-row.is-active {
	border-color: #1f9d70 !important;
	background: #eefbf4 !important;
	box-shadow: 0 0 0 2px rgba(31, 157, 112, .12) inset !important;
}

.unyk-layer-row.is-dragging {
	opacity: .55 !important;
	transform: scale(.98) !important;
}

.unyk-layer-row.drop-before::before,
.unyk-layer-row.drop-after::after {
	content: '';
	position: absolute;
	left: 10px;
	right: 10px;
	height: 4px;
	background: #1f9d70;
	border-radius: 999px;
	box-shadow: 0 0 0 2px rgba(31, 157, 112, .12);
}

.unyk-layer-row.drop-before::before {
	top: -4px;
}

.unyk-layer-row.drop-after::after {
	bottom: -4px;
}


/* V1.38 — duidelijke sleepgreep rechts bij lagen */

.unyk-layer-row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 48px !important;
	gap: 8px !important;
	align-items: stretch !important;
	border: 1px solid #e4d8cd !important;
	border-radius: 12px !important;
	background: #fff !important;
	padding: 6px !important;
	margin-bottom: 8px !important;
	position: relative !important;
}

.unyk-layer-select {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto !important;
	gap: 8px !important;
	align-items: center !important;
	text-align: left !important;
	border: 0 !important;
	background: transparent !important;
	padding: 8px !important;
	min-height: 42px !important;
	color: #3b2a24 !important;
	width: 100% !important;
}

.unyk-layer-select span {
	font-weight: 800 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.unyk-layer-select small {
	background: #f7efe2 !important;
	color: #7c4a46 !important;
	border-radius: 999px !important;
	padding: 4px 8px !important;
	font-size: 11px !important;
	font-weight: 800 !important;
}

.unyk-layer-drag-handle {
	border: 2px solid #1f9d70 !important;
	background: #f1fff7 !important;
	color: #137a3d !important;
	border-radius: 10px !important;
	font-size: 22px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	display: grid !important;
	place-items: center !important;
	cursor: grab !important;
	touch-action: none !important;
	user-select: none !important;
}

.unyk-layer-drag-handle:active {
	cursor: grabbing !important;
	background: #1f9d70 !important;
	color: #fff !important;
}

.unyk-layer-row.is-active {
	border-color: #1f9d70 !important;
	background: #eefbf4 !important;
	box-shadow: 0 0 0 2px rgba(31, 157, 112, .12) inset !important;
}

.unyk-layer-row.is-dragging {
	opacity: .55 !important;
	transform: scale(.985) !important;
}

.unyk-layer-row.drop-before::before,
.unyk-layer-row.drop-after::after {
	content: '' !important;
	position: absolute !important;
	left: 8px !important;
	right: 8px !important;
	height: 4px !important;
	background: #1f9d70 !important;
	border-radius: 999px !important;
	box-shadow: 0 0 0 2px rgba(31, 157, 112, .12) !important;
}

.unyk-layer-row.drop-before::before {
	top: -6px !important;
}

.unyk-layer-row.drop-after::after {
	bottom: -6px !important;
}


/* V1.39 — sleepgreep netjes binnen de witte laag-ballon */

.unyk-layer-row {
	grid-template-columns: minmax(0, 1fr) auto !important;
	gap: 8px !important;
	align-items: center !important;
	background: #ffffff !important;
	border: 1px solid #e5ddd4 !important;
	border-radius: 14px !important;
	padding: 8px 10px !important;
	margin-bottom: 8px !important;
	box-shadow: 0 2px 8px rgba(0,0,0,.04) !important;
	overflow: visible !important;
}

.unyk-layer-select {
	min-height: 44px !important;
	padding: 4px 2px !important;
	background: transparent !important;
	border: 0 !important;
}

.unyk-layer-drag-handle {
	width: 38px !important;
	height: 38px !important;
	min-width: 38px !important;
	min-height: 38px !important;
	padding: 0 !important;
	margin: 0 !important;
	justify-self: end !important;
	align-self: center !important;
	border: 2px solid #1f9d70 !important;
	background: #ffffff !important;
	color: #1f9d70 !important;
	border-radius: 10px !important;
	box-shadow: none !important;
	font-size: 20px !important;
	line-height: 1 !important;
}

.unyk-layer-drag-handle:hover,
.unyk-layer-drag-handle:focus {
	background: #f1fff7 !important;
	outline: none !important;
}

.unyk-layer-drag-handle:active {
	background: #e6fff0 !important;
	color: #168746 !important;
}

.unyk-layer-row.is-active {
	background: #f7fffa !important;
	border-color: #1f9d70 !important;
	box-shadow: 0 0 0 2px rgba(31, 157, 112, .12) inset !important;
}


/* V1.40 — in- en uitzoomen op het canvas */

.unyk-zoom-tools {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	margin-left: 4px !important;
}

.unyk-zoom-reset-btn {
	border: 2px solid rgba(255,255,255,.45) !important;
	background: rgba(255,255,255,.12) !important;
	color: #fff !important;
	min-width: 58px !important;
	height: 38px !important;
	padding: 0 10px !important;
	border-radius: 10px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
}

.unyk-zoom-reset-btn:hover,
.unyk-zoom-reset-btn:focus {
	background: rgba(255,255,255,.2) !important;
	outline: none !important;
}

.unyk-main-stage {
	overflow: auto !important;
}

.unyk-canvas-wrap {
	position: relative !important;
	overflow: visible !important;
	transform: scale(var(--unyk-canvas-zoom, 1)) !important;
	transform-origin: center center !important;
	transition: transform .16s ease !important;
}

.unyk-canvas-wrap.is-zoomed-in {
	width: calc(100% * var(--unyk-canvas-zoom, 1)) !important;
	min-width: calc(100% * var(--unyk-canvas-zoom, 1)) !important;
}

.unyk-canvas-wrap.is-zoomed-out {
	width: 100% !important;
	min-width: 100% !important;
}

.unyk-canvas {
	max-height: 68vh !important;
}

@media (max-width: 430px) {
	.unyk-zoom-tools {
		gap: 4px !important;
		margin-left: 2px !important;
	}

	.unyk-zoom-reset-btn {
		min-width: 52px !important;
		height: 34px !important;
		font-size: 12px !important;
		padding: 0 8px !important;
	}
}


/* V1.41 — mobiel: pinch-zoom en vegen buiten canvas */

.unyk-main-stage {
	overscroll-behavior: contain !important;
	-webkit-overflow-scrolling: touch !important;
}

@media (max-width: 640px) {
	.unyk-zoom-tools {
		display: none !important;
	}

	.unyk-main-stage {
		touch-action: pan-x pan-y !important;
	}

	.unyk-canvas {
		touch-action: none !important;
	}

	.unyk-canvas-wrap {
		touch-action: pan-x pan-y !important;
	}
}


/* V1.42 — mobiel: pagina blijft passend, zoom alleen binnen canvas */

@media (max-width: 640px) {
	.unyk-modal-inner.unyk-mobile-designer {
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100dvh !important;
		max-height: 100dvh !important;
		overflow: hidden !important;
	}

	.unyk-main-stage {
		overflow: hidden !important;
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		max-height: 100% !important;
		touch-action: none !important;
	}

	.unyk-mobile-designer .unyk-canvas-wrap,
	.unyk-canvas-wrap,
	.unyk-canvas-wrap.is-zoomed-in,
	.unyk-canvas-wrap.is-zoomed-out {
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		max-height: 100% !important;
		overflow: hidden !important;
		transform: none !important;
		display: grid !important;
		place-items: center !important;
	}

	.unyk-mobile-designer .unyk-canvas,
	.unyk-canvas {
		width: min(100%, 430px) !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: calc(100dvh - 150px) !important;
		transform: scale(var(--unyk-canvas-zoom, 1)) !important;
		transform-origin: center center !important;
		transition: transform .12s ease !important;
		touch-action: none !important;
	}

	.unyk-zoom-tools {
		display: none !important;
	}
}


/* V1.43 — staand / liggend toggle in de designer */

.unyk-orientation-tools {
	display: flex !important;
	align-items: center !important;
	gap: 4px !important;
	margin-left: 6px !important;
	padding: 3px !important;
	border: 1px solid rgba(255,255,255,.28) !important;
	background: rgba(255,255,255,.10) !important;
	border-radius: 12px !important;
}

.unyk-orientation-btn {
	border: 0 !important;
	background: transparent !important;
	color: rgba(255,255,255,.82) !important;
	border-radius: 9px !important;
	min-height: 32px !important;
	padding: 0 10px !important;
	font-size: 12px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	cursor: pointer !important;
}

.unyk-orientation-btn.is-active {
	background: #ffffff !important;
	color: #7e3633 !important;
}

@media (max-width: 640px) {
	.unyk-topbar-left {
		gap: 4px !important;
		min-width: 0 !important;
	}

	.unyk-orientation-tools {
		margin-left: 2px !important;
		gap: 2px !important;
		padding: 2px !important;
	}

	.unyk-orientation-btn {
		min-height: 30px !important;
		padding: 0 7px !important;
		font-size: 11px !important;
	}
}


/* V1.45 — liggend links/rechts */

.unyk-orientation-tools {
	gap: 3px !important;
	max-width: 100% !important;
}

.unyk-orientation-btn {
	padding: 0 8px !important;
	white-space: nowrap !important;
}

@media (max-width: 640px) {
	.unyk-orientation-btn {
		padding: 0 5px !important;
		font-size: 10.5px !important;
	}
}


/* V1.51 — plankfoto weer netjes passend binnen canvas */
.unyk-canvas {
	display: block !important;
}

@media (max-width: 640px) {
	.unyk-mobile-designer .unyk-canvas,
	.unyk-canvas {
		width: min(100%, calc(100dvh - 190px)) !important;
		height: auto !important;
		max-width: 100% !important;
		max-height: calc(100dvh - 170px) !important;
		object-fit: contain !important;
	}
}


/* V1.52 — plank op werkelijke verhouding in canvas */
.unyk-canvas {
	background: #efefef !important;
}


/* V1.53 — plankfoto nooit afsnijden op desktop of mobiel */
.unyk-main-stage {
	overflow: hidden !important;
}

.unyk-canvas-wrap {
	width: 100% !important;
	max-width: 100% !important;
	overflow: hidden !important;
}

.unyk-canvas {
	max-width: 100% !important;
	object-fit: contain !important;
}


/* V1.55 — graveergebied volgt de zichtbare plank, niet het losse 900x900 vlak */
.unyk-main-stage {
	overflow: hidden !important;
}

.unyk-canvas-wrap {
	width: 100% !important;
	max-width: 100% !important;
	overflow: hidden !important;
}

.unyk-canvas {
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
}

@media (min-width: 760px) {
	.unyk-mobile-designer {
		width: min(720px, calc(100vw - 48px)) !important;
		height: min(900px, calc(100dvh - 48px)) !important;
		border-radius: 18px !important;
	}
}


/* V1.56 — desktop configurator altijd volledig binnen het scherm */
.unyk-modal {
	position: fixed !important;
	inset: 0 !important;
	width: 100vw !important;
	height: 100dvh !important;
	max-width: 100vw !important;
	max-height: 100dvh !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 18px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-modal.is-hidden {
	display: none !important;
}

.unyk-modal-inner.unyk-mobile-designer,
.unyk-mobile-designer {
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	transform: none !important;
	margin: 0 auto !important;
	max-width: calc(100vw - 36px) !important;
	max-height: calc(100dvh - 36px) !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

@media (min-width: 760px) {
	.unyk-modal-inner.unyk-mobile-designer,
	.unyk-mobile-designer {
		width: min(620px, calc(100vw - 36px)) !important;
		height: min(880px, calc(100dvh - 36px)) !important;
	}

	.unyk-main-stage {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		overflow: hidden !important;
	}

	.unyk-mobile-designer .unyk-canvas-wrap,
	.unyk-canvas-wrap {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		height: 100% !important;
		max-height: 100% !important;
		overflow: hidden !important;
		display: grid !important;
		place-items: center !important;
	}

	.unyk-mobile-designer .unyk-canvas,
	.unyk-canvas {
		width: auto !important;
		height: auto !important;
		max-width: min(100%, calc(100dvh - 190px)) !important;
		max-height: calc(100dvh - 190px) !important;
		aspect-ratio: 1 / 1 !important;
	}
}

@media (max-width: 759px) {
	.unyk-modal {
		padding: 0 !important;
		align-items: stretch !important;
		justify-content: stretch !important;
	}

	.unyk-modal-inner.unyk-mobile-designer,
	.unyk-mobile-designer {
		width: 100vw !important;
		height: 100dvh !important;
		max-width: 100vw !important;
		max-height: 100dvh !important;
	}
}


/* V1.72 — hoofdregel in 1 balk + nette Word-achtige uitlijniconen */
.unyk-context-panel {
	overflow-x: hidden !important;
}

.unyk-context-row-main {
	display: grid !important;
	grid-template-columns: minmax(150px, 1.65fr) 84px 138px minmax(118px, 1.05fr) !important;
	gap: 10px !important;
	align-items: stretch !important;
}

.unyk-context-row-main > * {
	min-width: 0 !important;
}

.unyk-context-row-main .unyk-context-action,
.unyk-context-row-main .unyk-context-font {
	min-height: 56px !important;
	border-radius: 12px !important;
}

.unyk-context-row-main .unyk-context-action {
	min-width: 0 !important;
	padding: 8px 12px !important;
	white-space: nowrap !important;
	font-weight: 600 !important;
}

.unyk-context-row-main .unyk-edit-selected-text {
	width: 100% !important;
}

.unyk-context-row-main .unyk-bold-selected {
	width: 100% !important;
}

.unyk-align-group {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 6px !important;
	padding: 0 !important;
	background: transparent !important;
	min-width: 0 !important;
}

.unyk-align-group .unyk-context-action {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	min-width: 0 !important;
	font-size: 0 !important;
	line-height: 1 !important;
}

.unyk-align-icon {
	width: 20px !important;
	height: 20px !important;
	display: block !important;
}

.unyk-align-icon path {
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 1.8 !important;
	stroke-linecap: round !important;
}

.unyk-align-btn.is-active {
	background: #f4ece6 !important;
	box-shadow: inset 0 0 0 2px currentColor !important;
}

.unyk-context-row-main .unyk-context-font {
	width: 100% !important;
	min-width: 0 !important;
	padding-left: 14px !important;
	padding-right: 38px !important;
	font-weight: 600 !important;
}

@media (max-width: 900px) {
	.unyk-context-row-main {
		grid-template-columns: minmax(132px, 1.45fr) 76px 126px minmax(108px, 1fr) !important;
		gap: 8px !important;
	}

	.unyk-context-row-main .unyk-context-action,
	.unyk-context-row-main .unyk-context-font {
		min-height: 54px !important;
	}
}

@media (max-width: 640px) {
	.unyk-context-row-main {
		grid-template-columns: minmax(120px, 1.35fr) 68px 114px minmax(96px, .95fr) !important;
	}

	.unyk-context-row-main .unyk-context-action,
	.unyk-context-row-main .unyk-context-font {
		padding-left: 10px !important;
		padding-right: 10px !important;
		font-size: 13px !important;
	}

	.unyk-align-icon {
		width: 18px !important;
		height: 18px !important;
	}

	.unyk-context-row-main .unyk-context-font {
		padding-right: 30px !important;
	}
}


/* V1.73 — tekstbalk compacter: kleinere knoppen en lagere hoogte */
.unyk-context-panel {
	padding: 10px 10px 8px !important;
}

.unyk-context-panel:not(.is-hidden)::before {
	margin: 0 0 6px !important;
	padding: 5px 9px !important;
	font-size: 11px !important;
}

.unyk-context-row-main {
	grid-template-columns: minmax(126px, 1.55fr) 72px 108px minmax(92px, .95fr) !important;
	gap: 8px !important;
	align-items: center !important;
}

.unyk-context-row-main .unyk-context-action,
.unyk-context-row-main .unyk-context-font,
.unyk-align-group .unyk-context-action {
	min-height: 44px !important;
	border-radius: 10px !important;
	font-size: 13px !important;
}

.unyk-context-row-main .unyk-context-action {
	padding: 6px 10px !important;
}

.unyk-context-panel .unyk-edit-selected-text,
.unyk-context-panel .unyk-context-font,
.unyk-bold-selected {
	box-shadow: 0 2px 8px rgba(31, 157, 112, .10) !important;
}

.unyk-context-row-main .unyk-edit-selected-text {
	font-size: 12px !important;
}

.unyk-context-row-main .unyk-bold-selected {
	font-size: 12px !important;
	padding-left: 8px !important;
	padding-right: 8px !important;
}

.unyk-align-group {
	gap: 4px !important;
}

.unyk-align-group .unyk-context-action {
	padding: 0 !important;
}

.unyk-align-icon {
	width: 16px !important;
	height: 16px !important;
}

.unyk-context-row-main .unyk-context-font {
	padding-left: 10px !important;
	padding-right: 28px !important;
	font-size: 12px !important;
}

@media (max-width: 900px) {
	.unyk-context-row-main {
		grid-template-columns: minmax(118px, 1.45fr) 66px 102px minmax(88px, .9fr) !important;
		gap: 7px !important;
	}

	.unyk-context-row-main .unyk-context-action,
	.unyk-context-row-main .unyk-context-font,
	.unyk-align-group .unyk-context-action {
		min-height: 42px !important;
	}
}

@media (max-width: 640px) {
	.unyk-context-row-main {
		grid-template-columns: minmax(112px, 1.4fr) 60px 96px minmax(82px, .85fr) !important;
		gap: 6px !important;
	}

	.unyk-context-row-main .unyk-context-action,
	.unyk-context-row-main .unyk-context-font,
	.unyk-align-group .unyk-context-action {
		min-height: 40px !important;
		border-radius: 9px !important;
	}

	.unyk-context-row-main .unyk-edit-selected-text,
	.unyk-context-row-main .unyk-bold-selected,
	.unyk-context-row-main .unyk-context-font {
		font-size: 11.5px !important;
	}

	.unyk-align-icon {
		width: 15px !important;
		height: 15px !important;
	}
}


/* V1.74 — desktop dezelfde compacte tekstbalk als mobiel */
@media (min-width: 760px) {
	.unyk-mobile-designer {
		position: relative !important;
	}

	.unyk-context-panel {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 72px !important;
		grid-column: auto !important;
		grid-row: auto !important;
		height: auto !important;
		max-height: 104px !important;
		overflow: hidden !important;
		border-left: 0 !important;
		border-top: 2px solid #1f9d70 !important;
		border-radius: 14px 14px 0 0 !important;
		background: #f1fff7 !important;
		box-shadow: 0 -10px 30px rgba(31, 157, 112, .18) !important;
		padding: 9px 12px 8px !important;
		z-index: 90 !important;
	}

	.unyk-context-panel:not(.is-hidden)::before {
		display: none !important;
	}

	.unyk-context-panel .unyk-context-row-main {
		display: grid !important;
		grid-template-columns: minmax(132px, 1.3fr) 70px 104px minmax(108px, .95fr) !important;
		gap: 8px !important;
		align-items: center !important;
		margin: 0 !important;
	}

	.unyk-context-panel .unyk-context-row-main .unyk-context-action,
	.unyk-context-panel .unyk-context-row-main .unyk-context-font,
	.unyk-context-panel .unyk-align-group .unyk-context-action {
		min-height: 40px !important;
		border-radius: 9px !important;
		font-size: 12px !important;
	}

	.unyk-context-panel .unyk-context-row-main .unyk-context-action {
		padding: 5px 9px !important;
	}

	.unyk-context-panel .unyk-align-icon {
		width: 15px !important;
		height: 15px !important;
	}

	.unyk-context-panel .unyk-context-font {
		padding-left: 10px !important;
		padding-right: 28px !important;
	}
}

@media (min-width: 1000px) {
	.unyk-context-panel .unyk-context-row-main {
		grid-template-columns: minmax(150px, 1.4fr) 76px 116px minmax(124px, 1fr) !important;
	}
}


/* V1.77 — frontend graveerlijn als echte overlay, gelijk aan backend */
.unyk-canvas-wrap {
	position: relative !important;
}

.unyk-engrave-guide {
	position: absolute !important;
	box-sizing: border-box !important;
	border: 1px dashed #e85b48 !important;
	background: rgba(232,91,72,.025) !important;
	pointer-events: none !important;
	z-index: 2 !important;
	min-width: 1px !important;
	min-height: 1px !important;
}

.unyk-inline-text-editor,
.unyk-crop-modal {
	z-index: 3 !important;
}


/* V1.80 — productpagina: één nette ontwerp-preview, geen dubbele/ingezoomde gallery eronder */
.woocommerce-product-gallery.unyk-product-preview-active,
.images.unyk-product-preview-active {
	position: relative !important;
}

.unyk-product-design-preview-main {
	width: 100% !important;
	min-height: 360px !important;
	aspect-ratio: 1 / 1 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #fff !important;
	border-radius: 12px !important;
	padding: 18px !important;
	box-sizing: border-box !important;
	margin: 0 0 14px !important;
	overflow: hidden !important;
}

.unyk-product-design-preview-main img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
	margin: 0 auto !important;
	transform: none !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.woocommerce-product-gallery.unyk-product-preview-active .unyk-gallery-design-overlay,
.images.unyk-product-preview-active .unyk-gallery-design-overlay {
	display: none !important;
}

.woocommerce-product-gallery.unyk-product-preview-active .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child,
.images.unyk-product-preview-active .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child {
	display: none !important;
}

.woocommerce-product-gallery.unyk-product-preview-active .zoomImg,
.images.unyk-product-preview-active .zoomImg {
	display: none !important;
}

.woocommerce-product-gallery.unyk-product-preview-active .woocommerce-product-gallery__trigger,
.images.unyk-product-preview-active .woocommerce-product-gallery__trigger {
	display: none !important;
}

@media (max-width: 700px) {
	.unyk-product-design-preview-main {
		min-height: 300px !important;
		padding: 12px !important;
	}
}


/* V1.81 — actieve plank-ID zichtbaar in designer-topbar */
.unyk-active-plank-badge {
	display: inline-grid !important;
	grid-template-columns: auto auto !important;
	grid-template-rows: auto auto !important;
	align-items: center !important;
	column-gap: 6px !important;
	row-gap: 0 !important;
	max-width: 210px !important;
	min-width: 0 !important;
	padding: 5px 9px !important;
	border: 1px solid rgba(255,255,255,.28) !important;
	border-radius: 10px !important;
	background: rgba(255,255,255,.10) !important;
	color: #fff !important;
	line-height: 1.05 !important;
	box-sizing: border-box !important;
}

.unyk-active-plank-badge .unyk-active-plank-label {
	font-size: 9px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: .05em !important;
	opacity: .78 !important;
}

.unyk-active-plank-badge strong {
	font-size: 12px !important;
	font-weight: 900 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	max-width: 150px !important;
}

.unyk-active-plank-badge small {
	grid-column: 1 / -1 !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	opacity: .86 !important;
	max-width: 190px !important;
}

@media (max-width: 760px) {
	.unyk-active-plank-badge {
		max-width: 118px !important;
		padding: 5px 7px !important;
	}

	.unyk-active-plank-badge small {
		display: none !important;
	}

	.unyk-active-plank-badge strong {
		max-width: 78px !important;
		font-size: 11px !important;
	}
}

@media (max-width: 520px) {
	.unyk-active-plank-badge {
		order: 4 !important;
		grid-template-columns: 1fr !important;
		max-width: 96px !important;
	}

	.unyk-active-plank-badge .unyk-active-plank-label {
		display: none !important;
	}

	.unyk-active-plank-badge strong {
		max-width: 78px !important;
	}
}


/* V1.82 — plank-ID duidelijk in het grijze werkgebied */
.unyk-active-plank-badge {
	display: none !important;
}

.unyk-stage-plank-badge {
	position: absolute !important;
	top: 10px !important;
	left: 10px !important;
	z-index: 8 !important;
	display: grid !important;
	grid-template-columns: auto 1fr !important;
	grid-template-rows: auto auto !important;
	align-items: center !important;
	column-gap: 7px !important;
	row-gap: 1px !important;
	max-width: min(320px, calc(100% - 20px)) !important;
	padding: 7px 10px !important;
	border-radius: 12px !important;
	background: rgba(255,255,255,.94) !important;
	border: 1px solid rgba(0,0,0,.12) !important;
	box-shadow: 0 4px 14px rgba(0,0,0,.12) !important;
	color: #2b2b2b !important;
	pointer-events: none !important;
	line-height: 1.08 !important;
	box-sizing: border-box !important;
}

.unyk-stage-plank-badge span {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	grid-row: 1 / -1 !important;
	min-width: 32px !important;
	height: 32px !important;
	border-radius: 9px !important;
	background: #7e3633 !important;
	color: #fff !important;
	font-size: 11px !important;
	font-weight: 900 !important;
	letter-spacing: .05em !important;
	text-transform: uppercase !important;
}

.unyk-stage-plank-badge strong {
	display: block !important;
	font-size: 14px !important;
	font-weight: 900 !important;
	color: #1f1f1f !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	max-width: 250px !important;
}

.unyk-stage-plank-badge small {
	display: block !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	color: #5b5b5b !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	max-width: 250px !important;
}

@media (max-width: 520px) {
	.unyk-stage-plank-badge {
		top: 8px !important;
		left: 8px !important;
		max-width: calc(100% - 16px) !important;
		padding: 6px 8px !important;
	}

	.unyk-stage-plank-badge span {
		min-width: 28px !important;
		height: 28px !important;
		font-size: 10px !important;
	}

	.unyk-stage-plank-badge strong {
		font-size: 13px !important;
		max-width: 205px !important;
	}

	.unyk-stage-plank-badge small {
		font-size: 10px !important;
		max-width: 205px !important;
	}
}


/* V1.83 — productpagina definitief: één grote ontwerp-preview links, gallery zelf verbergen */
.woocommerce-product-gallery.unyk-final-gallery-preview-active,
.images.unyk-final-gallery-preview-active,
div.product div.images.unyk-final-gallery-preview-active {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 520px !important;
	height: auto !important;
	float: none;
	position: relative !important;
	box-sizing: border-box !important;
	background: #fff !important;
	border-radius: 12px !important;
	overflow: visible !important;
	opacity: 1 !important;
}

.woocommerce-product-gallery.unyk-final-gallery-preview-active > :not(.unyk-final-gallery-preview),
.images.unyk-final-gallery-preview-active > :not(.unyk-final-gallery-preview),
div.product div.images.unyk-final-gallery-preview-active > :not(.unyk-final-gallery-preview),
.woocommerce-product-gallery.unyk-final-gallery-preview-active [data-unyk-gallery-hidden="1"],
.images.unyk-final-gallery-preview-active [data-unyk-gallery-hidden="1"] {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	max-height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: hidden !important;
}

.unyk-final-gallery-preview {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 520px !important;
	aspect-ratio: 1 / 1 !important;
	padding: 24px !important;
	box-sizing: border-box !important;
	background: #fff !important;
	border-radius: 12px !important;
	overflow: hidden !important;
}

.unyk-final-gallery-preview img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
	margin: 0 auto !important;
	transform: none !important;
	visibility: visible !important;
	opacity: 1 !important;
	border: 0 !important;
	box-shadow: none !important;
}

@media (max-width: 700px) {
	.woocommerce-product-gallery.unyk-final-gallery-preview-active,
	.images.unyk-final-gallery-preview-active,
	div.product div.images.unyk-final-gallery-preview-active,
	.unyk-final-gallery-preview {
		min-height: 330px !important;
	}

	.unyk-final-gallery-preview {
		padding: 14px !important;
	}
}


/* V1.84 — ronde planken in de klant-designer */
.unyk-designer-widget.unyk-shape-round .unyk-engrave-guide { border-radius: 50% !important; }
.unyk-designer-widget.unyk-shape-round .unyk-stage-plank-badge span::after { content: ' · rond'; }


/* V1.90 — echte designbibliotheek previews */
.unyk-library-image-item small { display: block; margin-top: 5px; font-size: 10px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.unyk-library-preview img { max-width: 76%; max-height: 76%; object-fit: contain; }


/* V1.91 — categorieplaatjes in Designs-menu */
.unyk-category-icon-img {
	width: 54px !important;
	height: 54px !important;
	object-fit: contain !important;
	display: block !important;
	margin: 0 auto !important;
}

.unyk-category-btn:has(.unyk-category-icon-img) span {
	display: none !important;
}

/* V1.93 startdesigns */
.unyk-startdesign-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.unyk-startdesign-category-title {
  grid-column: 1 / -1;
  font-weight: 800;
  font-size: 12px;
  opacity: .7;
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.unyk-startdesign-btn {
  min-height: 132px;
  padding: 8px !important;
  overflow: hidden;
}
.unyk-startdesign-btn img {
  width: 100%;
  height: 82px;
  object-fit: contain;
  display: block;
  margin: 0 0 6px;
  background: rgba(255,255,255,.55);
  border-radius: 10px;
}
.unyk-empty-template-list {
  grid-column: 1 / -1;
  padding: 14px;
  background: rgba(255,255,255,.65);
  border-radius: 12px;
  font-size: 13px;
}


/* V1.96 — mobiel: upload-bottomsheet mag cropper niet overlappen */
.unyk-modal.unyk-crop-open .unyk-subpanel,
.unyk-modal.unyk-crop-open .unyk-context-panel {
	display: none !important;
	pointer-events: none !important;
}

.unyk-modal.unyk-crop-open .unyk-main-stage {
	padding-bottom: 0 !important;
}

.unyk-modal.unyk-crop-open .unyk-bottom-nav {
	pointer-events: none !important;
}

.unyk-mobile-designer .unyk-crop-modal {
	z-index: 260 !important;
}

.unyk-mobile-designer .unyk-crop-card {
	max-height: calc(100dvh - 150px) !important;
	display: flex !important;
	flex-direction: column !important;
}

.unyk-mobile-designer .unyk-crop-stage {
	min-height: 0 !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-crop-canvas {
	max-height: calc(100dvh - 290px) !important;
	object-fit: contain !important;
}


/* V2.06 — stap 1: panelen als overlay-lades, preview blijft groot */
.unyk-modal-inner.unyk-mobile-designer,
.unyk-mobile-designer {
	--unyk-sheet-bottom: 72px;
	--unyk-sheet-height: min(52dvh, 430px);
}

/* Bij open Templates/Designs/Upload/Lagen mag de plank niet meer krimpen. */
.unyk-mobile-designer.unyk-panel-open .unyk-main-stage,
.unyk-mobile-designer.unyk-context-open .unyk-main-stage {
	padding-bottom: 0 !important;
}

/* De canvasruimte blijft volledig beschikbaar achter de lade. */
.unyk-mobile-designer .unyk-main-stage {
	height: 100% !important;
	min-height: 0 !important;
	max-height: none !important;
}

.unyk-mobile-designer .unyk-canvas-wrap {
	height: 100% !important;
	min-height: 0 !important;
	max-height: 100% !important;
}

/* Echte bottom-sheet overlay over de plank heen. */
.unyk-mobile-designer .unyk-subpanel {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: var(--unyk-sheet-bottom) !important;
	z-index: 150 !important;
	min-height: 190px !important;
	max-height: var(--unyk-sheet-height) !important;
	padding: 16px 18px 18px !important;
	border: 1px solid rgba(0,0,0,.08) !important;
	border-bottom: 0 !important;
	border-radius: 24px 24px 0 0 !important;
	background: rgba(255,255,255,.98) !important;
	box-shadow: 0 -18px 45px rgba(0,0,0,.16) !important;
	overflow: auto !important;
	box-sizing: border-box !important;
	-webkit-overflow-scrolling: touch !important;
}

.unyk-mobile-designer .unyk-subpanel.is-hidden {
	display: none !important;
	pointer-events: none !important;
}

.unyk-mobile-designer .unyk-subpanel-handle {
	width: 58px !important;
	height: 5px !important;
	border-radius: 999px !important;
	background: #cfc9c5 !important;
	margin: -2px auto 14px !important;
	cursor: pointer !important;
}

.unyk-mobile-designer .unyk-subpanel-title {
	font-size: 28px !important;
	font-weight: 900 !important;
	line-height: 1.05 !important;
	color: #5f211e !important;
	margin: 0 0 8px !important;
}

.unyk-mobile-designer .unyk-subpanel-note {
	font-size: 14px !important;
	line-height: 1.45 !important;
	color: #6a5a55 !important;
	margin: 0 0 14px !important;
}

/* Templates/startdesigns blijven in dezelfde flow, maar ogen als kaarten in de lade. */
.unyk-mobile-designer .unyk-startdesign-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
}

.unyk-mobile-designer .unyk-startdesign-btn,
.unyk-mobile-designer .unyk-template-btn {
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 16px !important;
	box-shadow: 0 3px 12px rgba(0,0,0,.06) !important;
	color: #2f2422 !important;
}

.unyk-mobile-designer .unyk-startdesign-btn img {
	height: 92px !important;
	background: #faf8f5 !important;
	border-radius: 13px !important;
}

/* Designs-categorieën als rustige chips/tegels in een overlay-lade. */
.unyk-mobile-designer .unyk-design-category-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
}

.unyk-mobile-designer .unyk-category-btn {
	min-height: 92px !important;
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 16px !important;
	box-shadow: 0 3px 12px rgba(0,0,0,.05) !important;
	color: #7e3633 !important;
}

/* Designbibliotheek in de lade, maar zonder preview te verkleinen. */
.unyk-mobile-designer .unyk-library-head {
	grid-template-columns: 42px 1fr !important;
	gap: 10px !important;
	align-items: center !important;
	margin-bottom: 12px !important;
}

.unyk-mobile-designer .unyk-back-library,
.unyk-mobile-designer .unyk-library-title {
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 14px !important;
	box-shadow: 0 2px 8px rgba(0,0,0,.04) !important;
}

.unyk-mobile-designer .unyk-design-library-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
}

.unyk-mobile-designer .unyk-library-item {
	min-height: 118px !important;
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 16px !important;
	box-shadow: 0 3px 12px rgba(0,0,0,.05) !important;
	padding: 8px !important;
}

/* Upload als nette overlay-lade. */
.unyk-mobile-designer .unyk-upload-box {
	border: 2px dashed #cbb095 !important;
	border-radius: 18px !important;
	background: #fffdf9 !important;
	min-height: 118px !important;
	display: grid !important;
	place-items: center !important;
	padding: 18px !important;
	color: #7e3633 !important;
}

/* Onderbalk blijft altijd boven/los van de lades. */
.unyk-mobile-designer .unyk-bottom-nav {
	position: relative !important;
	z-index: 180 !important;
	box-shadow: 0 -1px 0 rgba(0,0,0,.08) !important;
}

/* Cropper wint altijd van de lade. */
.unyk-modal.unyk-crop-open .unyk-subpanel,
.unyk-modal.unyk-crop-open .unyk-context-panel {
	display: none !important;
	pointer-events: none !important;
}

.unyk-mobile-designer .unyk-crop-modal {
	z-index: 260 !important;
}

@media (max-width: 420px) {
	.unyk-mobile-designer .unyk-subpanel {
		max-height: min(54dvh, 430px) !important;
		padding-left: 14px !important;
		padding-right: 14px !important;
		border-radius: 22px 22px 0 0 !important;
	}

	.unyk-mobile-designer .unyk-subpanel-title {
		font-size: 26px !important;
	}

	.unyk-mobile-designer .unyk-design-library-grid,
	.unyk-mobile-designer .unyk-startdesign-grid {
		gap: 10px !important;
	}
}


/* V2.07 — mobiele designs-lade: zoeken/header mag niet overlappen */
.unyk-mobile-designer .unyk-library-head {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	width: 100% !important;
	margin: 0 0 14px !important;
	padding: 0 !important;
	box-sizing: border-box !important;
	position: relative !important;
}

.unyk-mobile-designer .unyk-back-library {
	position: static !important;
	flex: 0 0 44px !important;
	width: 44px !important;
	min-width: 44px !important;
	height: 42px !important;
	line-height: 1 !important;
	display: inline-grid !important;
	place-items: center !important;
	margin: 0 !important;
	padding: 0 !important;
	z-index: 2 !important;
}

.unyk-mobile-designer .unyk-library-title {
	position: static !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	height: 42px !important;
	display: flex !important;
	align-items: center !important;
	margin: 0 !important;
	padding: 0 14px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-design-library-grid {
	clear: both !important;
}


/* V2.08 — Templates-lade mooier: grotere kaarten, previews en categoriechips */
.unyk-mobile-designer .unyk-templates-panel {
	background: #fff !important;
	border-radius: 24px 24px 0 0 !important;
	padding: 10px 16px 16px !important;
	max-height: min(56dvh, 470px) !important;
}

.unyk-mobile-designer .unyk-template-panel-head {
	display: flex !important;
	align-items: flex-start !important;
	justify-content: space-between !important;
	gap: 12px !important;
	margin-bottom: 8px !important;
}

.unyk-mobile-designer .unyk-templates-panel .unyk-subpanel-title {
	font-size: 30px !important;
	font-weight: 900 !important;
	line-height: 1.05 !important;
	color: #5f211e !important;
	margin: 0 0 6px !important;
}

.unyk-mobile-designer .unyk-templates-panel .unyk-subpanel-note {
	font-size: 14px !important;
	line-height: 1.35 !important;
	color: #6d5f5a !important;
	margin: 0 !important;
}

.unyk-mobile-designer .unyk-template-filter {
	display: flex !important;
	gap: 9px !important;
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch !important;
	padding: 4px 0 12px !important;
	margin: 0 -2px 2px !important;
	scrollbar-width: none !important;
}

.unyk-mobile-designer .unyk-template-filter::-webkit-scrollbar {
	display: none !important;
}

.unyk-mobile-designer .unyk-template-filter-btn {
	flex: 0 0 auto !important;
	border: 1px solid #e5d4ce !important;
	background: #fff !important;
	color: #6b514c !important;
	border-radius: 999px !important;
	padding: 9px 15px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	box-shadow: none !important;
}

.unyk-mobile-designer .unyk-template-filter-btn.is-active {
	background: #f8ecea !important;
	border-color: #b7837c !important;
	color: #7e3633 !important;
}

.unyk-mobile-designer .unyk-startdesign-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 14px !important;
	margin-top: 8px !important;
}

.unyk-mobile-designer .unyk-startdesign-btn {
	min-height: 178px !important;
	padding: 10px !important;
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 18px !important;
	box-shadow: 0 5px 18px rgba(40, 20, 12, .08) !important;
	color: #2e2421 !important;
	text-align: center !important;
	display: grid !important;
	grid-template-rows: minmax(110px, 1fr) auto auto !important;
	align-items: center !important;
	gap: 7px !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-startdesign-btn.is-hidden {
	display: none !important;
}

.unyk-mobile-designer .unyk-startdesign-preview {
	display: grid !important;
	place-items: center !important;
	width: 100% !important;
	height: 112px !important;
	background: linear-gradient(180deg, #fffaf6, #f6f1ec) !important;
	border-radius: 14px !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-startdesign-preview img,
.unyk-mobile-designer .unyk-startdesign-btn img {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	object-fit: contain !important;
	background: transparent !important;
	border-radius: 0 !important;
	margin: 0 !important;
}

.unyk-mobile-designer .unyk-startdesign-name {
	display: block !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	line-height: 1.15 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-startdesign-btn small {
	font-size: 11px !important;
	line-height: 1.1 !important;
	color: #8b7b75 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-startdesign-placeholder {
	font-size: 12px !important;
	font-weight: 700 !important;
	color: #9a8781 !important;
}

.unyk-mobile-designer .unyk-empty-template-list {
	grid-column: 1 / -1 !important;
	padding: 18px !important;
	background: #faf7f4 !important;
	border: 1px dashed #dac9c2 !important;
	border-radius: 16px !important;
	color: #6d5f5a !important;
	font-size: 14px !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer .unyk-startdesign-grid {
		gap: 10px !important;
	}
	.unyk-mobile-designer .unyk-startdesign-btn {
		min-height: 158px !important;
		padding: 8px !important;
	}
	.unyk-mobile-designer .unyk-startdesign-preview {
		height: 96px !important;
	}
}


/* V2.09 — Templates volledig zichtbaar in mobiele lade */
.unyk-mobile-designer .unyk-templates-panel {
	max-height: min(68dvh, 560px) !important;
	padding: 10px 16px 92px !important;
}

.unyk-mobile-designer .unyk-template-grid.unyk-startdesign-grid {
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
	align-items: stretch !important;
}

.unyk-mobile-designer .unyk-startdesign-btn {
	min-height: 230px !important;
	grid-template-rows: minmax(156px, 1fr) auto auto !important;
	overflow: visible !important;
}

.unyk-mobile-designer .unyk-startdesign-preview {
	height: 160px !important;
	min-height: 160px !important;
	padding: 8px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-startdesign-preview img,
.unyk-mobile-designer .unyk-startdesign-btn img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
}

.unyk-mobile-designer .unyk-startdesign-name,
.unyk-mobile-designer .unyk-startdesign-btn small {
	max-width: 100% !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer .unyk-templates-panel {
		max-height: min(70dvh, 560px) !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
	.unyk-mobile-designer .unyk-template-grid.unyk-startdesign-grid {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
	}
	.unyk-mobile-designer .unyk-startdesign-btn {
		min-height: 214px !important;
		grid-template-rows: minmax(142px, 1fr) auto auto !important;
	}
	.unyk-mobile-designer .unyk-startdesign-preview {
		height: 146px !important;
		min-height: 146px !important;
	}
}


/* V2.10 — Templates eerst categorieën, daarna inhoud */
.unyk-mobile-designer .unyk-template-category-view,
.unyk-mobile-designer .unyk-template-content-view {
	width: 100% !important;
}

.unyk-mobile-designer .unyk-template-category-view.is-hidden,
.unyk-mobile-designer .unyk-template-content-view.is-hidden {
	display: none !important;
}

.unyk-mobile-designer .unyk-template-category-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
	padding: 6px 0 0 !important;
}

.unyk-mobile-designer .unyk-template-category-btn {
	appearance: none !important;
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 18px !important;
	box-shadow: 0 5px 18px rgba(40, 20, 12, .08) !important;
	padding: 10px !important;
	min-height: 172px !important;
	display: grid !important;
	grid-template-rows: minmax(112px, 1fr) auto auto !important;
	align-items: center !important;
	gap: 7px !important;
	text-align: center !important;
	color: #2e2421 !important;
}

.unyk-mobile-designer .unyk-template-category-preview {
	display: grid !important;
	place-items: center !important;
	width: 100% !important;
	height: 112px !important;
	border-radius: 14px !important;
	background: linear-gradient(180deg, #fffaf6, #f6f1ec) !important;
	overflow: hidden !important;
	padding: 8px !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-template-category-preview img {
	display: block !important;
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
}

.unyk-mobile-designer .unyk-template-category-preview span {
	font-size: 34px !important;
	color: #8b3c37 !important;
}

.unyk-mobile-designer .unyk-template-category-btn strong {
	display: block !important;
	font-size: 15px !important;
	font-weight: 900 !important;
	line-height: 1.15 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-template-category-btn small {
	font-size: 11px !important;
	line-height: 1.1 !important;
	color: #8b7b75 !important;
}

.unyk-mobile-designer .unyk-template-content-head {
	display: grid !important;
	grid-template-columns: 40px minmax(0, 1fr) !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 4px 0 10px !important;
}

.unyk-mobile-designer .unyk-template-back-categories {
	appearance: none !important;
	border: 1px solid #eadfd8 !important;
	background: #fff !important;
	border-radius: 12px !important;
	width: 38px !important;
	height: 38px !important;
	font-size: 22px !important;
	line-height: 1 !important;
	color: #7e3633 !important;
	box-shadow: 0 4px 12px rgba(40, 20, 12, .06) !important;
}

.unyk-mobile-designer .unyk-template-current-category-title {
	font-size: 18px !important;
	font-weight: 900 !important;
	color: #5f211e !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-template-content-view .unyk-template-grid.unyk-startdesign-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
	margin-top: 0 !important;
}

.unyk-mobile-designer .unyk-template-content-view .unyk-startdesign-btn {
	min-height: 198px !important;
	grid-template-rows: minmax(128px, 1fr) auto auto !important;
}

.unyk-mobile-designer .unyk-template-content-view .unyk-startdesign-preview {
	height: 132px !important;
	min-height: 132px !important;
}

@media (min-width: 520px) {
	.unyk-mobile-designer .unyk-template-category-grid,
	.unyk-mobile-designer .unyk-template-content-view .unyk-template-grid.unyk-startdesign-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 380px) {
	.unyk-mobile-designer .unyk-template-category-grid,
	.unyk-mobile-designer .unyk-template-content-view .unyk-template-grid.unyk-startdesign-grid {
		gap: 10px !important;
	}
	.unyk-mobile-designer .unyk-template-category-btn {
		min-height: 158px !important;
		padding: 8px !important;
		grid-template-rows: minmax(100px, 1fr) auto auto !important;
	}
	.unyk-mobile-designer .unyk-template-category-preview {
		height: 100px !important;
	}
	.unyk-mobile-designer .unyk-template-content-view .unyk-startdesign-btn {
		min-height: 184px !important;
		grid-template-rows: minmax(118px, 1fr) auto auto !important;
	}
	.unyk-mobile-designer .unyk-template-content-view .unyk-startdesign-preview {
		height: 122px !important;
		min-height: 122px !important;
	}
}


/* V2.11 — Templatecategorie terugknop netter uitlijnen */
.unyk-mobile-designer .unyk-template-content-head {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 10px !important;
	margin: 4px 0 14px !important;
	min-height: 38px !important;
	width: 100% !important;
}

.unyk-mobile-designer .unyk-template-back-categories {
	appearance: none !important;
	border: 1px solid #eadfd8 !important;
	background: #fffaf8 !important;
	border-radius: 999px !important;
	width: auto !important;
	min-width: 72px !important;
	height: 36px !important;
	padding: 0 12px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	color: #7e3633 !important;
	box-shadow: 0 3px 10px rgba(40, 20, 12, .06) !important;
	flex: 0 0 auto !important;
}

.unyk-mobile-designer .unyk-template-back-categories span {
	font-size: 18px !important;
	line-height: 1 !important;
	transform: translateY(-1px) !important;
}

.unyk-mobile-designer .unyk-template-back-categories em {
	font-style: normal !important;
	font-size: 13px !important;
	line-height: 1 !important;
}

.unyk-mobile-designer .unyk-template-current-category-title {
	display: block !important;
	font-size: 19px !important;
	font-weight: 900 !important;
	line-height: 1.15 !important;
	color: #5f211e !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	min-width: 0 !important;
}


/* V2.12 — Bovenbalk rustiger maken */
.unyk-mobile-designer {
	grid-template-rows: 96px minmax(0, 1fr) 72px !important;
}

.unyk-mobile-designer .unyk-topbar {
	position: relative !important;
	grid-row: 1 !important;
	height: 96px !important;
	min-height: 96px !important;
	padding: 9px 12px 8px !important;
	background: linear-gradient(180deg, #8a3c37 0%, #75322f 100%) !important;
	box-shadow: 0 1px 0 rgba(0,0,0,.12) !important;
}

.unyk-mobile-designer .unyk-topbar-left,
.unyk-mobile-designer .unyk-topbar-right {
	position: absolute !important;
	top: 9px !important;
	display: flex !important;
	align-items: center !important;
	gap: 7px !important;
	z-index: 3 !important;
}

.unyk-mobile-designer .unyk-topbar-left { left: 10px !important; }
.unyk-mobile-designer .unyk-topbar-right { right: 10px !important; }

.unyk-mobile-designer .unyk-topbar-title {
	position: absolute !important;
	left: 92px !important;
	right: 112px !important;
	top: 15px !important;
	min-width: 0 !important;
	text-align: center !important;
	font-size: 18px !important;
	font-weight: 900 !important;
	letter-spacing: .1px !important;
	color: #fff !important;
	line-height: 1.2 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	pointer-events: none !important;
}

.unyk-mobile-designer .unyk-top-icon {
	width: 36px !important;
	min-width: 36px !important;
	height: 36px !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.10) !important;
	font-size: 21px !important;
	color: #fff !important;
}

.unyk-mobile-designer .unyk-undo-btn,
.unyk-mobile-designer .unyk-redo-btn {
	background: rgba(255,255,255,.08) !important;
}

.unyk-mobile-designer .unyk-close-modal {
	background: transparent !important;
	font-size: 25px !important;
	opacity: .95 !important;
}

.unyk-mobile-designer .unyk-top-confirm {
	width: 50px !important;
	min-width: 50px !important;
	height: 40px !important;
	border-radius: 12px !important;
	background: #2fb06a !important;
	color: #fff !important;
	font-size: 28px !important;
	font-weight: 900 !important;
	box-shadow: 0 5px 14px rgba(35,137,81,.28), inset 0 -1px 0 rgba(0,0,0,.16) !important;
}

.unyk-mobile-designer .unyk-top-confirm:active {
	transform: translateY(1px) !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	position: absolute !important;
	left: 12px !important;
	right: 12px !important;
	bottom: 9px !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 3px !important;
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 3px !important;
	background: rgba(255,255,255,.12) !important;
	border: 1px solid rgba(255,255,255,.24) !important;
	border-radius: 15px !important;
	box-sizing: border-box !important;
	z-index: 2 !important;
}

.unyk-mobile-designer .unyk-orientation-btn {
	min-width: 0 !important;
	min-height: 34px !important;
	height: 34px !important;
	padding: 0 6px !important;
	border-radius: 12px !important;
	font-size: 12px !important;
	font-weight: 850 !important;
	letter-spacing: 0 !important;
	color: rgba(255,255,255,.88) !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-orientation-btn.is-active {
	background: #fff !important;
	color: #7e3633 !important;
	box-shadow: 0 2px 7px rgba(0,0,0,.14) !important;
}

.unyk-mobile-designer .unyk-zoom-tools {
	display: none !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer .unyk-topbar-title {
		left: 86px !important;
		right: 96px !important;
		font-size: 16px !important;
	}
	.unyk-mobile-designer .unyk-top-icon {
		width: 33px !important;
		min-width: 33px !important;
		height: 33px !important;
	}
	.unyk-mobile-designer .unyk-top-confirm {
		width: 44px !important;
		min-width: 44px !important;
		height: 36px !important;
	}
	.unyk-mobile-designer .unyk-orientation-btn {
		font-size: 11px !important;
	}
}


/* V2.13 — bovenbalk layout-fix na stap 5 */
.unyk-mobile-designer {
	grid-template-rows: 86px minmax(0, 1fr) 72px !important;
}

.unyk-mobile-designer .unyk-topbar {
	position: relative !important;
	grid-row: 1 !important;
	height: 86px !important;
	min-height: 86px !important;
	padding: 0 !important;
	background: linear-gradient(180deg, #873b36 0%, #74312e 100%) !important;
	box-shadow: 0 1px 0 rgba(0,0,0,.12) !important;
	overflow: visible !important;
}

.unyk-mobile-designer .unyk-topbar-left,
.unyk-mobile-designer .unyk-topbar-right {
	position: absolute !important;
	top: 8px !important;
	display: flex !important;
	align-items: center !important;
	gap: 5px !important;
	z-index: 4 !important;
}

.unyk-mobile-designer .unyk-topbar-left {
	left: 12px !important;
}

.unyk-mobile-designer .unyk-topbar-right {
	right: 10px !important;
}

.unyk-mobile-designer .unyk-topbar-title {
	position: absolute !important;
	left: 98px !important;
	right: 104px !important;
	top: 17px !important;
	text-align: center !important;
	font-size: 17px !important;
	font-weight: 900 !important;
	line-height: 1.15 !important;
	letter-spacing: .05px !important;
	color: #fff !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	pointer-events: none !important;
}

.unyk-mobile-designer .unyk-top-icon {
	width: 32px !important;
	min-width: 32px !important;
	height: 32px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #fff !important;
	font-size: 23px !important;
	line-height: 1 !important;
	padding: 0 !important;
	outline: none !important;
}

.unyk-mobile-designer .unyk-undo-btn,
.unyk-mobile-designer .unyk-redo-btn {
	background: transparent !important;
	opacity: .95 !important;
}

.unyk-mobile-designer .unyk-close-modal {
	background: transparent !important;
	font-size: 25px !important;
	opacity: .92 !important;
}

.unyk-mobile-designer .unyk-top-confirm {
	width: 48px !important;
	min-width: 48px !important;
	height: 38px !important;
	border-radius: 12px !important;
	background: #2fad67 !important;
	color: #fff !important;
	font-size: 27px !important;
	font-weight: 900 !important;
	box-shadow: 0 4px 12px rgba(35,137,81,.28), inset 0 -1px 0 rgba(0,0,0,.16) !important;
	outline: none !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	position: absolute !important;
	left: 12px !important;
	right: 12px !important;
	bottom: 7px !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 3px !important;
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 3px !important;
	background: rgba(255,255,255,.11) !important;
	border: 1px solid rgba(255,255,255,.22) !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	z-index: 2 !important;
}

.unyk-mobile-designer .unyk-orientation-btn {
	min-width: 0 !important;
	min-height: 30px !important;
	height: 30px !important;
	padding: 0 6px !important;
	border: 0 !important;
	border-radius: 11px !important;
	background: transparent !important;
	color: rgba(255,255,255,.88) !important;
	font-size: 12px !important;
	font-weight: 850 !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	outline: none !important;
}

.unyk-mobile-designer .unyk-orientation-btn.is-active {
	background: #fff !important;
	color: #7e3633 !important;
	box-shadow: 0 2px 6px rgba(0,0,0,.14) !important;
}

.unyk-mobile-designer .unyk-zoom-tools {
	display: none !important;
}

.unyk-mobile-designer .unyk-main-stage {
	background: #e5e5e5 !important;
	padding: 0 !important;
}

.unyk-mobile-designer .unyk-canvas-wrap {
	background: #e5e5e5 !important;
	box-shadow: none !important;
	border: 0 !important;
}

.unyk-mobile-designer .unyk-canvas {
	box-shadow: none !important;
	border: 0 !important;
	outline: none !important;
}

.unyk-mobile-designer .unyk-nav-btn,
.unyk-mobile-designer .unyk-nav-btn:focus,
.unyk-mobile-designer .unyk-nav-btn:focus-visible,
.unyk-mobile-designer .unyk-nav-btn:active {
	outline: none !important;
	box-shadow: none !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer {
		grid-template-rows: 84px minmax(0, 1fr) 72px !important;
	}

	.unyk-mobile-designer .unyk-topbar {
		height: 84px !important;
		min-height: 84px !important;
	}

	.unyk-mobile-designer .unyk-topbar-title {
		left: 82px !important;
		right: 92px !important;
		font-size: 16px !important;
	}

	.unyk-mobile-designer .unyk-top-icon {
		width: 29px !important;
		min-width: 29px !important;
		height: 29px !important;
	}

	.unyk-mobile-designer .unyk-top-confirm {
		width: 44px !important;
		min-width: 44px !important;
		height: 36px !important;
	}

	.unyk-mobile-designer .unyk-orientation-btn {
		font-size: 10.8px !important;
	}
}


/* V2.14 — bovenbalk fix: nette undo/redo iconen en meer ademruimte */
.unyk-mobile-designer {
	grid-template-rows: 96px minmax(0, 1fr) 72px !important;
}

.unyk-mobile-designer .unyk-topbar {
	height: 96px !important;
	min-height: 96px !important;
	padding: 0 !important;
	background: linear-gradient(180deg, #873b36 0%, #72302d 100%) !important;
	overflow: visible !important;
}

.unyk-mobile-designer .unyk-topbar-left {
	left: 10px !important;
	top: 10px !important;
	gap: 2px !important;
	padding: 3px !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.10) !important;
	border: 1px solid rgba(255,255,255,.12) !important;
	backdrop-filter: blur(6px) !important;
}

.unyk-mobile-designer .unyk-topbar-right {
	right: 9px !important;
	top: 9px !important;
	gap: 5px !important;
}

.unyk-mobile-designer .unyk-topbar-title {
	left: 92px !important;
	right: 96px !important;
	top: 18px !important;
	font-size: 17px !important;
	font-weight: 900 !important;
	line-height: 1.1 !important;
	letter-spacing: .05px !important;
}

.unyk-mobile-designer .unyk-top-icon {
	width: 30px !important;
	min-width: 30px !important;
	height: 30px !important;
	border-radius: 999px !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	font-size: 0 !important;
	line-height: 1 !important;
	padding: 0 !important;
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #fff !important;
}

.unyk-mobile-designer .unyk-top-icon:hover,
.unyk-mobile-designer .unyk-top-icon:active {
	background: rgba(255,255,255,.12) !important;
}

.unyk-mobile-designer .unyk-undo-btn::before,
.unyk-mobile-designer .unyk-redo-btn::before,
.unyk-mobile-designer .unyk-close-modal::before {
	content: '' !important;
	display: block !important;
	width: 17px !important;
	height: 17px !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: contain !important;
}

.unyk-mobile-designer .unyk-undo-btn::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 7H4V2'/%3E%3Cpath d='M4.8 7.8A8 8 0 1 1 7.2 19'/%3E%3C/svg%3E") !important;
}

.unyk-mobile-designer .unyk-redo-btn::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 7h5V2'/%3E%3Cpath d='M19.2 7.8A8 8 0 1 0 16.8 19'/%3E%3C/svg%3E") !important;
}

.unyk-mobile-designer .unyk-close-modal {
	width: 30px !important;
	min-width: 30px !important;
	height: 30px !important;
	opacity: .9 !important;
}

.unyk-mobile-designer .unyk-close-modal::before {
	width: 15px !important;
	height: 15px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") !important;
}

.unyk-mobile-designer .unyk-top-confirm {
	width: 44px !important;
	min-width: 44px !important;
	height: 38px !important;
	border-radius: 13px !important;
	font-size: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.unyk-mobile-designer .unyk-top-confirm::before {
	content: '' !important;
	display: block !important;
	width: 22px !important;
	height: 22px !important;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	left: 10px !important;
	right: 10px !important;
	bottom: 8px !important;
	padding: 4px !important;
	gap: 4px !important;
	border-radius: 16px !important;
	background: rgba(255,255,255,.13) !important;
	border: 1px solid rgba(255,255,255,.20) !important;
}

.unyk-mobile-designer .unyk-orientation-btn {
	height: 32px !important;
	min-height: 32px !important;
	border-radius: 12px !important;
	font-size: 11.5px !important;
	font-weight: 850 !important;
	padding: 0 4px !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge {
	z-index: 3 !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer {
		grid-template-rows: 98px minmax(0, 1fr) 72px !important;
	}

	.unyk-mobile-designer .unyk-topbar {
		height: 98px !important;
		min-height: 98px !important;
	}

	.unyk-mobile-designer .unyk-topbar-title {
		left: 86px !important;
		right: 84px !important;
		top: 17px !important;
		font-size: 14px !important;
	}

	.unyk-mobile-designer .unyk-topbar-left {
		left: 8px !important;
		top: 9px !important;
	}

	.unyk-mobile-designer .unyk-topbar-right {
		right: 7px !important;
		top: 8px !important;
	}

	.unyk-mobile-designer .unyk-top-icon {
		width: 27px !important;
		min-width: 27px !important;
		height: 27px !important;
	}

	.unyk-mobile-designer .unyk-top-confirm {
		width: 40px !important;
		min-width: 40px !important;
		height: 34px !important;
	}

	.unyk-mobile-designer .unyk-orientation-tools {
		left: 8px !important;
		right: 8px !important;
		bottom: 8px !important;
	}

	.unyk-mobile-designer .unyk-orientation-btn {
		font-size: 10px !important;
		height: 31px !important;
		min-height: 31px !important;
		padding: 0 2px !important;
	}
}


/* V2.15 — bovenbalk: extra ruimte tussen knoppen/titel/oriëntatie */
.unyk-mobile-designer {
	grid-template-rows: 104px minmax(0, 1fr) 72px !important;
}

.unyk-mobile-designer .unyk-topbar {
	height: 104px !important;
	min-height: 104px !important;
}

.unyk-mobile-designer .unyk-topbar-left {
	left: 12px !important;
	top: 12px !important;
	gap: 5px !important;
	padding: 4px !important;
}

.unyk-mobile-designer .unyk-topbar-right {
	right: 11px !important;
	top: 11px !important;
	gap: 8px !important;
}

.unyk-mobile-designer .unyk-topbar-title {
	left: 104px !important;
	right: 108px !important;
	top: 21px !important;
	font-size: 16px !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	left: 12px !important;
	right: 12px !important;
	bottom: 9px !important;
	padding: 5px !important;
	gap: 7px !important;
	border-radius: 18px !important;
}

.unyk-mobile-designer .unyk-orientation-btn {
	height: 33px !important;
	min-height: 33px !important;
	border-radius: 13px !important;
	padding: 0 7px !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer {
		grid-template-rows: 106px minmax(0, 1fr) 72px !important;
	}

	.unyk-mobile-designer .unyk-topbar {
		height: 106px !important;
		min-height: 106px !important;
	}

	.unyk-mobile-designer .unyk-topbar-left {
		left: 10px !important;
		top: 11px !important;
		gap: 4px !important;
		padding: 4px !important;
	}

	.unyk-mobile-designer .unyk-topbar-right {
		right: 9px !important;
		top: 10px !important;
		gap: 7px !important;
	}

	.unyk-mobile-designer .unyk-topbar-title {
		left: 96px !important;
		right: 96px !important;
		top: 20px !important;
		font-size: 13.5px !important;
		white-space: nowrap !important;
	}

	.unyk-mobile-designer .unyk-top-icon {
		width: 28px !important;
		min-width: 28px !important;
		height: 28px !important;
	}

	.unyk-mobile-designer .unyk-top-confirm {
		width: 40px !important;
		min-width: 40px !important;
		height: 34px !important;
	}

	.unyk-mobile-designer .unyk-orientation-tools {
		left: 9px !important;
		right: 9px !important;
		bottom: 9px !important;
		gap: 5px !important;
		padding: 5px !important;
	}

	.unyk-mobile-designer .unyk-orientation-btn {
		font-size: 9.8px !important;
		height: 32px !important;
		min-height: 32px !important;
		padding: 0 4px !important;
	}
}


/* V2.16 — extra verticale ruimte tussen bevestigknop en oriëntatiebalk */
.unyk-mobile-designer {
	grid-template-rows: 116px minmax(0, 1fr) 72px !important;
}

.unyk-mobile-designer .unyk-topbar {
	height: 116px !important;
	min-height: 116px !important;
}

.unyk-mobile-designer .unyk-topbar-left {
	top: 14px !important;
}

.unyk-mobile-designer .unyk-topbar-right {
	top: 13px !important;
}

.unyk-mobile-designer .unyk-topbar-title {
	top: 23px !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	bottom: 11px !important;
}

@media (max-width: 380px) {
	.unyk-mobile-designer {
		grid-template-rows: 116px minmax(0, 1fr) 72px !important;
	}

	.unyk-mobile-designer .unyk-topbar {
		height: 116px !important;
		min-height: 116px !important;
	}

	.unyk-mobile-designer .unyk-topbar-left {
		top: 13px !important;
	}

	.unyk-mobile-designer .unyk-topbar-right {
		top: 12px !important;
	}

	.unyk-mobile-designer .unyk-topbar-title {
		top: 22px !important;
	}

	.unyk-mobile-designer .unyk-orientation-tools {
		bottom: 11px !important;
	}
}


/* V2.40 CLEAN — tekstopties vervangen de onderbalk
   Doel: geen overlay over de plank, geen overlap met Templates/Tekst/Designs,
   en altijd de volledige plank zichtbaar houden tijdens tekst schuiven. */
.unyk-modal-inner.unyk-mobile-designer,
.unyk-mobile-designer {
	--unyk-text-toolbar-height: 148px;
}

.unyk-mobile-designer .unyk-text-options-sheet {
	display: none !important;
}

.unyk-text-options-open .unyk-mobile-designer {
	display: grid !important;
	grid-template-columns: 1fr !important;
	grid-template-rows: 116px minmax(0, 1fr) var(--unyk-text-toolbar-height) !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-topbar {
	grid-row: 1 !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-main-stage {
	grid-row: 2 !important;
	min-height: 0 !important;
	height: 100% !important;
	max-height: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	display: grid !important;
	place-items: center !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-canvas-wrap {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: 100% !important;
	display: grid !important;
	place-items: center !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-canvas {
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
}

/* Tijdens tekst bewerken vervangt deze toolbar de normale ondernavigatie. */
.unyk-text-options-open .unyk-mobile-designer .unyk-bottom-nav {
	display: none !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-subpanel {
	display: none !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-sheet:not(.is-hidden) {
	display: block !important;
	position: relative !important;
	grid-row: 3 !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	top: auto !important;
	z-index: 210 !important;
	width: 100% !important;
	height: var(--unyk-text-toolbar-height) !important;
	min-height: var(--unyk-text-toolbar-height) !important;
	max-height: var(--unyk-text-toolbar-height) !important;
	padding: 7px 12px 9px !important;
	margin: 0 !important;
	border: 1px solid rgba(120, 60, 54, .16) !important;
	border-bottom: 0 !important;
	border-radius: 16px 16px 0 0 !important;
	background: #fff !important;
	box-shadow: 0 -8px 22px rgba(0,0,0,.10) !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-mobile-designer .unyk-text-options-handle {
	width: 54px !important;
	height: 4px !important;
	border-radius: 999px !important;
	background: #cfc7c2 !important;
	margin: 0 auto 6px !important;
}

.unyk-mobile-designer .unyk-text-options-close {
	position: absolute !important;
	top: 9px !important;
	right: 10px !important;
	width: 26px !important;
	height: 26px !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: #f7efec !important;
	color: #8a3b35 !important;
	font-size: 18px !important;
	line-height: 1 !important;
	display: grid !important;
	place-items: center !important;
	padding: 0 !important;
	cursor: pointer !important;
}

.unyk-mobile-designer .unyk-text-options-body {
	height: calc(var(--unyk-text-toolbar-height) - 26px) !important;
	max-height: calc(var(--unyk-text-toolbar-height) - 26px) !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	-webkit-overflow-scrolling: touch !important;
	padding: 0 34px 4px 0 !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-text-options-body::-webkit-scrollbar {
	width: 4px !important;
}

.unyk-mobile-designer .unyk-text-options-body::-webkit-scrollbar-thumb {
	background: #d6c9c2 !important;
	border-radius: 999px !important;
}

.unyk-mobile-designer .unyk-text-options-toprow {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 52px !important;
	gap: 9px !important;
	align-items: end !important;
	margin: 0 0 7px !important;
	padding: 0 !important;
}

.unyk-mobile-designer .unyk-text-option-field {
	display: grid !important;
	gap: 4px !important;
	min-width: 0 !important;
	margin: 0 !important;
}

.unyk-mobile-designer .unyk-text-option-field > span {
	font-size: 11px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	color: #6f302c !important;
}

.unyk-mobile-designer .unyk-text-option-font select,
.unyk-mobile-designer .unyk-text-options-sheet .unyk-context-font {
	width: 100% !important;
	height: 34px !important;
	min-height: 34px !important;
	max-height: 34px !important;
	border-radius: 10px !important;
	border: 1px solid #ead8d1 !important;
	background: #fff !important;
	box-shadow: none !important;
	padding: 0 10px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	color: #2e2927 !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-text-toggle {
	width: 42px !important;
	height: 24px !important;
	min-width: 42px !important;
	min-height: 24px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: #c8c8c8 !important;
	padding: 2px !important;
	cursor: pointer !important;
	justify-self: start !important;
	transition: background .18s ease !important;
	box-shadow: none !important;
}

.unyk-mobile-designer .unyk-text-toggle span {
	display: block !important;
	width: 20px !important;
	height: 20px !important;
	border-radius: 50% !important;
	background: #fff !important;
	box-shadow: 0 1px 3px rgba(0,0,0,.20) !important;
	transition: transform .18s ease !important;
}

.unyk-mobile-designer .unyk-text-toggle.is-active {
	background: #87362f !important;
}

.unyk-mobile-designer .unyk-text-toggle.is-active span {
	transform: translateX(18px) !important;
}

.unyk-mobile-designer .unyk-text-option-align {
	padding: 0 !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-group {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0,1fr)) !important;
	gap: 8px !important;
	width: 100% !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-context-action {
	height: 32px !important;
	min-height: 32px !important;
	width: 100% !important;
	border-radius: 10px !important;
	border: 1px solid #ead8d1 !important;
	background: #fff !important;
	box-shadow: none !important;
	color: #6f302c !important;
	display: grid !important;
	place-items: center !important;
	padding: 0 !important;
	margin: 0 !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-context-action.is-active {
	background: #923d37 !important;
	border-color: #923d37 !important;
	color: #fff !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-icon {
	width: 20px !important;
	height: 20px !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
	fill: none !important;
	stroke-linecap: round !important;
}

.unyk-modal.unyk-crop-open .unyk-text-options-sheet {
	display: none !important;
	pointer-events: none !important;
}

@media (max-width: 380px) {
	.unyk-modal-inner.unyk-mobile-designer,
	.unyk-mobile-designer {
		--unyk-text-toolbar-height: 144px;
	}
	.unyk-text-options-open .unyk-mobile-designer {
		grid-template-rows: 116px minmax(0, 1fr) var(--unyk-text-toolbar-height) !important;
	}
	.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-sheet:not(.is-hidden) {
		padding-left: 9px !important;
		padding-right: 9px !important;
	}
	.unyk-mobile-designer .unyk-text-options-body {
		padding-right: 30px !important;
	}
}


/* V2.41 CLEAN — betrouwbare tekstballon + zichtbare teksttoolbar */
.unyk-mobile-designer.unyk-inline-text-open .unyk-inline-text-editor:not(.is-hidden) {
	display: flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	z-index: 10020 !important;
	pointer-events: auto !important;
}

.unyk-mobile-designer.unyk-inline-text-open .unyk-inline-text-input {
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-sheet:not(.is-hidden) {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
}

.unyk-text-options-open .unyk-mobile-designer .unyk-bottom-nav {
	display: none !important;
}


/* V2.42 — tekstballon schrijft door + automatische verkleining */
.unyk-inline-text-input {
	white-space: pre !important;
	word-break: normal !important;
	overflow-wrap: normal !important;
	overflow: hidden !important;
}

.unyk-inline-text-editor {
	box-sizing: border-box !important;
	max-width: calc(100% - 18px) !important;
}

.unyk-inline-text-editor .unyk-inline-text-input {
	box-sizing: border-box !important;
	max-width: none !important;
}

@media (max-width: 420px) {
	.unyk-inline-text-editor .unyk-inline-text-input {
		max-width: none !important;
	}
}


/* V2.43 — zoomknoppen naast de plank-ID + reset naar origineel */
.unyk-stage-plank-badge {
	grid-template-columns: auto minmax(0, 1fr) auto !important;
	align-items: center !important;
	gap: 7px !important;
	pointer-events: auto !important;
}

.unyk-stage-plank-badge .unyk-stage-plank-text {
	min-width: 0 !important;
	line-height: 1.08 !important;
	pointer-events: none !important;
}

.unyk-stage-plank-badge > span {
	grid-row: auto !important;
	pointer-events: none !important;
}

.unyk-stage-zoom-tools {
	display: inline-flex !important;
	align-items: center !important;
	gap: 3px !important;
	padding: 2px !important;
	border-radius: 999px !important;
	background: #f5efec !important;
	border: 1px solid #e5d4ce !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
	pointer-events: auto !important;
}

.unyk-stage-zoom-btn,
.unyk-stage-zoom-reset {
	appearance: none !important;
	-webkit-appearance: none !important;
	border: 0 !important;
	outline: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	cursor: pointer !important;
	font-family: inherit !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	color: #7e3633 !important;
	background: #fff !important;
}

.unyk-stage-zoom-btn {
	width: 24px !important;
	height: 24px !important;
	min-width: 24px !important;
	border-radius: 50% !important;
	font-size: 17px !important;
}

.unyk-stage-zoom-reset {
	height: 24px !important;
	min-width: 42px !important;
	padding: 0 7px !important;
	border-radius: 999px !important;
	font-size: 11px !important;
}

.unyk-stage-zoom-btn:active,
.unyk-stage-zoom-reset:active {
	transform: translateY(1px) !important;
}

@media (max-width: 520px) {
	.unyk-stage-plank-badge {
		padding: 6px 7px !important;
		gap: 6px !important;
		max-width: calc(100% - 16px) !important;
	}
	.unyk-stage-plank-badge strong {
		max-width: 150px !important;
	}
	.unyk-stage-plank-badge small {
		max-width: 150px !important;
	}
	.unyk-stage-zoom-tools {
		gap: 2px !important;
	}
	.unyk-stage-zoom-btn {
		width: 23px !important;
		height: 23px !important;
		min-width: 23px !important;
		font-size: 16px !important;
	}
	.unyk-stage-zoom-reset {
		height: 23px !important;
		min-width: 39px !important;
		padding: 0 6px !important;
		font-size: 10px !important;
	}
}

@media (max-width: 380px) {
	.unyk-stage-plank-badge strong,
	.unyk-stage-plank-badge small {
		max-width: 118px !important;
	}
}


/* V2.44 — zoom als losse ballon naast de plank-ID */
.unyk-stage-plank-badge {
	grid-template-columns: auto minmax(0, 1fr) !important;
	grid-template-rows: auto !important;
	max-width: min(300px, calc(100% - 132px)) !important;
	overflow: visible !important;
	pointer-events: none !important;
}

.unyk-stage-plank-badge .unyk-stage-plank-text {
	min-width: 0 !important;
	max-width: 100% !important;
}

.unyk-stage-plank-badge strong,
.unyk-stage-plank-badge small {
	max-width: 100% !important;
}

.unyk-stage-plank-badge .unyk-stage-zoom-tools {
	position: absolute !important;
	left: calc(100% + 8px) !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 3px !important;
	padding: 5px !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.96) !important;
	border: 1px solid rgba(0,0,0,.12) !important;
	box-shadow: 0 4px 14px rgba(0,0,0,.12) !important;
	pointer-events: auto !important;
	white-space: nowrap !important;
	z-index: 9 !important;
}

.unyk-stage-plank-badge .unyk-stage-zoom-btn,
.unyk-stage-plank-badge .unyk-stage-zoom-reset {
	background: #f7f1ee !important;
	color: #7e3633 !important;
}

.unyk-stage-plank-badge .unyk-stage-zoom-btn {
	width: 25px !important;
	height: 25px !important;
	min-width: 25px !important;
	font-size: 17px !important;
}

.unyk-stage-plank-badge .unyk-stage-zoom-reset {
	height: 25px !important;
	min-width: 44px !important;
	font-size: 10.5px !important;
	padding: 0 7px !important;
}

@media (max-width: 520px) {
	.unyk-stage-plank-badge {
		max-width: calc(100% - 124px) !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-tools {
		left: calc(100% + 7px) !important;
		padding: 4px !important;
		gap: 2px !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-btn {
		width: 24px !important;
		height: 24px !important;
		min-width: 24px !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-reset {
		height: 24px !important;
		min-width: 41px !important;
		font-size: 10px !important;
		padding: 0 6px !important;
	}
}

@media (max-width: 370px) {
	.unyk-stage-plank-badge {
		max-width: calc(100% - 112px) !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-tools {
		left: calc(100% + 5px) !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-btn {
		width: 22px !important;
		height: 22px !important;
		min-width: 22px !important;
		font-size: 15px !important;
	}
	.unyk-stage-plank-badge .unyk-stage-zoom-reset {
		height: 22px !important;
		min-width: 36px !important;
		font-size: 9px !important;
		padding: 0 5px !important;
	}
}

/* V2.45 — veilige 2-vinger zoom/pan, zonder losse zoomknoppen */
.unyk-stage-zoom-tools {
	display: none !important;
}

.unyk-stage-plank-badge {
	grid-template-columns: auto minmax(0, 1fr) !important;
	max-width: min(330px, calc(100% - 24px)) !important;
	pointer-events: none !important;
}

@media (max-width: 640px) {
	.unyk-mobile-designer .unyk-main-stage {
		touch-action: none !important;
		overscroll-behavior: contain !important;
		position: relative !important;
	}

	.unyk-mobile-designer .unyk-canvas {
		transform: translate3d(var(--unyk-canvas-pan-x, 0px), var(--unyk-canvas-pan-y, 0px), 0) scale(var(--unyk-canvas-zoom, 1)) !important;
		transform-origin: center center !important;
		will-change: transform !important;
	}

	.unyk-modal.unyk-gesture-zooming .unyk-main-stage::after {
		content: 'Zoommodus' !important;
		position: absolute !important;
		left: 50% !important;
		bottom: 14px !important;
		transform: translateX(-50%) !important;
		z-index: 80 !important;
		padding: 6px 12px !important;
		border-radius: 999px !important;
		background: rgba(50, 50, 50, .72) !important;
		color: #fff !important;
		font-size: 12px !important;
		font-weight: 800 !important;
		letter-spacing: .02em !important;
		pointer-events: none !important;
	}
}


/* V2.46 — vloeiende 2-vinger zoom + graveercirkel blijft gekoppeld */
@media (max-width: 640px) {
	.unyk-mobile-designer .unyk-canvas,
	.unyk-mobile-designer .unyk-engrave-guide {
		transition: none !important;
	}

	.unyk-modal.unyk-gesture-zooming .unyk-canvas,
	.unyk-modal.unyk-gesture-zooming .unyk-engrave-guide {
		transition: none !important;
		will-change: transform, left, top, width, height !important;
	}

	.unyk-modal.unyk-gesture-zooming .unyk-canvas {
		pointer-events: none !important;
	}
}

/* v2.47 - minimalistische onderbalk iconen */
.unyk-nav-btn > .unyk-nav-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 24px !important;
	height: 24px !important;
	line-height: 1 !important;
	font-size: 0 !important;
	flex: 0 0 24px !important;
}

.unyk-nav-btn > .unyk-nav-icon svg {
	display: block !important;
	width: 24px !important;
	height: 24px !important;
	overflow: visible !important;
}

.unyk-mobile-designer .unyk-nav-btn > .unyk-nav-icon,
.unyk-mobile-designer .unyk-nav-btn > .unyk-nav-icon svg {
	width: 22px !important;
	height: 22px !important;
}

.unyk-nav-btn > span:not(.unyk-nav-icon) {
	font-size: 23px !important;
	line-height: 1 !important;
}


/* v2.55 - frontend kleuren gestuurd vanuit Unyk Designer > Instellingen */
.unyk-designer-widget,
.unyk-modal,
.unyk-mobile-designer {
	color: var(--unyk-color-text, #1d2327) !important;
}

.unyk-modal {
	background: rgba(var(--unyk-front-overlay-rgb,0,0,0), .55) !important;
}

.unyk-modal-inner,
.unyk-mobile-designer {
	background: var(--unyk-front-modal, #ffffff) !important;
	color: var(--unyk-color-text, #1d2327) !important;
}

.unyk-modal-topbar,
.unyk-topbar,
.unyk-mobile-designer .unyk-topbar,
.unyk-conversion-designer .unyk-modal-topbar {
	background: var(--unyk-front-topbar, #7a302e) !important;
	color: var(--unyk-front-topbar-text, #ffffff) !important;
}

.unyk-modal-topbar button,
.unyk-mobile-designer .unyk-top-icon,
.unyk-mobile-designer .unyk-close-modal,
.unyk-mobile-designer .unyk-undo-btn,
.unyk-mobile-designer .unyk-redo-btn {
	color: var(--unyk-front-topbar-text, #ffffff) !important;
	background: rgba(var(--unyk-front-topbar-text-rgb,255,255,255), .12) !important;
}

/* Confirm / "klaar"-knop (desktop): groen (wit vlak, groene rand en vinkje). */
.unyk-modal-topbar .unyk-confirm-design,
.unyk-conversion-designer .unyk-modal-topbar .unyk-confirm-design,
.unyk-confirm-design {
	background: #ffffff !important;
	border: 3px solid #1f9d55 !important;
	color: #1f8f4d !important;
}

.unyk-canvas-wrap,
.unyk-main-stage,
.unyk-mobile-designer .unyk-canvas-wrap {
	background: var(--unyk-front-canvas-bg, #f6f6f6) !important;
}

.unyk-canvas,
.unyk-gallery-preview-img,
.unyk-main-design-preview,
.unyk-product-design-preview-main,
.unyk-safe-main-preview,
.woocommerce-product-gallery__image.unyk-design-main-image,
.unyk-cart-thumb-preview,
.unyk-checkout-inline-preview img {
	background: var(--unyk-front-canvas, #ffffff) !important;
}

.unyk-controls,
.unyk-subpanel,
.unyk-context-panel,
.unyk-text-options-sheet,
.unyk-mobile-designer .unyk-subpanel,
.unyk-mobile-designer .unyk-text-options-sheet,
.unyk-template-content-view,
.unyk-template-category-view {
	background: var(--unyk-front-panel, #ffffff) !important;
	color: var(--unyk-color-text, #1d2327) !important;
	border-color: var(--unyk-front-border, #ead6d6) !important;
}

.unyk-bottom-nav,
.unyk-mobile-designer .unyk-bottom-nav {
	background: var(--unyk-front-nav-bg, #ffffff) !important;
	border-color: var(--unyk-front-border, #ead6d6) !important;
}

.unyk-nav-btn,
.unyk-mobile-designer .unyk-nav-btn,
.unyk-nav-btn:focus,
.unyk-nav-btn:focus-visible,
.unyk-nav-btn:active {
	background: var(--unyk-front-nav-bg, #ffffff) !important;
	color: var(--unyk-front-nav-text, #7c4a46) !important;
}

.unyk-nav-btn.is-active,
.unyk-mobile-designer .unyk-nav-btn.is-active {
	background: rgba(var(--unyk-front-nav-active-rgb,217,150,76), .14) !important;
	color: var(--unyk-front-nav-active, #d9964c) !important;
}

.unyk-order-design {
	background: var(--unyk-front-status-bg, #fff8f8) !important;
	border-color: var(--unyk-front-border, #ead6d6) !important;
	color: var(--unyk-front-status-text, #7a302e) !important;
}

.unyk-linked-design-id,
.unyk-help,
.unyk-subpanel-note,
.unyk-template-content-head p,
.unyk-template-back-categories em {
	color: var(--unyk-color-muted, #646970) !important;
}

.unyk-stage-plank-badge,
.unyk-stage-zoom-tools,
.unyk-template-back-categories,
.unyk-template-current-category-title {
	background: rgba(var(--unyk-front-nav-active-rgb,217,150,76), .10) !important;
	border-color: var(--unyk-front-border, #ead6d6) !important;
	color: var(--unyk-front-status-text, #7a302e) !important;
}

.unyk-controls textarea,
.unyk-controls select,
.unyk-subpanel-field textarea,
.unyk-context-font,
.unyk-text-options-sheet select,
.unyk-inline-text-input {
	background: var(--unyk-front-canvas, #ffffff) !important;
	border-color: var(--unyk-front-border, #ead6d6) !important;
	color: var(--unyk-color-text, #1d2327) !important;
}

.unyk-context-action,
.unyk-bold-selected,
.unyk-align-btn,
.unyk-text-toggle,
.unyk-text-option-align .unyk-context-action,
.unyk-orientation-btn,
.unyk-template-filter-btn,
.unyk-startdesign-btn,
.unyk-design-category-btn,
.unyk-design-btn,
.unyk-upload-trigger,
.unyk-layer-row {
	border-color: var(--unyk-front-border, #ead6d6) !important;
	color: var(--unyk-color-text, #1d2327) !important;
}

.unyk-context-action.is-active,
.unyk-bold-selected.is-active,
.unyk-align-btn.is-active,
.unyk-text-toggle.is-active,
.unyk-text-option-align .unyk-context-action.is-active,
.unyk-orientation-btn.is-active,
.unyk-template-filter-btn.is-active,
.unyk-layer-row.is-active {
	background: rgba(var(--unyk-front-nav-active-rgb,217,150,76), .14) !important;
	border-color: var(--unyk-front-nav-active, #d9964c) !important;
	color: var(--unyk-front-nav-active, #d9964c) !important;
}

.unyk-engrave-guide {
	border-color: var(--unyk-front-engrave, #e85b48) !important;
	background: rgba(var(--unyk-front-engrave-rgb,232,91,72), .035) !important;
}

.unyk-crop-frame,
.unyk-upload-crop-frame,
.unyk-photo-helper,
.unyk-selected-image-frame {
	border-color: var(--unyk-front-photo-helper, #2f6df6) !important;
}

.unyk-resize-handle,
.unyk-rotate-handle,
.unyk-crop-handle,
.unyk-inline-text-editor .unyk-inline-text-confirm,
.unyk-mobile-designer .unyk-text-options-close {
	background: var(--unyk-front-handle, #2f6df6) !important;
	border-color: var(--unyk-front-handle, #2f6df6) !important;
	color: #fff !important;
}

.unyk-cart-disabled,
.unyk-cart-flow .single_add_to_cart_button.unyk-cart-disabled,
.unyk-cart-flow button[name="add-to-cart"].unyk-cart-disabled {
	background: var(--unyk-color-muted, #646970) !important;
	border-color: var(--unyk-color-muted, #646970) !important;
	color: var(--unyk-front-button-text, #ffffff) !important;
}

/* v2.96 - Klantdesigner visueel verfijnd zonder canvaswijzigingen */
.unyk-modal-inner.unyk-mobile-designer,
.unyk-mobile-designer {
	grid-template-rows: 106px minmax(0, 1fr) calc(72px + env(safe-area-inset-bottom, 0px)) !important;
}

.unyk-mobile-designer .unyk-topbar {
	height: 106px !important;
	min-height: 106px !important;
	padding: 0 !important;
	background: var(--unyk-front-topbar, #7a302e) !important;
	border-bottom: 1px solid rgba(0, 0, 0, .12) !important;
	box-shadow: none !important;
}

.unyk-mobile-designer .unyk-topbar-left,
.unyk-mobile-designer .unyk-topbar-right {
	top: 10px !important;
	gap: 6px !important;
}

.unyk-mobile-designer .unyk-topbar-left {
	left: 10px !important;
	padding: 3px !important;
	border: 1px solid rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .18) !important;
	border-radius: 10px !important;
	background: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .09) !important;
}

.unyk-mobile-designer .unyk-topbar-right {
	right: 10px !important;
}

.unyk-mobile-designer .unyk-topbar-title {
	left: 94px !important;
	right: 100px !important;
	top: 13px !important;
	font-size: 16px !important;
	line-height: 1.12 !important;
	letter-spacing: 0 !important;
}

.unyk-mobile-designer .unyk-topbar-title > span {
	display: block !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-designer-instruction {
	margin-top: 3px !important;
	font-size: 10px !important;
	font-weight: 600 !important;
	line-height: 1.15 !important;
	color: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .8) !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-top-icon,
.unyk-mobile-designer .unyk-close-modal,
.unyk-mobile-designer .unyk-undo-btn,
.unyk-mobile-designer .unyk-redo-btn {
	width: 32px !important;
	min-width: 32px !important;
	height: 32px !important;
	padding: 0 !important;
	border: 1px solid transparent !important;
	border-radius: 8px !important;
	background: transparent !important;
	box-shadow: none !important;
	opacity: 1 !important;
}

.unyk-mobile-designer .unyk-top-icon:hover,
.unyk-mobile-designer .unyk-top-icon:active,
.unyk-mobile-designer .unyk-top-icon:focus-visible {
	border-color: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .18) !important;
	background: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .12) !important;
}

.unyk-mobile-designer .unyk-top-confirm {
	width: 46px !important;
	min-width: 46px !important;
	height: 40px !important;
	border: 1px solid #178a4a !important;
	border-radius: 10px !important;
	box-shadow: 0 3px 9px rgba(0, 0, 0, .16) !important;
	background: #1f9d55 !important;
}

.unyk-mobile-designer .unyk-top-confirm::before {
	width: 21px !important;
	height: 21px !important;
}

.unyk-mobile-designer .unyk-orientation-tools {
	left: 10px !important;
	right: 10px !important;
	bottom: 8px !important;
	padding: 3px !important;
	gap: 4px !important;
	border: 1px solid rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .24) !important;
	border-radius: 11px !important;
	background: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .1) !important;
	box-shadow: none !important;
}

.unyk-mobile-designer .unyk-orientation-btn {
	height: 32px !important;
	min-height: 32px !important;
	padding: 0 6px !important;
	border: 1px solid transparent !important;
	border-radius: 8px !important;
	background: transparent !important;
	color: rgba(var(--unyk-front-topbar-text-rgb, 255, 255, 255), .86) !important;
	font-size: 11.5px !important;
	font-weight: 750 !important;
	letter-spacing: 0 !important;
}

.unyk-mobile-designer .unyk-orientation-btn.is-active {
	border-color: rgba(0, 0, 0, .06) !important;
	background: var(--unyk-front-canvas, #ffffff) !important;
	color: var(--unyk-front-topbar, #7a302e) !important;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .13) !important;
	font-weight: 850 !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge {
	top: 8px !important;
	left: 10px !important;
	grid-template-columns: 30px minmax(0, 1fr) !important;
	gap: 8px !important;
	max-width: min(360px, calc(100% - 20px)) !important;
	padding: 6px 9px !important;
	border: 1px solid var(--unyk-front-border, #ead6d6) !important;
	border-radius: 9px !important;
	background: rgba(255, 255, 255, .95) !important;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .09) !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge > .unyk-stage-plank-mark {
	grid-row: auto !important;
	width: 30px !important;
	min-width: 30px !important;
	height: 30px !important;
	border-radius: 7px !important;
	background: var(--unyk-front-topbar, #7a302e) !important;
	color: var(--unyk-front-topbar-text, #ffffff) !important;
	font-size: 9px !important;
	font-weight: 900 !important;
	letter-spacing: 0 !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge > .unyk-stage-plank-mark::after {
	content: none !important;
}

.unyk-mobile-designer .unyk-stage-plank-text {
	min-width: 0 !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge strong {
	max-width: 100% !important;
	font-size: 13px !important;
	font-weight: 850 !important;
	line-height: 1.15 !important;
	color: var(--unyk-color-text, #1d2327) !important;
}

.unyk-mobile-designer .unyk-stage-plank-badge small {
	max-width: 100% !important;
	margin-top: 2px !important;
	font-size: 9.5px !important;
	font-weight: 600 !important;
	line-height: 1.1 !important;
	color: var(--unyk-color-muted, #646970) !important;
}

.unyk-mobile-designer .unyk-engrave-guide {
	border-width: 1.5px !important;
	border-style: dashed !important;
	border-color: var(--unyk-front-engrave, #e85b48) !important;
	background: rgba(var(--unyk-front-engrave-rgb, 232, 91, 72), .018) !important;
	opacity: .76 !important;
}

.unyk-mobile-designer .unyk-bottom-nav {
	display: flex !important;
	align-items: stretch !important;
	min-height: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
	padding: 5px 4px max(7px, env(safe-area-inset-bottom, 0px)) !important;
	border-top: 1px solid var(--unyk-front-border, #ead6d6) !important;
	background: var(--unyk-front-nav-bg, #ffffff) !important;
	box-shadow: 0 -4px 14px rgba(0, 0, 0, .045) !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer .unyk-nav-btn,
.unyk-mobile-designer .unyk-nav-btn:focus,
.unyk-mobile-designer .unyk-nav-btn:active {
	position: relative !important;
	display: flex !important;
	flex: 1 1 0 !important;
	min-width: 0 !important;
	min-height: 58px !important;
	align-items: center !important;
	justify-content: center !important;
	flex-direction: column !important;
	gap: 3px !important;
	padding: 6px 2px 5px !important;
	border: 0 !important;
	border-radius: 7px !important;
	background: var(--unyk-front-nav-bg, #ffffff) !important;
	color: var(--unyk-front-nav-text, #7c4a46) !important;
	box-shadow: none !important;
}

.unyk-mobile-designer .unyk-nav-btn > .unyk-nav-icon,
.unyk-mobile-designer .unyk-nav-btn > .unyk-nav-icon svg {
	width: 23px !important;
	height: 23px !important;
}

.unyk-mobile-designer .unyk-nav-btn strong {
	max-width: 100% !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;
	letter-spacing: 0 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.unyk-mobile-designer .unyk-nav-btn.is-active {
	background: rgba(var(--unyk-front-nav-active-rgb, 217, 150, 76), .11) !important;
	color: var(--unyk-front-nav-active, #d9964c) !important;
	box-shadow: inset 0 3px 0 var(--unyk-front-nav-active, #d9964c) !important;
}

.unyk-mobile-designer .unyk-nav-btn:focus-visible {
	outline: 2px solid var(--unyk-front-nav-active, #d9964c) !important;
	outline-offset: -2px !important;
}

@media (max-width: 380px) {
	.unyk-modal-inner.unyk-mobile-designer,
	.unyk-mobile-designer {
		grid-template-rows: 104px minmax(0, 1fr) calc(70px + env(safe-area-inset-bottom, 0px)) !important;
	}

	.unyk-mobile-designer .unyk-topbar {
		height: 104px !important;
		min-height: 104px !important;
	}

	.unyk-mobile-designer .unyk-topbar-title {
		left: 88px !important;
		right: 91px !important;
		top: 14px !important;
		font-size: 14px !important;
	}

	.unyk-mobile-designer .unyk-designer-instruction {
		font-size: 9px !important;
	}

	.unyk-mobile-designer .unyk-topbar-left,
	.unyk-mobile-designer .unyk-topbar-right {
		top: 9px !important;
	}

	.unyk-mobile-designer .unyk-top-icon,
	.unyk-mobile-designer .unyk-close-modal,
	.unyk-mobile-designer .unyk-undo-btn,
	.unyk-mobile-designer .unyk-redo-btn {
		width: 29px !important;
		min-width: 29px !important;
		height: 29px !important;
	}

	.unyk-mobile-designer .unyk-top-confirm {
		width: 41px !important;
		min-width: 41px !important;
		height: 36px !important;
	}

	.unyk-mobile-designer .unyk-orientation-btn {
		font-size: 10px !important;
		padding: 0 3px !important;
	}

	.unyk-mobile-designer .unyk-stage-plank-badge {
		left: 8px !important;
		max-width: calc(100% - 16px) !important;
	}

	.unyk-mobile-designer .unyk-nav-btn strong {
		font-size: 10.5px !important;
	}
}

/* v2.97 - Uitlijniconen zichtbaar en uitsnijdselectie helder */
.unyk-mobile-designer .unyk-text-option-align {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-group {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 8px !important;
	width: 100% !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-btn {
	display: grid !important;
	place-items: center !important;
	min-width: 0 !important;
	height: 34px !important;
	min-height: 34px !important;
	padding: 0 !important;
	border: 1px solid var(--unyk-front-border, #ead6d6) !important;
	border-radius: 8px !important;
	background: var(--unyk-front-canvas, #ffffff) !important;
	color: var(--unyk-front-status-text, #7a302e) !important;
	visibility: visible !important;
	opacity: 1 !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-btn.is-active {
	border-color: var(--unyk-front-nav-active, #d9964c) !important;
	background: rgba(var(--unyk-front-nav-active-rgb, 217, 150, 76), .14) !important;
	color: var(--unyk-front-nav-active, #d9964c) !important;
	box-shadow: inset 0 0 0 1px var(--unyk-front-nav-active, #d9964c) !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-icon {
	display: block !important;
	width: 21px !important;
	height: 21px !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
	visibility: visible !important;
	opacity: 1 !important;
	overflow: visible !important;
}

.unyk-mobile-designer .unyk-text-option-align .unyk-align-icon path {
	display: block !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
	visibility: visible !important;
	opacity: 1 !important;
	vector-effect: non-scaling-stroke !important;
}

.unyk-mobile-designer .unyk-crop-stage {
	background: #171b19 !important;
}

.unyk-mobile-designer .unyk-crop-canvas {
	border: 1px solid rgba(255, 255, 255, .12) !important;
	background: #171b19 !important;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2) !important;
}

/* v2.98 - Teksttoolbar volledige hoogte en graveerzone stabiel */
.unyk-modal.unyk-text-options-open .unyk-modal-inner.unyk-mobile-designer {
	--unyk-text-toolbar-height: calc(150px + env(safe-area-inset-bottom, 0px));
	grid-template-rows: 106px minmax(0, 1fr) var(--unyk-text-toolbar-height) !important;
}

.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-sheet:not(.is-hidden) {
	display: block !important;
	height: var(--unyk-text-toolbar-height) !important;
	min-height: var(--unyk-text-toolbar-height) !important;
	max-height: var(--unyk-text-toolbar-height) !important;
	padding: 7px 12px max(9px, env(safe-area-inset-bottom, 0px)) !important;
	overflow: hidden !important;
}

.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-body {
	display: grid !important;
	grid-template-rows: auto auto !important;
	align-content: start !important;
	gap: 0 !important;
	height: calc(var(--unyk-text-toolbar-height) - 25px) !important;
	max-height: calc(var(--unyk-text-toolbar-height) - 25px) !important;
	padding: 0 34px 2px 0 !important;
	overflow: hidden !important;
}

.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-toprow {
	margin-bottom: 7px !important;
}

.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-option-align {
	display: grid !important;
	grid-template-rows: auto 34px !important;
	gap: 4px !important;
	min-height: 49px !important;
}

.unyk-mobile-designer .unyk-engrave-guide {
	box-sizing: border-box !important;
	transition: none !important;
	will-change: left, top, width, height !important;
}

@media (max-width: 380px) {
	.unyk-modal.unyk-text-options-open .unyk-modal-inner.unyk-mobile-designer {
		--unyk-text-toolbar-height: calc(148px + env(safe-area-inset-bottom, 0px));
		grid-template-rows: 104px minmax(0, 1fr) var(--unyk-text-toolbar-height) !important;
	}

	.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-sheet:not(.is-hidden) {
		padding-left: 9px !important;
		padding-right: 9px !important;
	}

	.unyk-modal.unyk-text-options-open .unyk-mobile-designer .unyk-text-options-body {
		padding-right: 30px !important;
	}
}

/* v2.99 - Bijsnijder fullscreen binnen de designer met zoom */
.unyk-modal-inner.unyk-mobile-designer,
.unyk-mobile-designer {
	position: relative !important;
}

.unyk-mobile-designer > .unyk-crop-modal {
	position: absolute !important;
	inset: 0 !important;
	z-index: 10050 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	padding: 0 !important;
	background: #111513 !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-mobile-designer > .unyk-crop-modal.is-hidden {
	display: none !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-card {
	display: grid !important;
	grid-template-rows: auto minmax(0, 1fr) auto !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: #111513 !important;
	box-shadow: none !important;
	overflow: hidden !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto !important;
	grid-template-rows: auto auto !important;
	align-items: center !important;
	column-gap: 16px !important;
	row-gap: 4px !important;
	padding: 13px 16px !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
	background: #1a201d !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > div:first-child {
	grid-column: 1 !important;
	grid-row: 1 !important;
	font-size: 18px !important;
	font-weight: 850 !important;
	line-height: 1.15 !important;
	color: #ffffff !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > small {
	grid-column: 1 !important;
	grid-row: 2 !important;
	max-width: 680px !important;
	margin: 0 !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	color: rgba(255, 255, 255, .68) !important;
}

.unyk-crop-zoom-tools {
	grid-column: 2 !important;
	grid-row: 1 / span 2 !important;
	display: grid !important;
	grid-template-columns: 38px 64px 38px !important;
	gap: 5px !important;
	align-items: center !important;
	padding: 4px !important;
	border: 1px solid rgba(255, 255, 255, .14) !important;
	border-radius: 9px !important;
	background: rgba(255, 255, 255, .07) !important;
}

.unyk-crop-zoom-tools button {
	display: grid !important;
	place-items: center !important;
	min-width: 0 !important;
	height: 36px !important;
	margin: 0 !important;
	padding: 0 8px !important;
	border: 1px solid rgba(255, 255, 255, .11) !important;
	border-radius: 6px !important;
	background: rgba(255, 255, 255, .09) !important;
	color: #ffffff !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	box-shadow: none !important;
	cursor: pointer !important;
}

.unyk-crop-zoom-tools .unyk-crop-zoom-reset {
	font-size: 12px !important;
}

.unyk-crop-zoom-tools button:hover,
.unyk-crop-zoom-tools button:focus-visible {
	border-color: rgba(255, 255, 255, .28) !important;
	background: rgba(255, 255, 255, .16) !important;
}

.unyk-crop-zoom-tools button:disabled {
	opacity: .38 !important;
	cursor: default !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-stage {
	display: grid !important;
	place-items: center !important;
	min-width: 0 !important;
	min-height: 0 !important;
	padding: 12px !important;
	border: 0 !important;
	background:
		linear-gradient(45deg, rgba(255, 255, 255, .025) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .025) 75%),
		linear-gradient(45deg, rgba(255, 255, 255, .025) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .025) 75%),
		#111513 !important;
	background-position: 0 0, 12px 12px !important;
	background-size: 24px 24px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-canvas {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	margin: auto !important;
	border: 1px solid rgba(255, 255, 255, .15) !important;
	border-radius: 8px !important;
	background: #090b0a !important;
	box-shadow: 0 12px 36px rgba(0, 0, 0, .34) !important;
	object-fit: contain !important;
	touch-action: none !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-actions {
	display: grid !important;
	grid-template-columns: minmax(120px, .55fr) minmax(150px, 1fr) !important;
	gap: 10px !important;
	padding: 11px 14px max(11px, env(safe-area-inset-bottom, 0px)) !important;
	border-top: 1px solid rgba(255, 255, 255, .1) !important;
	background: #1a201d !important;
	box-sizing: border-box !important;
}

/* v3.05 - rustige, duidelijke bediening van de fotobewerker */
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto !important;
	grid-template-rows: auto auto !important;
	gap: 12px 14px !important;
	padding: 14px 16px 12px !important;
	background: #171d1a !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading {
	grid-column: 1 !important;
	grid-row: 1 !important;
	min-width: 0 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading > div {
	color: #ffffff !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading > small {
	display: block !important;
	margin-top: 4px !important;
	color: rgba(255, 255, 255, .66) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions {
	grid-column: 2 !important;
	grid-row: 1 !important;
	display: grid !important;
	grid-template-columns: 42px 42px !important;
	gap: 8px !important;
	align-self: start !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions .unyk-crop-cancel,
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions .unyk-crop-apply {
	display: grid !important;
	place-items: center !important;
	width: 42px !important;
	min-width: 42px !important;
	height: 42px !important;
	min-height: 42px !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 50% !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions .unyk-crop-cancel {
	border: 1px solid rgba(255, 255, 255, .12) !important;
	background: rgba(255, 255, 255, .08) !important;
	color: #ffffff !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions .unyk-crop-apply {
	border: 1px solid #20a574 !important;
	background: #20a574 !important;
	color: #ffffff !important;
	box-shadow: 0 5px 14px rgba(32, 165, 116, .22) !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
	grid-column: 1 / -1 !important;
	grid-row: 2 !important;
	display: grid !important;
	grid-template-columns: 44px minmax(72px, 1fr) 44px !important;
	gap: 6px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 4px !important;
	border: 1px solid rgba(255, 255, 255, .12) !important;
	border-radius: 8px !important;
	background: rgba(255, 255, 255, .045) !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools button {
	height: 38px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: rgba(255, 255, 255, .08) !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools .unyk-crop-zoom-reset {
	background: transparent !important;
	color: rgba(255, 255, 255, .88) !important;
	font-size: 12px !important;
}

@media (max-width: 560px) {
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
		grid-template-columns: minmax(0, 1fr) auto !important;
		grid-template-rows: auto auto !important;
		padding: 12px !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading,
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions,
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
		grid-column: auto !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading {
		grid-column: 1 !important;
		grid-row: 1 !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions {
		grid-column: 2 !important;
		grid-row: 1 !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
		grid-column: 1 / -1 !important;
		grid-row: 2 !important;
		grid-template-columns: 44px minmax(72px, 1fr) 44px !important;
		margin-top: 0 !important;
	}
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-cancel,
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-apply {
	width: 100% !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border-radius: 8px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-cancel {
	border-color: rgba(255, 255, 255, .16) !important;
	background: rgba(255, 255, 255, .08) !important;
	color: #ffffff !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-apply {
	border-color: #1f9d70 !important;
	background: #1f9d70 !important;
	color: #ffffff !important;
}

@media (max-width: 560px) {
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
		grid-template-columns: 1fr !important;
		grid-template-rows: auto auto auto !important;
		padding: 10px 12px !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > div:first-child,
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > small,
	.unyk-crop-zoom-tools {
		grid-column: 1 !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > div:first-child {
		grid-row: 1 !important;
		font-size: 16px !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head > small {
		grid-row: 2 !important;
	}

	.unyk-crop-zoom-tools {
		grid-row: 3 !important;
		grid-template-columns: 40px minmax(70px, 1fr) 40px !important;
		margin-top: 5px !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-stage {
		padding: 8px !important;
	}
}

/* v3.00 - directe uploadflow en bediening van de fullscreen bijsnijder */
.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-stage {
	position: relative !important;
}

.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-stage::before {
	content: "Foto voorbereiden...";
	position: absolute;
	inset: 50% auto auto 50%;
	transform: translate(-50%, -50%);
	padding-top: 48px;
	color: #ffffff;
	font-size: 14px;
	font-weight: 750;
	white-space: nowrap;
}

.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-stage::after {
	content: "";
	position: absolute;
	top: calc(50% - 25px);
	left: calc(50% - 16px);
	width: 28px;
	height: 28px;
	border: 3px solid rgba(255, 255, 255, .22);
	border-top-color: #27b47e;
	border-radius: 50%;
	animation: unyk-crop-loading .75s linear infinite;
}

.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-canvas {
	opacity: 0 !important;
}

.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-apply,
.unyk-mobile-designer > .unyk-crop-modal.is-loading .unyk-crop-zoom-tools {
	pointer-events: none !important;
	opacity: .35 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-canvas {
	cursor: grab !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-canvas:active {
	cursor: grabbing !important;
}

@keyframes unyk-crop-loading {
	to { transform: rotate(360deg); }
}

/* v3.02 - afronden in de kop, zonder losse bijsnijdstap */
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-card {
	grid-template-rows: auto minmax(0, 1fr) !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
	grid-template-columns: 36px 60px 36px 36px 42px !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools .unyk-crop-cancel,
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools .unyk-crop-apply {
	display: grid !important;
	place-items: center !important;
	width: 100% !important;
	min-width: 0 !important;
	height: 36px !important;
	min-height: 36px !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 6px !important;
	font-size: 18px !important;
	line-height: 1 !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools .unyk-crop-cancel {
	border-color: rgba(255, 255, 255, .13) !important;
	background: rgba(255, 255, 255, .08) !important;
	color: #ffffff !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools .unyk-crop-apply {
	border-color: #1f9d70 !important;
	background: #1f9d70 !important;
	color: #ffffff !important;
}

@media (max-width: 560px) {
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
		grid-template-columns: 36px minmax(54px, 1fr) 36px 36px 42px !important;
	}
}

/* v3.03 - het fotocanvas vult de beschikbare fullscreen werkruimte */
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-stage {
	display: block !important;
	padding: 0 !important;
	background: #090b0a !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-canvas {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	box-sizing: border-box !important;
}

/* v3.05 definitieve plaatsing na oudere mobiele cropregels */
.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
	grid-template-columns: minmax(0, 1fr) auto !important;
	grid-template-rows: auto auto !important;
	gap: 12px 14px !important;
	padding: 14px 16px 12px !important;
}

.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
	grid-column: 1 / -1 !important;
	grid-row: 2 !important;
	grid-template-columns: 44px minmax(72px, 1fr) 44px !important;
	margin: 0 !important;
}

@media (max-width: 560px) {
	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head {
		grid-template-columns: minmax(0, 1fr) auto !important;
		grid-template-rows: auto auto !important;
		padding: 12px !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-heading {
		grid-column: 1 !important;
		grid-row: 1 !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-head-actions {
		grid-column: 2 !important;
		grid-row: 1 !important;
	}

	.unyk-mobile-designer > .unyk-crop-modal .unyk-crop-zoom-tools {
		grid-column: 1 / -1 !important;
		grid-row: 2 !important;
		grid-template-columns: 44px minmax(72px, 1fr) 44px !important;
		margin: 0 !important;
	}
}

/* v3.06 - herstelbare meldingen in de designer */
.unyk-mobile-designer > .unyk-designer-notice {
	position: absolute !important;
	top: max(12px, env(safe-area-inset-top, 0px)) !important;
	left: 50% !important;
	z-index: 11000 !important;
	width: max-content !important;
	max-width: calc(100% - 24px) !important;
	padding: 11px 14px !important;
	border: 1px solid rgba(255, 255, 255, .14) !important;
	border-radius: 8px !important;
	background: #242a27 !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	text-align: left !important;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .3) !important;
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translate(-50%, -10px) !important;
	transition: opacity .18s ease, transform .18s ease !important;
	box-sizing: border-box !important;
}

.unyk-mobile-designer > .unyk-designer-notice.is-visible {
	opacity: 1 !important;
	transform: translate(-50%, 0) !important;
}

.unyk-mobile-designer > .unyk-designer-notice.is-error {
	border-color: #d86868 !important;
	background: #4b2426 !important;
}

.unyk-mobile-designer > .unyk-designer-notice.is-warning {
	border-color: #d6a24f !important;
	background: #47351c !important;
}

.unyk-mobile-designer > .unyk-designer-notice.is-success {
	border-color: #32a979 !important;
	background: #183e30 !important;
}

.unyk-confirm-design.is-loading {
	opacity: .65 !important;
	cursor: wait !important;
}

.unyk-crop-apply.is-loading {
	opacity: .65 !important;
	cursor: wait !important;
}

/* v3.21 - compacte fallback-preview direct bij het betreffende winkelwagenproduct */
body .unyk-cart-js-preview {
	width: 132px !important;
	min-width: 132px !important;
	max-width: 132px !important;
	margin: 9px 0 0 !important;
	padding: 6px !important;
	box-sizing: border-box !important;
}

body .unyk-cart-js-preview img {
	display: block !important;
	width: 118px !important;
	min-width: 118px !important;
	max-width: 118px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	object-fit: contain !important;
}