/* Decor Box – floral decoration layer (shared) */

/*
 * Clipping layer. Doubled class beats widget rules such as
 * `.dbw-pkg__card > *` that would otherwise make it position: relative.
 */
.dbw-deco-clip.dbw-deco-clip {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	border-radius: inherit;
	pointer-events: none;
}

/*
 * Single-class specificity on purpose: Elementor writes the panel values as
 * `.elementor-element-xyz .dbw-deco--id`, which must always win. Defaults
 * therefore live in var() fallbacks, never as declared custom properties.
 */
.dbw-deco {
	position: absolute;
	z-index: 0;
	display: block;
	/* Panel value first, then the inline fallback written by PHP, then a default */
	width: var(--dbw-deco-w, var(--dbw-deco-w-d, 70%));
	aspect-ratio: var(--dbw-deco-ratio, var(--dbw-deco-ratio-d, 3 / 4));
	opacity: var(--dbw-deco-o, var(--dbw-deco-o-d, .14));
	pointer-events: none;
	transform: translate(
		calc(var(--dbw-bx, 0%) + var(--dbw-deco-x, var(--dbw-deco-x-d, 0%)) * var(--dbw-dx, 1)),
		calc(var(--dbw-by, 0%) + var(--dbw-deco-y, var(--dbw-deco-y-d, 0%)) * var(--dbw-dy, 1))
	);
}

.dbw-deco__art {
	display: block;
	width: 100%;
	height: 100%;
	transform: scaleX(var(--dbw-mirror, 1)) rotate(var(--dbw-deco-rot, var(--dbw-deco-rot-d, 0deg))) scaleX(var(--dbw-deco-flip, var(--dbw-deco-flip-d, 1)));
	transition: scale .9s cubic-bezier(.22,.61,.36,1), rotate .9s cubic-bezier(.22,.61,.36,1);
}

/* Tint: the artwork becomes a stencil filled with one color */
.dbw-deco-mode-tint .dbw-deco__art {
	background-color: var(--dbw-deco-color, var(--dbw-deco-color-d, #7F9473));
	-webkit-mask-image: var(--dbw-deco-url, var(--dbw-deco-src));
	mask-image: var(--dbw-deco-url, var(--dbw-deco-src));
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.dbw-deco-mode-original .dbw-deco__art {
	background-image: var(--dbw-deco-url, var(--dbw-deco-src));
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

/*
 * Inline SVG artwork (the bundled floral). No mask and no image request:
 * the strokes simply take the tint color.
 */
.dbw-deco__art--inline.dbw-deco__art--inline {
	-webkit-mask-image: none;
	mask-image: none;
	background: none;
	color: var(--dbw-deco-color, var(--dbw-deco-color-d, #7F9473));
}

.dbw-deco__svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

/* Anchors. --dbw-dx / --dbw-dy point "outward" so Push Outward always crops past the nearest edge. */
.dbw-deco-pos-top-left      { top: 0;    left: 0;                              --dbw-dx: -1; --dbw-dy: -1; }
.dbw-deco-pos-top-center    { top: 0;    left: 50%;   --dbw-bx: -50%;          --dbw-dx: 1;  --dbw-dy: -1; }
.dbw-deco-pos-top-right     { top: 0;    right: 0;                             --dbw-dx: 1;  --dbw-dy: -1; }
.dbw-deco-pos-center-left   { top: 50%;  left: 0;                 --dbw-by: -50%; --dbw-dx: -1; --dbw-dy: 1; }
.dbw-deco-pos-center        { top: 50%;  left: 50%;   --dbw-bx: -50%; --dbw-by: -50%; --dbw-dx: 1; --dbw-dy: 1; }
.dbw-deco-pos-center-right  { top: 50%;  right: 0;                --dbw-by: -50%; --dbw-dx: 1;  --dbw-dy: 1; }
.dbw-deco-pos-bottom-left   { bottom: 0; left: 0;                              --dbw-dx: -1; --dbw-dy: 1; }
.dbw-deco-pos-bottom-center { bottom: 0; left: 50%;   --dbw-bx: -50%;          --dbw-dx: 1;  --dbw-dy: 1; }
.dbw-deco-pos-bottom-right  { bottom: 0; right: 0;                             --dbw-dx: 1;  --dbw-dy: 1; }

/* Alternate Sides: every second item shows a mirror image */
.dbw-deco.is-mirrored { --dbw-mirror: -1; }

/* Motion */
.dbw-deco-motion-sway .dbw-deco__art {
	animation: dbw-deco-sway 9s ease-in-out infinite;
}

@keyframes dbw-deco-sway {
	0%, 100% { rotate: -2.5deg; }
	50%      { rotate: 2.5deg; }
}

.dbw-deco-host:hover .dbw-deco-motion-grow .dbw-deco__art  { scale: 1.08; }
.dbw-deco-host:hover .dbw-deco-motion-turn .dbw-deco__art  { rotate: 8deg; }
.dbw-deco-host:hover .dbw-deco-motion-bloom .dbw-deco__art { scale: 1.08; rotate: 6deg; }

@media (prefers-reduced-motion: reduce) {
	.dbw-deco__art {
		animation: none !important;
		transition: none !important;
	}
}