/**
 * Custom Animations for Exodus Game
 * These animations enhance the Exodus experience without overriding engine animations
 */

/* Exodus-specific animations - make sure they don't conflict with camera animations */
@keyframes exodus-scroll-glow {
    0% { box-shadow: 0 0 10px rgba(139, 69, 19, 0.3); }
    50% { box-shadow: 0 0 20px rgba(139, 69, 19, 0.5); }
    100% { box-shadow: 0 0 10px rgba(139, 69, 19, 0.3); }
}

@keyframes exodus-shimmer {
    0% { opacity: 0.7; }
    50% { opacity: 1; }
    100% { opacity: 0.7; }
}

/* Special effects for divine elements */
.divine-element {
    animation: exodus-shimmer 3s infinite;
}

/* Desert sand particles animation */
@keyframes exodus-sand-drift {
    0% { transform: translateX(0) translateY(0); }
    25% { transform: translateX(10px) translateY(-5px); }
    50% { transform: translateX(20px) translateY(0); }
    75% { transform: translateX(10px) translateY(5px); }
    100% { transform: translateX(0) translateY(0); }
}

.sand-particle {
    position: absolute;
    width: 3px;
    height: 3px;
    background-color: rgba(210, 180, 140, 0.6);
    border-radius: 50%;
    pointer-events: none;
    animation: exodus-sand-drift 8s infinite ease-in-out;
}

/* When a resource is depleted animation */
@keyframes exodus-resource-depletion {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.2); opacity: 0.7; background-color: rgba(255, 0, 0, 0.3); }
    100% { transform: scale(1); opacity: 1; }
}

.resource-depleted {
    animation: exodus-resource-depletion 1.5s;
}

/**
 * Add background transition animation for direct changes
 * When not using scene animations, we still want a nice transition effect
 */
.smooth-bg-transition {
    transition: background-image 1.5s ease-in-out !important;
}

/* Add scroll effect animation for game container */
.game-container {
    transition: opacity 0.5s ease-in-out;
}

.game-container.transitioning {
    opacity: 0;
}

/* Add a subtle fade-in for content */
.exodus-content .stage-content {
    animation: content-fade-in 0.8s ease-in-out;
}

@keyframes content-fade-in {
    0% { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* Ensure scene animations work properly by explicitly importing engine animation classes */
/* These classes will take priority over any exodus styles */
.scene-container .camera-pan-left,
.scene-container .camera-pan-right,
.scene-container .camera-pan-up,
.scene-container .camera-pan-down,
.scene-container .camera-zoom-in,
.scene-container .camera-zoom-out,
.scene-container .camera-fade-in,
.scene-container .camera-fade-out,
.scene-container .camera-zoom-in-from-left,
.scene-container .camera-zoom-in-from-right {
    /* Higher specificity ensures these animations work */
    animation-duration: 4s !important;
    animation-timing-function: ease-out !important;
    animation-fill-mode: forwards !important;
}