/* =========================================================================
 * CSS RECONSTRUIDO DESDE CERO: MODAL RUEDA DE LA FORTUNA
 * MODIFICADO: Añadida animación de pulso para el botón y nueva curva de desaceleración.
 * ========================================================================= */

.modal--fortune-wheel .modal__content {
    background: radial-gradient(circle, #3a225d, #1a112a);
    border: 2px solid #f59e0b;
    box-shadow: 0 0 35px rgba(245, 158, 11, 0.6), inset 0 0 20px rgba(0,0,0,0.5);
    width: auto;
    max-width: 95vw;
    height: auto;
    max-height: 95vh;
    padding: clamp(15px, 2vh, 25px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column; 
    align-items: center;
    position: relative; 
    overflow: hidden;
}

.fw-left-col {
    display: none; 
}

.fw-right-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
}

#budi-fortune-wheel-title {
    color: #f59e0b;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-shadow: 0 0 10px #f59e0b;
    margin-bottom: 1.5vh;
}

/* --- MODIFICACIÓN INICIA --- */
#budi-fortune-wheel-container {
    position: relative;
    display: grid;
    place-items: center;
    width: min(75vh, 85vw);
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    border: 1vh solid #4a2979;
    box-shadow: 0 0 20px rgba(0,0,0,0.7), inset 0 0 15px rgba(0,0,0,0.5);
    /* Se cambia la curva de animación por una con desaceleración más pronunciada */
    transition: transform 5s cubic-bezier(0.25, 1, 0.5, 1);
    background: conic-gradient( #6d41a1 0deg 45deg, #5b3687 45deg 90deg, #6d41a1 90deg 135deg, #5b3687 135deg 180deg, #6d41a1 180deg 225deg, #5b3687 225deg 270deg, #6d41a1 270deg 315deg, #5b3687 315deg 360deg );
}
/* --- MODIFICACIÓN TERMINA --- */

#budi-fortune-wheel-pointer {
    position: absolute;
    top: -4%;
    width: 0;
    height: 0;
    border-left: 3% solid transparent;
    border-right: 3% solid transparent;
    border-top: 5% solid #fde047;
    z-index: 10;
    filter: drop-shadow(0 -2px 4px rgba(0,0,0,0.5));
}

#budi-fw-prizes-container {
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
}

.fw-prize-item {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 45%;
    height: 1px;
    transform-origin: 0% 50%;
    transform: rotate(var(--angle, 0deg));
}

.fw-prize-item-content {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(calc(-1 * var(--angle, 0deg)));
}

.fw-prize-item-content img {
    width: clamp(40px, 15vw, 60px);
    height: auto;
    object-fit: contain;
}

#budi-fortune-wheel-spin-btn {
    margin-top: 2vh;
    padding: clamp(12px, 2vh, 18px) clamp(30px, 5vw, 50px);
    font-size: clamp(1rem, 3vh, 1.5rem);
    background-color: #f59e0b;
    color: #333 !important;
    border: 2px solid #fff8e1;
    transition: transform 0.2s, opacity 0.3s, box-shadow 0.3s;
    width: auto;
}

#budi-fortune-wheel-spin-btn:active {
    transform: scale(0.95);
}

#budi-fortune-wheel-spin-btn:disabled {
    opacity: 0.7;
    cursor: wait;
}

/* --- MODIFICACIÓN INICIA: NUEVA CLASE Y ANIMACIÓN PARA EL BOTÓN --- */
#budi-fortune-wheel-spin-btn.is-spinning {
    animation: button-pulse-glow 1.5s infinite ease-in-out;
}

@keyframes button-pulse-glow {
    0%, 100% {
        box-shadow: 0 0 8px #fde047, inset 0 0 5px rgba(255, 255, 255, 0.5);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 25px #fde047, inset 0 0 10px rgba(255, 255, 255, 0.7);
        transform: scale(1.05);
    }
}
/* --- MODIFICACIÓN TERMINA --- */

@media (orientation: landscape) and (max-height: 600px) {
    .modal--fortune-wheel .modal__content {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        gap: clamp(10px, 2vw, 20px);
        width: 95vw;
        height: 90vh;
        max-width: 900px;
        padding: 2vh;
    }
    .fw-left-col {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        flex: 0 0 30%;
        height: 100%;
    }
    #budi-fortune-wheel-title {
        order: -1; 
        margin-bottom: auto; 
    }
    #budi-fortune-wheel-left-image {
        width: 100%;
        max-height: 40vh;
        object-fit: contain;
        filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.2));
    }
    #budi-fortune-wheel-spin-btn {
        margin-top: auto;
    }
    .fw-right-col {
        flex: 1 1 70%;
        justify-content: center;
        align-items: center;
    }
    .fw-right-col > #budi-fortune-wheel-title,
    .fw-right-col > #budi-fortune-wheel-spin-btn {
        display: none;
    }
    .fw-left-col > #budi-fortune-wheel-title,
    .fw-left-col > #budi-fortune-wheel-spin-btn {
        display: flex; 
    }
    #budi-fortune-wheel-container {
        width: min(80vh, 60vw);
        margin-top: 5%; 
    }
}