/**
 * Text List with Animation Widget Styles
 */

.pretpot-text-list-animation {
    position: relative;
    overflow: hidden;
}

.pretpot-text-list-item {
    opacity: 0;
    transform: translateX(var(--slide-offset, -100px));
    transition: opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: opacity, transform;
}

/* Direction controls animation origin ONLY - NOT alignment */
.pretpot-text-list-animation[data-direction="left"] .pretpot-text-list-item {
    --slide-offset: -100px;
}

.pretpot-text-list-animation[data-direction="right"] .pretpot-text-list-item {
    --slide-offset: 100px;
}

/* Visible State */
.pretpot-text-list-item.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* Exit State - opposite direction */
.pretpot-text-list-item.is-exit {
    opacity: 0;
    transform: translateX(calc(var(--slide-offset) * -1));
}

/* Fade Animation */
.pretpot-text-list-animation[data-animation="fade"] .pretpot-text-list-item {
    --slide-offset: 0;
    transform: translateY(30px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.pretpot-text-list-animation[data-animation="fade"] .pretpot-text-list-item.is-visible {
    transform: translateY(0);
}

.pretpot-text-list-animation[data-animation="fade"] .pretpot-text-list-item.is-exit {
    transform: translateY(-30px);
}

/* Responsive */
@media (max-width: 768px) {
    .pretpot-text-list-item {
        --slide-offset: -60px;
    }
    
    .pretpot-text-list-animation[data-direction="right"] .pretpot-text-list-item {
        --slide-offset: 60px;
    }
}