/* Dycode Jungle Background — layer styles.
   Positions/sizes of scene elements are set by frontend.js (responsive);
   this file only holds structural / shared rules. */

.dycode-jungle-host { position: relative; }

/* Keep container content above the scene when placed "behind". */
.dycode-jungle-host.dj-behind > :not(.dycode-jungle-bg) { position: relative; z-index: 1; }

.dycode-jungle-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	line-height: 0;
}
.dycode-jungle-host.dj-behind .dycode-jungle-bg { z-index: 0; }
.dycode-jungle-host.dj-cover  .dycode-jungle-bg { z-index: 5; }

.dycode-jungle-bg .dj-layer {
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	will-change: transform, opacity, background-position;
	transform-origin: 50% 50%;
}

.dycode-jungle-bg .dj-bg {
	position: absolute;
	inset: 0;
	background-position: 50% 100%;
	background-size: cover;
}

.dycode-jungle-bg .dj-rain {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.dycode-jungle-bg .dj-totem      { background-size: 100% 100%; }
.dycode-jungle-bg .dj-totem-bird { background-repeat: no-repeat; overflow: hidden; }
.dycode-jungle-bg .dj-totem-grass{ background-size: 100% 100%; }

.dycode-jungle-bg .dj-branch { background-size: 100% 100%; }

.dycode-jungle-bg .dj-flying-bird       { overflow: hidden; }
.dycode-jungle-bg .dj-flying-bird__wing { position: absolute; inset: 0; background-repeat: no-repeat; }

.dycode-jungle-bg .dj-tiki      { background-size: contain; background-position: 50% 100%; }
.dycode-jungle-bg .dj-tiki-glow {
	background: radial-gradient(ellipse at center, rgba(255, 214, 120, 0.55) 0%, rgba(255, 214, 120, 0) 65%);
	opacity: 0;
}

.dycode-jungle-bg .dj-light { background-size: contain; opacity: 0; }
.dycode-jungle-bg .dj-dust  { opacity: 0; }