/* ==========================================================================
   Motor de Efectos de Botones (Premium Definitivo)
   ========================================================================== */

/* Default hiding for translation nodes */
.cw-text-main, .cw-text-hover {
    display: none;
}

/* 1. Liquid Fill */
/* Usamos text-fill-color para conservar la variable currentColor intacta */
.cw-btn-effect-liquid .cw-cta-text,
.cw-btn-effect-liquid .cw-el-btn-text {
    display: inline-block;
    position: relative;
    background-image: linear-gradient(currentColor, currentColor);
    background-size: 100% 0%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    -webkit-text-fill-color: transparent !important;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-stroke: 1px currentColor;
    transition: background-size 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.cw-btn-effect-liquid:hover .cw-cta-text,
.cw-btn-effect-liquid:hover .cw-el-btn-text {
    background-size: 100% 100%;
}

/* 2. Slide Up */
/* Usamos visibility para esconder el nodo de texto sin afectar los pseudo-elementos */
.cw-btn-effect-slide {
    overflow: hidden !important; /* El botón corta todo lo que salga de él */
}
.cw-btn-effect-slide .cw-cta-text,
.cw-btn-effect-slide .cw-el-btn-text {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    overflow: hidden; /* Corta sus propios hijos (::before/::after) */
}
.cw-btn-effect-slide .cw-text-base {
    visibility: hidden !important; /* Oculta el texto base conservando su tamaño y sucurrentColor */
}
.cw-btn-effect-slide .cw-text-main,
.cw-btn-effect-slide .cw-text-hover {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    color: currentColor; /* Ahora sí funciona perfecto! */
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.cw-btn-effect-slide .cw-text-main {
    top: 0 !important;
}
.cw-btn-effect-slide .cw-text-hover {
    top: 100% !important;
}
.cw-btn-effect-slide:hover .cw-text-main,
.cw-btn-effect-slide:hover .cw-text-hover {
    transform: translateY(-100%) !important;
}

/* 3. Cyber Glitch */
.cw-btn-effect-glitch .cw-cta-text,
.cw-btn-effect-glitch .cw-el-btn-text {
    display: inline-block;
    position: relative;
}
.cw-btn-effect-glitch .cw-text-main,
.cw-btn-effect-glitch .cw-text-hover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    pointer-events: none;
}
.cw-btn-effect-glitch:hover .cw-text-main {
    animation: cw-glitch-anim-1 0.4s 5 linear alternate-reverse;
    text-shadow: -2px 0 #ff003c;
    clip-path: inset(10% 0 50% 0);
    opacity: 1;
}
.cw-btn-effect-glitch:hover .cw-text-hover {
    animation: cw-glitch-anim-2 0.4s 5 linear alternate-reverse;
    text-shadow: 2px 0 #00f0ff;
    clip-path: inset(50% 0 10% 0);
    opacity: 1;
}
@keyframes cw-glitch-anim-1 {
    0% { transform: translate(0) }
    20% { transform: translate(-2px, 2px) }
    40% { transform: translate(-2px, -2px) }
    60% { transform: translate(2px, 2px) }
    80% { transform: translate(2px, -2px) }
    100% { transform: translate(0) }
}
@keyframes cw-glitch-anim-2 {
    0% { transform: translate(0) }
    20% { transform: translate(2px, -2px) }
    40% { transform: translate(2px, 2px) }
    60% { transform: translate(-2px, -2px) }
    80% { transform: translate(-2px, 2px) }
    100% { transform: translate(0) }
}

/* 4. Neon Glow */
.cw-btn-effect-neon {
    transition: box-shadow 0.4s ease, border-color 0.4s ease !important;
}
.cw-btn-effect-neon:hover {
    box-shadow: 0 0 10px currentColor, 0 0 20px currentColor !important;
}
.cw-btn-effect-neon .cw-cta-text,
.cw-btn-effect-neon .cw-el-btn-text {
    transition: text-shadow 0.4s ease !important;
}
.cw-btn-effect-neon:hover .cw-cta-text,
.cw-btn-effect-neon:hover .cw-el-btn-text {
    text-shadow: 0 0 5px currentColor, 0 0 10px currentColor, 0 0 20px currentColor !important;
}

/* 5. Letter Expand */
.cw-btn-effect-expand .cw-cta-text,
.cw-btn-effect-expand .cw-el-btn-text {
    display: inline-block;
    transition: letter-spacing 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.5s ease !important;
}
.cw-btn-effect-expand:hover .cw-cta-text,
.cw-btn-effect-expand:hover .cw-el-btn-text {
    letter-spacing: 3px !important;
    opacity: 0.7 !important;
}
