/**
 * Aurora for Elementor — Base Styles
 *
 * Provides the resets and visual helpers needed for the animations to
 * work correctly on the frontend.
 *
 * @package Aurora
 * @version 1.0.0
 */

/* ─── Global reset for animated units ─────────────────────────────────────── */

.aurora-char,
.aurora-word,
.aurora-line {
    display: inline-block;
    will-change: transform, opacity;
    /* Prevents text collapse when manipulating transform */
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Line wrapper: overflow hidden for clip/mask effects */
.aurora-line-wrap {
    overflow: hidden;
    display: block;
    line-height: inherit;
}

/* ─── Perspective for 3D animations ──────────────────────────────────────── */

[data-aurora-animation="gs-5"] .elementor-widget-container,
[data-aurora-animation="ml-6"] .elementor-widget-container {
    perspective: 600px;
}

/* ─── Overflow hidden on the container for Clip Reveal (gs-2) ───────────── */

[data-aurora-animation="gs-2"] .aurora-char,
[data-aurora-animation="gs-2"] .aurora-word,
[data-aurora-animation="gs-2"] .aurora-line {
    overflow: hidden;
    vertical-align: bottom;
}

/* ─── Ensures elements with data-aurora don't flash ──────────────────────── */

[data-aurora-enable="1"] .aurora-char,
[data-aurora-enable="1"] .aurora-word,
[data-aurora-enable="1"] .aurora-line {
    opacity: 0; /* Initial value before JS takes over */
}

/* ─── Ensures elements with data-aurora-children don't flash ────────────── */

/* The children are hidden via GSAP.set() in JS */
/* This block acts as a fallback for slow connections */
[data-aurora-children-enable="1"] > .elementor-widget,
[data-aurora-children-enable="1"] > .elementor-column,
[data-aurora-children-enable="1"] > .e-con > .e-con-inner > *,
[data-aurora-children-enable="1"] > .e-con > * {
    /* JS takes over opacity control via GSAP */
    will-change: transform, opacity;
}

/* ─── Utility: disables animations for users who prefer reduced motion ──── */

@media (prefers-reduced-motion: reduce) {
    .aurora-char,
    .aurora-word,
    .aurora-line,
    [data-aurora-children-enable="1"] > * {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        animation: none !important;
        transition: none !important;
    }
}
