/**
 * TNC Tet Decoration - Frontend CSS
 * Version: 1.2.0
 */

/* ===== ANIMATION HOA/TUYẾT RƠI ===== */
@keyframes tetFlower {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    25% {
        transform: translate(calc(var(--sway) * -1), 30vh) rotate(180deg);
    }
    50% {
        transform: translate(var(--sway), 60vh) rotate(360deg);
    }
    75% {
        transform: translate(calc(var(--sway) * -1), 90vh) rotate(540deg);
    }
    100% {
        transform: translate(0, 120vh) rotate(720deg);
    }
}

/* ===== TRANG TRÍ HAI BÊN ===== */
.tet-decoration-left img,
.tet-decoration-right img {
    width: calc((100vw - 1250px) / 2);
    height: auto;
}

.tet-decoration-left,
.tet-decoration-right {
    position: fixed;
    top: 0;
    z-index: 9999;
    pointer-events: none;
}

.tet-decoration-left {
    left: 0;
    width: calc((100vw - 1250px) / 2.8);
}

.tet-decoration-right {
    right: 0;
    width: calc((100vw - 1250px) / 2.8);
}

/* ===== HOA/TUYẾT RƠI ===== */
.tet-flower,
.tet-snow {
    position: fixed;
    pointer-events: none;
    z-index: 99;
}

.tet-flower img,
.tet-snow img {
    display: block;
}

/* ===== PHÁO HOA OVERLAY ===== */
#newyear-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    pointer-events: none;
}

#fireworks {
    position: absolute;
    width: 100%;
    height: 100%;
}

#ny-text {
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(28px, 5vw, 64px);
    font-weight: 800;
    color: #fff;
    white-space: nowrap;
    text-shadow: 0 0 20px rgba(255,215,0,.9);
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
}