/**
 * Estilos para o Shortcode [fx] - Efeitos de Texto
 *
 * [fx] = texto simples com cor personalizada
 * [fx loop] = animação de máquina de escrever vanilla JS
 */

/* Estilos base para [fx] simples */
.shortcode-text-effect {
    color: var(--e-global-color-d08a413);
    display: inline;
    
    /* Otimizações de renderização */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    
    /* Remove propriedades que podem causar quebras */
    transform: none;
    backface-visibility: visible;
    margin: 0;
    padding: 0;
    
    /* Garante que o texto flua naturalmente */
    white-space: inherit;
    word-wrap: inherit;
    overflow-wrap: inherit;
}

/* Estilos para [fx loop] - Máquina de escrever vanilla JS */
.shortcode-text-effect--animated {
    display: inline;
    position: relative;
    background: var(--e-global-color-accent);
    border-radius: 4px;
    padding: 2px 6px 6px;
    color: var(--e-global-color-secondary) !important;
    white-space: normal;
    word-break: keep-all;
    hyphens: none;
    line-height: inherit;
}

/* Cursor piscante */
.shortcode-text-effect--animated .typewriter-cursor {
    opacity: 0;
    animation: typewriter-blink 1s infinite;
}

/* Keyframes para o cursor piscante */
@keyframes typewriter-blink {
    0%, 50% {
        opacity: 1;
    }
    51%, 100% {
        opacity: 0;
    }
}

/* Estados da animação */
.shortcode-text-effect--animated.typing .typewriter-cursor {
    opacity: 0;
}

.shortcode-text-effect--animated.complete .typewriter-cursor {
    opacity: 1;
    animation: typewriter-blink 1s infinite;
}

/* Garantindo compatibilidade com o editor do Elementor */
.elementor-editor-active .shortcode-text-effect,
.elementor-editor-preview .shortcode-text-effect {
    color: var(--e-global-color-d08a413) !important;
}

.elementor-editor-active .shortcode-text-effect--animated,
.elementor-editor-preview .shortcode-text-effect--animated {
    color: var(--e-global-color-d08a413) !important;
    background: var(--e-global-color-accent) !important;
}

/* Compatibilidade com textos editáveis do Elementor */
.elementor-inline-editing .shortcode-text-effect {
    display: inline !important;
}

.elementor-inline-editing .shortcode-text-effect--animated {
    display: inline !important;
}

/* Correção específica para conteúdo em caixas de texto do Elementor */
.elementor-widget-heading .shortcode-text-effect,
.elementor-widget-text-editor .shortcode-text-effect {
    display: inline !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    
    /* Permite quebra natural palavra por palavra */
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

/* Correções específicas para a animação no Elementor */
.elementor-widget-heading .shortcode-text-effect--animated,
.elementor-widget-text-editor .shortcode-text-effect--animated {
    display: inline !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: keep-all !important;
    hyphens: none !important;
}