/**
 * LiveComponent Transitions
 * CSS transitions for DOM swap operations
 */

/* Fade transition */
.lc-transition-fade {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.lc-transition-fade.lc-transition-active {
    opacity: 1;
}

/* Slide transition */
.lc-transition-slide {
    transform: translateY(-20px);
    opacity: 0;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.lc-transition-slide.lc-transition-active {
    transform: translateY(0);
    opacity: 1;
}

/* Slide down transition */
.lc-transition-slide-down {
    transform: translateY(-20px);
    opacity: 0;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.lc-transition-slide-down.lc-transition-active {
    transform: translateY(0);
    opacity: 1;
}

/* Slide up transition */
.lc-transition-slide-up {
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.lc-transition-slide-up.lc-transition-active {
    transform: translateY(0);
    opacity: 1;
}

/* Loading indicator active state */
.lc-indicator-active {
    opacity: 1;
    pointer-events: none;
}

/* Loading state for boosted links/forms */
a.lc-loading,
form.lc-loading {
    opacity: 0.6;
    pointer-events: none;
    cursor: wait;
}