/* ============================================================================
   THE WIN CAPITAL S.A. - chance.css
   Estilos exclusivos de la pagina Chance de Exoneracion
   ============================================================================ */

/* Animacion del numero ganador */
.twc-chance-example__value--number {
    animation: twcNumberPulse 3s ease-in-out infinite;
}

@keyframes twcNumberPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--twc-primary-rgb), 0.3); }
    50%      { box-shadow: 0 0 0 12px rgba(var(--twc-primary-rgb), 0); }
}

/* Resultado: efecto glow verde */
.twc-chance-example__step--result {
    animation: twcGlowGreen 2s ease-in-out infinite alternate;
}

@keyframes twcGlowGreen {
    from { box-shadow: 0 0 20px rgba(var(--twc-success-rgb), 0.1); }
    to   { box-shadow: 0 0 40px rgba(var(--twc-success-rgb), 0.2); }
}

/* Info cards: numero grande al hover */
.page-chance .twc-info-card:hover .twc-info-card__number {
    transform: scale(1.15);
    box-shadow: var(--twc-shadow-gold);
}

.page-chance .twc-info-card__number {
    transition: transform var(--twc-transition-bounce),
                box-shadow var(--twc-transition-base);
}

/* Linea de tiempo visual entre pasos */
.page-chance .twc-info-card {
    position: relative;
}

/* Highlight del numero coincidente */
.twc-chance-example__highlight {
    position: relative;
}

.twc-chance-example__highlight::after {
    content: '';
    position: absolute;
    left: -4px;
    right: -4px;
    bottom: -2px;
    height: 3px;
    background: var(--twc-success);
    border-radius: var(--twc-radius-full);
    animation: twcUnderlineExpand 1s var(--twc-ease-spring) 0.5s both;
}

@keyframes twcUnderlineExpand {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}