/* =====================================================================
   Holiday Addons · Halloween (calabaza Jack-o'-lantern)
   Diseño propio en SVG. Compatible con temas que usan ::before/::after
   en cabeceras (Titan, Titan Navy, Overdrive): las decoraciones son
   elementos propios, nunca pseudo-elementos del tema.
   ===================================================================== */
:root {
	--ityhw-orange: #ff8a1f;
	--ityhw-glow: rgb(255 140 30 / .55);
	--ityhw-purple: #a78bfa;
}

/* Guirnalda superior */
#ityHw-garland {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 84px;
	background: var(--ityhw-garland) repeat-x 0 0 / 218px 84px;
	pointer-events: none;
	z-index: 9;
	filter: drop-shadow(0 6px 10px rgb(0 0 0 / .35));
}

/* Niebla baja */
#ityHw-fog {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 200%;
	height: 150px;
	pointer-events: none;
	z-index: 8;
	opacity: .55;
	background:
		radial-gradient(40% 70% at 12% 100%, rgb(190 180 220 / .30), transparent 70%),
		radial-gradient(35% 60% at 38% 100%, rgb(160 150 200 / .22), transparent 70%),
		radial-gradient(40% 70% at 62% 100%, rgb(190 180 220 / .30), transparent 70%),
		radial-gradient(35% 60% at 88% 100%, rgb(160 150 200 / .22), transparent 70%);
	animation: ityHwFog 48s linear infinite;
}
@keyframes ityHwFog { to { transform: translateX(-50%); } }

/* Murciélagos */
#ityHw-bats {
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
	z-index: 9;
}

/* Calabaza que asoma en las cabeceras de caja */
.ityHw-peek {
	position: absolute;
	right: 38px;
	bottom: 4px;
	width: 30px;
	height: 28px;
	background: var(--ityhw-pumpkin) no-repeat center / contain;
	pointer-events: none;
	z-index: 2;
	filter: drop-shadow(0 0 8px var(--ityhw-glow));
	animation: ityHwBob 4.5s ease-in-out infinite;
}
.ityHw-host { position: relative; }
@keyframes ityHwBob { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-2px) rotate(3deg); } }

/* Telaraña en la esquina de los widgets laterales */
.ityHw-web {
	position: absolute;
	top: 0;
	right: 0;
	width: 58px;
	height: 58px;
	background: var(--ityhw-web) no-repeat center / contain;
	transform: scaleX(-1);
	pointer-events: none;
	z-index: 2;
	opacity: .8;
}
[data-ips-scheme="light"] .ityHw-web { filter: invert(.75); opacity: .55; }

/* Botón sorpresa: Jack-o'-lantern */
#ityHw-egg {
	position: fixed;
	left: 20px;
	bottom: 20px;
	width: 74px;
	height: 70px;
	border: 0;
	padding: 0;
	cursor: pointer;
	background: var(--ityhw-pumpkin) no-repeat center / contain;
	z-index: 9;
	filter: drop-shadow(0 0 14px var(--ityhw-glow));
	animation: ityHwBob 3.2s ease-in-out infinite;
	transition: transform .2s;
}
#ityHw-egg:hover { transform: scale(1.08); }
#ityHw-egg:focus-visible { outline: 3px solid var(--ityhw-orange); outline-offset: 4px; border-radius: 50%; }
#ityHw-egg.is-laughing { animation: ityHwLaugh .45s ease-in-out 3; }
@keyframes ityHwLaugh { 0%, 100% { transform: scale(1) rotate(0); } 25% { transform: scale(1.15) rotate(-8deg); } 75% { transform: scale(1.15) rotate(8deg); } }

/* Mensaje */
#ityHw-msg {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(.9);
	z-index: 20;
	pointer-events: none;
	opacity: 0;
	transition: opacity .6s ease, transform .6s ease;
	font-size: clamp(34px, 7vw, 76px);
	font-weight: 800;
	letter-spacing: .04em;
	text-align: center;
	white-space: nowrap;
	color: #ffd9a8;
	text-shadow: 0 0 10px var(--ityhw-orange), 0 0 24px var(--ityhw-orange), 0 0 48px rgb(255 90 0 / .8), 0 0 90px rgb(124 58 237 / .7);
}
#ityHw-msg.is-visible { opacity: 1; transform: translate(-50%, -50%) scale(1); }

@media (max-width: 767px) {
	#ityHw-garland { height: 70px; background-size: 182px 70px; }
	#ityHw-egg { width: 56px; height: 54px; left: 12px; bottom: 12px; }
	.ityHw-peek { right: 30px; width: 24px; height: 22px; }
}

@media (prefers-reduced-motion: reduce) {
	#ityHw-fog, .ityHw-peek, #ityHw-egg { animation: none; }
}

/* ---------- Escena nocturna gótica (luna, colinas, árboles en espiral, cementerio) ---------- */
#ityHw-sky {
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(90rem 40rem at 80% -10%, rgb(124 58 237 / .16), transparent 70%);
}
#ityHw-moon {
	position: fixed;
	top: 90px;
	right: 6vw;
	width: clamp(110px, 14vw, 210px);
	aspect-ratio: 1;
	z-index: -1;
	pointer-events: none;
	background: var(--ityhw-moon) no-repeat center / contain;
	opacity: .9;
}
#ityHw-skyline {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	height: clamp(140px, 22vh, 260px);
	z-index: -1;
	pointer-events: none;
	background: var(--ityhw-skyline) no-repeat center bottom / cover;
	opacity: .95;
}
[data-ips-scheme="light"] #ityHw-moon { opacity: .55; }
[data-ips-scheme="light"] #ityHw-skyline { opacity: .35; }

/* Fantasmas que cruzan despacio por detrás del contenido */
.ityHw-ghost {
	position: fixed;
	left: -90px;
	width: 54px;
	height: 68px;
	z-index: -1;
	pointer-events: none;
	background: var(--ityhw-ghost) no-repeat center / contain;
	opacity: .45;
	animation: ityHwGhost linear infinite, ityHwFloat 3.4s ease-in-out infinite;
}
@keyframes ityHwGhost { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 180px)); } }
@keyframes ityHwFloat { 0%, 100% { margin-top: 0; } 50% { margin-top: -14px; } }
@media (prefers-reduced-motion: reduce) {
	.ityHw-ghost { display: none; }
}