/**
 * Advent Calendar Pro - Animations
 * Beautiful, smooth animations for door opening effects
 */

/* Animation Style: Flip */
.animation-flip .acp-door.is-opened .acp-door-front {
    transform: rotateY(-180deg);
}

.animation-flip .acp-door.is-opened .acp-door-back {
    transform: rotateY(0);
}

.animation-flip .acp-door-front,
.animation-flip .acp-door-back {
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
}

/* Animation Style: Slide */
.animation-slide .acp-door-front {
    transform-origin: left center;
}

.animation-slide .acp-door.is-opened .acp-door-front {
    transform: translateX(-100%);
    opacity: 0;
}

.animation-slide .acp-door-back {
    transform: translateX(100%);
    opacity: 0;
}

.animation-slide .acp-door.is-opened .acp-door-back {
    transform: translateX(0);
    opacity: 1;
}

/* Animation Style: Fade */
.animation-fade .acp-door.is-opened .acp-door-front {
    opacity: 0;
    transform: scale(0.8);
}

.animation-fade .acp-door-back {
    transform: scale(1.2);
    opacity: 0;
}

.animation-fade .acp-door.is-opened .acp-door-back {
    transform: scale(1);
    opacity: 1;
}

/* Animation Style: Zoom */
.animation-zoom .acp-door.is-opened .acp-door-front {
    transform: scale(2);
    opacity: 0;
}

.animation-zoom .acp-door-back {
    transform: scale(0);
    opacity: 0;
}

.animation-zoom .acp-door.is-opened .acp-door-back {
    transform: scale(1);
    opacity: 1;
}

/* Animation Style: Bounce */
.animation-bounce .acp-door.is-opened .acp-door-front {
    animation: bounceOut 0.6s ease forwards;
}

.animation-bounce .acp-door-back {
    transform: scale(0);
    opacity: 0;
}

.animation-bounce .acp-door.is-opened .acp-door-back {
    animation: bounceIn 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.3s forwards;
}

@keyframes bounceOut {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.2);
        opacity: 1;
    }
    100% {
        transform: scale(0);
        opacity: 0;
    }
}

@keyframes bounceIn {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Animation Style: Shake */
.animation-shake .acp-door.is-opening .acp-door-front {
    animation: shake 0.5s ease-in-out;
}

.animation-shake .acp-door.is-opened .acp-door-front {
    animation: shakeAndFade 0.8s ease forwards;
}

.animation-shake .acp-door-back {
    transform: rotateZ(-5deg) scale(0.9);
    opacity: 0;
}

.animation-shake .acp-door.is-opened .acp-door-back {
    animation: shakeReveal 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.4s forwards;
}

@keyframes shake {
    0%, 100% { transform: translateX(0) rotate(0); }
    10% { transform: translateX(-5px) rotate(-2deg); }
    20% { transform: translateX(5px) rotate(2deg); }
    30% { transform: translateX(-5px) rotate(-2deg); }
    40% { transform: translateX(5px) rotate(2deg); }
    50% { transform: translateX(-3px) rotate(-1deg); }
    60% { transform: translateX(3px) rotate(1deg); }
    70% { transform: translateX(-2px) rotate(0); }
    80% { transform: translateX(2px) rotate(0); }
    90% { transform: translateX(-1px) rotate(0); }
}

@keyframes shakeAndFade {
    0%, 50% {
        opacity: 1;
    }
    100% {
        transform: scale(0.5) rotate(10deg);
        opacity: 0;
    }
}

@keyframes shakeReveal {
    from {
        transform: rotateZ(-5deg) scale(0.9);
        opacity: 0;
    }
    to {
        transform: rotateZ(0) scale(1);
        opacity: 1;
    }
}

/* Snow Effect */
.acp-snow-container {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.acp-snowflake {
    position: absolute;
    top: -20px;
    color: white;
    font-size: 1em;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
    animation: snowfall linear infinite;
    opacity: 0.8;
}

@keyframes snowfall {
    0% {
        transform: translateY(0) rotate(0deg);
    }
    100% {
        transform: translateY(calc(100vh + 40px)) rotate(360deg);
    }
}

/* Confetti Animation */
.confetti-piece {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    left: 50%;
    animation: confetti-fall 3s ease-out forwards;
    transform-origin: center center;
}

@keyframes confetti-fall {
    0% {
        transform: translate(0, 0) rotate(0deg);
        opacity: 1;
    }
    100% {
        transform: translate(var(--x), var(--y)) rotate(720deg);
        opacity: 0;
    }
}

/* Door Hover Effects */
.acp-door.is-available {
    cursor: pointer;
}

.acp-door.is-available .acp-door-front::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, transparent 40%, rgba(255, 255, 255, 0.1) 50%, transparent 60%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.acp-door.is-available:hover .acp-door-front::after {
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    20% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translateX(100%);
    }
}

/* Staggered Entrance Animation */
.acp-calendar-grid .acp-door {
    opacity: 0;
    transform: translateY(30px);
    animation: doorEntrance 0.5s ease forwards;
}

@keyframes doorEntrance {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Generate staggered delays */
.acp-door:nth-child(1) { animation-delay: 0.05s; }
.acp-door:nth-child(2) { animation-delay: 0.1s; }
.acp-door:nth-child(3) { animation-delay: 0.15s; }
.acp-door:nth-child(4) { animation-delay: 0.2s; }
.acp-door:nth-child(5) { animation-delay: 0.25s; }
.acp-door:nth-child(6) { animation-delay: 0.3s; }
.acp-door:nth-child(7) { animation-delay: 0.35s; }
.acp-door:nth-child(8) { animation-delay: 0.4s; }
.acp-door:nth-child(9) { animation-delay: 0.45s; }
.acp-door:nth-child(10) { animation-delay: 0.5s; }
.acp-door:nth-child(11) { animation-delay: 0.55s; }
.acp-door:nth-child(12) { animation-delay: 0.6s; }
.acp-door:nth-child(13) { animation-delay: 0.65s; }
.acp-door:nth-child(14) { animation-delay: 0.7s; }
.acp-door:nth-child(15) { animation-delay: 0.75s; }
.acp-door:nth-child(16) { animation-delay: 0.8s; }
.acp-door:nth-child(17) { animation-delay: 0.85s; }
.acp-door:nth-child(18) { animation-delay: 0.9s; }
.acp-door:nth-child(19) { animation-delay: 0.95s; }
.acp-door:nth-child(20) { animation-delay: 1s; }
.acp-door:nth-child(21) { animation-delay: 1.05s; }
.acp-door:nth-child(22) { animation-delay: 1.1s; }
.acp-door:nth-child(23) { animation-delay: 1.15s; }
.acp-door:nth-child(24) { animation-delay: 1.2s; }

/* Pulse Glow for Today */
.acp-door.is-today .acp-door-front {
    animation: todayGlow 2s ease-in-out infinite;
}

@keyframes todayGlow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(244, 208, 63, 0.3),
                    0 10px 40px rgba(0, 0, 0, 0.3);
    }
    50% {
        box-shadow: 0 0 40px rgba(244, 208, 63, 0.6),
                    0 10px 40px rgba(0, 0, 0, 0.3);
    }
}

/* Modal Animations */
.acp-modal-content {
    animation: modalPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes modalPop {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Coupon Code Animation */
.acp-coupon-code {
    animation: couponReveal 0.8s ease-out 0.3s both;
}

@keyframes couponReveal {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Success Animation */
.acp-copy-coupon.copied {
    animation: successPulse 0.5s ease;
}

@keyframes successPulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .acp-snowflake {
        display: none;
    }
}