/* DOMcommerce: front end + editor canvas */
.domc { box-sizing: border-box; }
.domc.domc-clip { overflow: hidden; }

/* Neon glow (rack-aisle style) */
.domc.domc-glow {
	--domc-s: var(--domc-glow-size, 14px);
	--domc-c: var(--domc-glow-color, #00A550);
	box-shadow:
		0 0 calc(var(--domc-s) * .5) color-mix(in srgb, var(--domc-c) 90%, transparent),
		0 0 var(--domc-s) color-mix(in srgb, var(--domc-c) 70%, transparent),
		0 0 calc(var(--domc-s) * 2.5) color-mix(in srgb, var(--domc-c) 40%, transparent),
		inset 0 0 calc(var(--domc-s) * .6) color-mix(in srgb, var(--domc-c) 25%, transparent);
}

/* Quantum Array: rainbow gradient border + multi-color glow */
.domc.domc-q-border { position: relative; }
.domc.domc-q-border::before {
	content: "";
	position: absolute;
	inset: calc(var(--domc-bw, 2px) * -1);
	padding: var(--domc-bw, 2px);
	border-radius: inherit;
	background: linear-gradient(135deg, #E4202C, #F7931E, #FFF200, #00A550, #405585, #91268F);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	pointer-events: none;
}
.domc.domc-glow.domc-q-glow {
	--domc-s: var(--domc-glow-size, 14px);
	box-shadow:
		calc(var(--domc-s) * -.35) 0 var(--domc-s) #E4202C,
		calc(var(--domc-s) * .35) 0 var(--domc-s) #405585,
		0 calc(var(--domc-s) * -.35) var(--domc-s) #F7931E,
		0 calc(var(--domc-s) * .35) var(--domc-s) #00A550,
		0 0 calc(var(--domc-s) * 2.5) rgba(145, 38, 143, .45);
}

/* Pulse */
.domc.domc-glow.domc-pulse { animation: domc-pulse 2.4s ease-in-out infinite; }
.domc.domc-glow.domc-q-glow.domc-pulse { animation-name: domc-pulse-q; }
@keyframes domc-pulse {
	0%, 100% { box-shadow:
		0 0 calc(var(--domc-s) * .3) color-mix(in srgb, var(--domc-c) 70%, transparent),
		0 0 calc(var(--domc-s) * .6) color-mix(in srgb, var(--domc-c) 50%, transparent),
		0 0 calc(var(--domc-s) * 1.5) color-mix(in srgb, var(--domc-c) 25%, transparent),
		inset 0 0 calc(var(--domc-s) * .3) color-mix(in srgb, var(--domc-c) 15%, transparent); }
	50% { box-shadow:
		0 0 calc(var(--domc-s) * .6) var(--domc-c),
		0 0 calc(var(--domc-s) * 1.3) color-mix(in srgb, var(--domc-c) 85%, transparent),
		0 0 calc(var(--domc-s) * 3) color-mix(in srgb, var(--domc-c) 50%, transparent),
		inset 0 0 calc(var(--domc-s) * .9) color-mix(in srgb, var(--domc-c) 35%, transparent); }
}
@keyframes domc-pulse-q {
	0%, 100% { box-shadow:
		calc(var(--domc-s) * -.2) 0 calc(var(--domc-s) * .6) #E4202C,
		calc(var(--domc-s) * .2) 0 calc(var(--domc-s) * .6) #405585,
		0 calc(var(--domc-s) * -.2) calc(var(--domc-s) * .6) #F7931E,
		0 calc(var(--domc-s) * .2) calc(var(--domc-s) * .6) #00A550; }
	50% { box-shadow:
		calc(var(--domc-s) * -.5) 0 calc(var(--domc-s) * 1.4) #E4202C,
		calc(var(--domc-s) * .5) 0 calc(var(--domc-s) * 1.4) #405585,
		0 calc(var(--domc-s) * -.5) calc(var(--domc-s) * 1.4) #F7931E,
		0 calc(var(--domc-s) * .5) calc(var(--domc-s) * 1.4) #00A550,
		0 0 calc(var(--domc-s) * 3) rgba(145, 38, 143, .5); }
}
@media (prefers-reduced-motion: reduce) {
	.domc.domc-glow.domc-pulse { animation: none; }
}
