/**
 * EB Global - Shared Text Animation Classes
 *
 * Used by Hero Slider, Core Values, Testimonials widgets.
 * Apply [data-text-animation] or [data-animation] attributes.
 *
 * @package EB_Global_Widgets
 */

/* Base: hidden state for animated elements */
.eb-text-anim {
    opacity: 0;
}

.eb-text-anim.animated {
    animation-fill-mode: both;
}

/* Fade In */
@keyframes ebFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.eb-text-anim.animated[data-anim="fadeIn"] {
    animation-name: ebFadeIn;
}

/* Fade In Up */
@keyframes ebFadeInUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}
.eb-text-anim.animated[data-anim="fadeInUp"] {
    animation-name: ebFadeInUp;
}

/* Fade In Down */
@keyframes ebFadeInDown {
    from { opacity: 0; transform: translateY(-24px); }
    to { opacity: 1; transform: translateY(0); }
}
.eb-text-anim.animated[data-anim="fadeInDown"] {
    animation-name: ebFadeInDown;
}

/* Fade In Left */
@keyframes ebFadeInLeft {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}
.eb-text-anim.animated[data-anim="fadeInLeft"] {
    animation-name: ebFadeInLeft;
}

/* Fade In Right */
@keyframes ebFadeInRight {
    from { opacity: 0; transform: translateX(30px); }
    to { opacity: 1; transform: translateX(0); }
}
.eb-text-anim.animated[data-anim="fadeInRight"] {
    animation-name: ebFadeInRight;
}

/* Zoom In */
@keyframes ebZoomIn {
    from { opacity: 0; transform: scale(0.85); }
    to { opacity: 1; transform: scale(1); }
}
.eb-text-anim.animated[data-anim="zoomIn"] {
    animation-name: ebZoomIn;
}

/* Slide In Up (no fade, just slide) */
@keyframes ebSlideInUp {
    from { opacity: 0; transform: translateY(100%); }
    to { opacity: 1; transform: translateY(0); }
}
.eb-text-anim.animated[data-anim="slideInUp"] {
    animation-name: ebSlideInUp;
}

/* Flip In X */
@keyframes ebFlipInX {
    from { opacity: 0; transform: perspective(400px) rotateX(90deg); }
    to { opacity: 1; transform: perspective(400px) rotateX(0); }
}
.eb-text-anim.animated[data-anim="flipInX"] {
    animation-name: ebFlipInX;
}

/* Flip In Y */
@keyframes ebFlipInY {
    from { opacity: 0; transform: perspective(400px) rotateY(90deg); }
    to { opacity: 1; transform: perspective(400px) rotateY(0); }
}
.eb-text-anim.animated[data-anim="flipInY"] {
    animation-name: ebFlipInY;
}

/* Typewriter effect (used differently via JS) */
.eb-text-anim[data-anim="typewriter"] {
    opacity: 1;
    overflow: hidden;
    white-space: nowrap;
    border-right: 2px solid currentColor;
    width: 0;
}

.eb-text-anim.animated[data-anim="typewriter"] {
    animation: ebTypewriter var(--anim-duration, 600ms) steps(40, end) forwards,
               ebBlink 0.75s step-end infinite;
}

@keyframes ebTypewriter {
    from { width: 0; }
    to { width: 100%; }
}

@keyframes ebBlink {
    from, to { border-color: transparent; }
    50% { border-color: currentColor; }
}
