/**
 * Page Builder — Text Effect block styles.
 * Consumes theme CSS variables where set; respects reduced motion.
 */

.pb-text-effect {
    --te-color: var(--theme-text, currentColor);
    --te-highlight: var(--theme-accent, #ffd54f);
    --te-gradient-from: var(--theme-primary, #0d6efd);
    --te-gradient-to: var(--theme-accent, #6610f2);
    --te-delay: 0ms;
    --te-duration: 0.9s;
    margin-inline: auto;
    padding: calc(1.25rem * var(--theme-space-scale, 1)) 0;
    color: var(--te-color);
    font-family: var(--theme-font-heading, var(--theme-font-display, inherit));
    line-height: 1.25;
}

.pb-text-effect--speed-slow { --te-duration: 1.6s; --te-char-ms: 110; --te-cycle-ms: 4200; }
.pb-text-effect--speed-normal { --te-duration: 0.9s; --te-char-ms: 70; --te-cycle-ms: 2800; }
.pb-text-effect--speed-fast { --te-duration: 0.5s; --te-char-ms: 40; --te-cycle-ms: 1800; }

.pb-text-effect--left { text-align: left; margin-inline: 0 auto; }
.pb-text-effect--center { text-align: center; margin-inline: auto; }
.pb-text-effect--right { text-align: right; margin-inline: auto 0; }

.pb-text-effect-inner {
    margin: 0;
    display: inline-block;
    max-width: 100%;
    width: 100%;
}

.pb-text-effect [data-te-target] {
    display: inline;
}

/* Typewriter */
.pb-te-cursor {
    display: inline-block;
    margin-left: 0.08em;
    color: currentColor;
    animation: pb-te-blink 1s steps(1) infinite;
    vertical-align: baseline;
}
.pb-te-cursor--bar { width: 0.08em; height: 1em; background: currentColor; }
.pb-te-cursor--underscore::before { content: "_"; }
.pb-te-cursor--block {
    width: 0.55em;
    height: 1em;
    background: currentColor;
    opacity: 0.85;
}
@keyframes pb-te-blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

/* Wave */
.pb-te-wave-char {
    display: inline-block;
    animation-name: pb-te-wave-up;
    animation-duration: var(--te-duration);
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: calc(var(--te-delay) + var(--i, 0) * 60ms);
}
.pb-text-effect--wave[data-te-wave-dir="down"] .pb-te-wave-char {
    animation-name: pb-te-wave-down;
}
.pb-text-effect--wave[data-te-wave-intensity="low"] .pb-te-wave-char { --te-wave-amp: 0.12em; }
.pb-text-effect--wave[data-te-wave-intensity="medium"] .pb-te-wave-char { --te-wave-amp: 0.22em; }
.pb-text-effect--wave[data-te-wave-intensity="high"] .pb-te-wave-char { --te-wave-amp: 0.36em; }
@keyframes pb-te-wave-up {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(calc(var(--te-wave-amp, 0.22em) * -1)); }
}
@keyframes pb-te-wave-down {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(var(--te-wave-amp, 0.22em)); }
}

/* Fade in / out / blur / slide */
.pb-te-anim-ready { opacity: 0; }
.pb-te-fade-in.is-on {
    animation: pb-te-fade-in var(--te-duration) ease forwards;
    animation-delay: var(--te-delay);
}
.pb-te-fade-out.is-on {
    animation: pb-te-fade-out var(--te-duration) ease forwards;
    animation-delay: var(--te-delay);
}
.pb-te-fade-loop.is-on {
    animation: pb-te-fade-loop calc(var(--te-duration) * 2.2) ease-in-out infinite;
    animation-delay: var(--te-delay);
}
.pb-te-blur-in.is-on {
    animation: pb-te-blur-in var(--te-duration) ease forwards;
    animation-delay: var(--te-delay);
}
.pb-te-slide-in.is-on {
    animation: pb-te-slide-in var(--te-duration) ease forwards;
    animation-delay: var(--te-delay);
}
@keyframes pb-te-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes pb-te-fade-out {
    from { opacity: 1; }
    to { opacity: 0; }
}
@keyframes pb-te-fade-loop {
    0%, 100% { opacity: 0.15; }
    50% { opacity: 1; }
}
@keyframes pb-te-blur-in {
    from { opacity: 0; filter: blur(10px); }
    to { opacity: 1; filter: blur(0); }
}
@keyframes pb-te-slide-in {
    from {
        opacity: 0;
        transform: translate(var(--te-slide-x, 0), var(--te-slide-y, 0));
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}
.pb-text-effect[data-te-slide="left"] { --te-slide-x: -1.5rem; --te-slide-y: 0; }
.pb-text-effect[data-te-slide="right"] { --te-slide-x: 1.5rem; --te-slide-y: 0; }
.pb-text-effect[data-te-slide="top"] { --te-slide-x: 0; --te-slide-y: -1.25rem; }
.pb-text-effect[data-te-slide="bottom"] { --te-slide-x: 0; --te-slide-y: 1.25rem; }

/* Alternate / rotate */
.pb-te-swap {
    display: inline-block;
    min-width: 1ch;
    transition: opacity 0.35s ease, transform 0.35s ease;
}
.pb-te-swap.is-out {
    opacity: 0;
    transform: translateY(0.35em);
}
.pb-te-swap.is-out-slide {
    opacity: 0;
    transform: translateX(-0.5em);
}
.pb-te-rotator {
    display: inline-block;
    position: relative;
    min-width: 4ch;
    color: var(--theme-primary, currentColor);
    font-weight: inherit;
}

/* Highlight */
.pb-te-highlight {
    position: relative;
    display: inline;
    background-image: linear-gradient(var(--te-highlight), var(--te-highlight));
    background-repeat: no-repeat;
    background-size: 0% 100%;
    background-position: left center;
    transition: background-size var(--te-duration) ease;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.pb-te-highlight--marker.is-on {
    background-size: 100% 100%;
    padding: 0 0.15em;
    border-radius: 0.15em;
}
.pb-te-highlight--underline {
    background-image: none;
    box-shadow: inset 0 -0.12em 0 0 transparent;
    transition: box-shadow var(--te-duration) ease;
}
.pb-te-highlight--underline.is-on {
    box-shadow: inset 0 -0.12em 0 0 var(--te-highlight);
}
.pb-te-highlight--glow {
    background-image: none;
    transition: text-shadow var(--te-duration) ease, color var(--te-duration) ease;
}
.pb-te-highlight--glow.is-on {
    text-shadow: 0 0 0.55em color-mix(in srgb, var(--te-highlight) 70%, transparent);
}

.pb-text-effect--loop .pb-te-fade-in.is-on,
.pb-text-effect--loop .pb-te-blur-in.is-on,
.pb-text-effect--loop .pb-te-slide-in.is-on {
    animation-iteration-count: 1;
}
.pb-text-effect--loop .pb-te-gradient {
    animation-iteration-count: infinite;
}

    background: linear-gradient(
        90deg,
        var(--te-gradient-from),
        var(--te-gradient-to),
        var(--te-gradient-from)
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: pb-te-gradient-shift calc(var(--te-duration) * 3) linear infinite;
    animation-delay: var(--te-delay);
}
@keyframes pb-te-gradient-shift {
    to { background-position: 200% center; }
}

/* Reduced motion */
html[data-reduced-motion="1"] .pb-text-effect *,
html[data-reduced-motion="1"] .pb-text-effect *::before,
html[data-reduced-motion="1"] .pb-text-effect *::after {
    animation: none !important;
    transition: none !important;
}
html[data-reduced-motion="1"] .pb-te-anim-ready,
html[data-reduced-motion="1"] .pb-te-fade-in,
html[data-reduced-motion="1"] .pb-te-fade-out,
html[data-reduced-motion="1"] .pb-te-blur-in,
html[data-reduced-motion="1"] .pb-te-slide-in {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}
html[data-reduced-motion="1"] .pb-te-highlight {
    background-size: 100% 100% !important;
}
html[data-reduced-motion="1"] .pb-te-highlight--underline {
    box-shadow: inset 0 -0.12em 0 0 var(--te-highlight) !important;
}
html[data-reduced-motion="1"] .pb-te-gradient {
    color: var(--te-gradient-from);
    -webkit-background-clip: initial;
    background-clip: initial;
    background: none;
}

@media (prefers-reduced-motion: reduce) {
    .pb-text-effect *,
    .pb-text-effect *::before,
    .pb-text-effect *::after {
        animation: none !important;
        transition: none !important;
    }
    .pb-te-anim-ready,
    .pb-te-fade-in,
    .pb-te-fade-out,
    .pb-te-blur-in,
    .pb-te-slide-in {
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }
    .pb-te-highlight {
        background-size: 100% 100% !important;
    }
    .pb-te-highlight--underline {
        box-shadow: inset 0 -0.12em 0 0 var(--te-highlight) !important;
    }
    .pb-te-gradient {
        color: var(--te-gradient-from);
        -webkit-background-clip: initial;
        background-clip: initial;
        background: none;
    }
}
