/**
 * Seasonal effects - 4 mùa Xuân Hạ Thu Đông (trang id)
 * Áp dụng cho cả trang đăng nhập và toàn bộ trang trong account (Cập Nhật Thông Tin, Donate, ...)
 */
#snow-canvas,
#seasonal-canvas {
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	width: 100vw;
	height: 100vh;
	z-index: 9998; /* dưới #loadingOverlay 9999, trên sidebar 1000 */
}

.santa-wrap {
	position: fixed;
	top: 70px;
	left: 0;
	display: flex;
	align-items: center;
	pointer-events: none;
	z-index: 2147483645;
	transform: translateX(-120%);
	animation: seasonal-fly linear forwards;
	will-change: transform;
}

.santa-img {
	width: 120px;
	height: auto;
	margin-right: 10px;
}

.santa-banner {
	background: linear-gradient(135deg, #c62828, #b71c1c);
	color: #fff;
	padding: 6px 14px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: bold;
	white-space: nowrap;
	box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

.tet-wrap {
	position: fixed;
	left: 0;
	display: flex;
	align-items: center;
	pointer-events: none;
	z-index: 2147483645;
	transform: translateX(-120%);
	animation: seasonal-fly linear forwards;
	will-change: transform;
}

.tet-banner {
	background: linear-gradient(135deg, #e91e63, #c2185b);
	color: #fff;
	padding: 8px 16px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: bold;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(233,30,99,.4);
}

@keyframes seasonal-fly {
	from { transform: translateX(-120%); }
	to { transform: translateX(120vw); }
}

.seasonal-fall,
.gift {
	position: fixed;
	top: -40px;
	font-size: 22px;
	pointer-events: none;
	z-index: 2147483644;
	animation-name: seasonal-fall;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
}

.tet-item { font-size: 24px; }
.summer-item { font-size: 22px; }
.autumn-item { font-size: 22px; }

@keyframes seasonal-fall {
	from { transform: translateY(0); }
	to { transform: translateY(110vh); }
}
