.kfi-floating-wrapper {
	position: relative;
	width: 100%;
	height: 500px;
	overflow: hidden;
	pointer-events: none;
}

/* Full Page coverage: fixed overlay spanning the entire browser viewport,
   independent of where the widget sits in the page and independent of
   scroll position. Place the widget anywhere on the page — it detaches
   visually and floats over everything. */
.kfi-floating-wrapper.kfi-fullpage {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 2;
	overflow: hidden;
}

.kfi-floating-wrapper.kfi-click-through {
	pointer-events: none;
}

/* Rarely used: blocks clicks to whatever is underneath the overlay. */
.kfi-floating-wrapper.kfi-click-block {
	pointer-events: auto;
}

.kfi-icon-item {
	position: absolute;
	bottom: -15%;
	display: inline-block;
	line-height: 1;
	will-change: transform, opacity;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-fill-mode: both;
	pointer-events: none;
}

.kfi-icon-inner {
	display: inline-block;
	line-height: 1;
}

.kfi-icon-item svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.kfi-icon-item img.kfi-icon-inner {
	display: block;
	max-width: none;
}

.kfi-icon-item.kfi-rotate > i,
.kfi-icon-item.kfi-rotate > svg {
	display: inline-block;
	animation: kfi-continuous-spin 6s linear infinite;
}

/* Direction: Float Up (rises from bottom to top, gentle sway) */
.kfi-direction-float-up .kfi-icon-item {
	bottom: -10%;
	animation-name: kfi-float-up;
}
@keyframes kfi-float-up {
	0%   { transform: translate(0, 0) rotate(0deg); opacity: 0; }
	10%  { opacity: 1; }
	90%  { opacity: 1; }
	100% { transform: translate(var(--kfi-drift-x, 20px), -120vh) rotate(15deg); opacity: 0; }
}

/* Direction: Float Down (falls from top to bottom, like confetti) */
.kfi-direction-float-down .kfi-icon-item {
	top: -10%;
	bottom: auto;
	animation-name: kfi-float-down;
}
@keyframes kfi-float-down {
	0%   { transform: translate(0, 0) rotate(0deg); opacity: 0; }
	10%  { opacity: 1; }
	90%  { opacity: 1; }
	100% { transform: translate(var(--kfi-drift-x, 20px), 120vh) rotate(-15deg); opacity: 0; }
}

/* Direction: Drift Left (moves horizontally, gentle vertical bob) */
.kfi-direction-drift-left .kfi-icon-item {
	top: 40%;
	animation-name: kfi-drift-left;
}
@keyframes kfi-drift-left {
	0%   { transform: translate(120%, 0); opacity: 0; }
	10%  { opacity: 1; }
	50%  { transform: translate(0%, -20px); }
	90%  { opacity: 1; }
	100% { transform: translate(-120%, 0); opacity: 0; }
}

/* Direction: Drift Right */
.kfi-direction-drift-right .kfi-icon-item {
	top: 40%;
	animation-name: kfi-drift-right;
}
@keyframes kfi-drift-right {
	0%   { transform: translate(-120%, 0); opacity: 0; }
	10%  { opacity: 1; }
	50%  { transform: translate(0%, 20px); }
	90%  { opacity: 1; }
	100% { transform: translate(120%, 0); opacity: 0; }
}

/* Direction: Diagonal (rises while drifting sideways) */
.kfi-direction-diagonal .kfi-icon-item {
	bottom: -10%;
	animation-name: kfi-diagonal;
}
@keyframes kfi-diagonal {
	0%   { transform: translate(0, 0) rotate(0deg); opacity: 0; }
	10%  { opacity: 1; }
	90%  { opacity: 1; }
	100% { transform: translate(var(--kfi-drift-x, 150px), -118vh) rotate(25deg); opacity: 0; }
}

/* Direction: Random Wander (organic multi-point path) */
.kfi-direction-random .kfi-icon-item {
	bottom: -10%;
	animation-name: kfi-random-wander;
}
@keyframes kfi-random-wander {
	0%   { transform: translate(0, 0) rotate(0deg); opacity: 0; }
	10%  { opacity: 1; }
	25%  { transform: translate(calc(var(--kfi-drift-x, 30px) * 1), -28vh) rotate(8deg); }
	50%  { transform: translate(calc(var(--kfi-drift-x, 30px) * -1), -56vh) rotate(-8deg); }
	75%  { transform: translate(calc(var(--kfi-drift-x, 30px) * 0.6), -84vh) rotate(10deg); }
	90%  { opacity: 1; }
	100% { transform: translate(0, -116vh) rotate(0deg); opacity: 0; }
}

@keyframes kfi-continuous-spin {
	0%   { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.kfi-icon-item {
		animation: none !important;
		opacity: 0.6 !important;
		bottom: 10%;
	}
}