/* =========================================================
   KASANI WHEEL V2 — SOLO PRESENTACION
   ========================================================= */

html.wlwl-html {
    overflow: hidden !important;
}

/* Oscurece la tienda, pero la deja visible alrededor */
.wlwl-overlay {
    background: rgba(4, 18, 47, .62) !important;
    backdrop-filter: blur(1.5px);
}

/* Elimina adornos/efectos del fondo del plugin */
.wlwl_lucky_wheel_content > i,
.wlwl_lucky_wheel_content .wlwl-leaf-scene,
.wlwl_lucky_wheel_content [class*="wlwl-bubble"],
.wlwl_lucky_wheel_content [class*="balloon"],
.wlwl_lucky_wheel_content.wlwl-background-effect-falling-leaves .wlwl-leaf-scene,
.wlwl_lucky_wheel_content.wlwl-background-effect-snowflakes-2 > i {
    display: none !important;
}

/* Modal desktop */
.wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    width: min(1120px, calc(100vw - 64px)) !important;
    max-width: min(1120px, calc(100vw - 64px)) !important;
    height: min(680px, calc(100vh - 48px)) !important;
    padding: 0 !important;
    margin-left: -200vw !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    background-image: none !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.32) !important;
    opacity: 0;
    transition: opacity .28s ease !important;
}

.wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.lucky_wheel_content_show {
    margin-left: 0 !important;
    opacity: 1 !important;
}

.wlwl_lucky_wheel_wrap .wheel-content-wrapper {
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    gap: 0 !important;
    align-items: stretch !important;
}

/* Panel azul izquierdo */
.wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left {
    width: 53% !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 32px 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #123f79 !important;
    position: relative !important;
}

.wlwl_lucky_wheel_wrap .wheel_content_left .wlwl_wheel_spin {
    margin: 0 auto !important;
    filter: drop-shadow(0 16px 24px rgba(0,0,0,.20));
}

/* Panel blanco derecho */
.wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_right {
    width: 47% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 50px 52px !important;
    margin: 0 !important;
    background: #ffffff !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    color: #173464 !important;
    position: relative !important;
    z-index: 10;
}

/* Texto original del plugin, sin añadir títulos inventados */
.wlwl_lucky_wheel_wrap .wheel_description {
    margin: 0 0 24px !important;
    color: #173464 !important;
}

.wlwl_lucky_wheel_wrap .wheel_description h1,
.wlwl_lucky_wheel_wrap .wheel_description h2,
.wlwl_lucky_wheel_wrap .wheel_description h3,
.wlwl_lucky_wheel_wrap .wheel_description h4 {
    margin: 0 0 14px !important;
    color: #0aa7ca !important;
    font-size: clamp(31px, 2.5vw, 46px) !important;
    line-height: 1.02 !important;
    font-weight: 800 !important;
    letter-spacing: -.025em !important;
}

.wlwl_lucky_wheel_wrap .wheel_description,
.wlwl_lucky_wheel_wrap .wheel_description p,
.wlwl_lucky_wheel_wrap .wheel_description span {
    color: #243a61 !important;
    font-size: 18px !important;
    line-height: 1.48 !important;
}

/* Inputs */
.wlwl_lucky_wheel_wrap .wlwl_user_lucky {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wlwl_lucky_wheel_wrap .wlwl_field_name_wrap,
.wlwl_lucky_wheel_wrap .wlwl_field_mobile_wrap,
.wlwl_lucky_wheel_wrap .wlwl_field_email_wrap {
    margin: 0 0 13px !important;
}

.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
    width: 100% !important;
    min-height: 58px !important;
    padding: 14px 17px !important;
    border: 1px solid #d7dfeb !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #263a60 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    box-shadow: 0 2px 8px rgba(24,52,100,.04) !important;
    outline: none !important;
}

.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input:focus,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select:focus {
    border-color: #13b6d4 !important;
    box-shadow: 0 0 0 3px rgba(19,182,212,.12) !important;
}

.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input::placeholder {
    color: #a9b3c3 !important;
}

/* CTA */
.wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button {
    width: 100% !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 3px !important;
    padding: 12px 18px !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: #f6bd13 !important;
    color: #102e63 !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .015em !important;
    box-shadow: 0 10px 22px rgba(216,155,0,.20) !important;
    cursor: pointer !important;
    transition: transform .15s ease, filter .15s ease !important;
}

.wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button:hover {
    transform: translateY(-1px);
    filter: brightness(1.025);
}

/* Cerrar dentro del modal */
.wlwl_lucky_wheel_wrap .wlwl-close-wheel,
.wlwl_lucky_wheel_wrap .wlwl-hide-after-spin {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.14) !important;
    z-index: 999 !important;
    cursor: pointer !important;
}

.wlwl_lucky_wheel_wrap .wlwl-close-wheel span,
.wlwl_lucky_wheel_wrap .wlwl-hide-after-spin span {
    color: #173464 !important;
    font-size: 20px !important;
}

/* Mensajes reales de Lucky Wheel después del giro */
.wlwl_lucky_wheel_wrap .wlwl-frontend-result {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 28px !important;
    margin: 0 !important;
    border-radius: 20px !important;
    background: #f8fbff !important;
    color: #173464 !important;
    font-size: 18px !important;
    line-height: 1.55 !important;
    box-shadow: none !important;
    border: 1px solid #dfe9f5 !important;
}

.wlwl_lucky_wheel_wrap .wheel_content_left > .wlwl-frontend-result:empty {
    display: none !important;
}

.wlwl_lucky_wheel_wrap .wlwl-frontend-result[data-lime-prize="35"] {
    border-top: 6px solid #f5cf24 !important;
}
.wlwl_lucky_wheel_wrap .wlwl-frontend-result[data-lime-prize="30"] {
    border-top: 6px solid #13b1d2 !important;
}
.wlwl_lucky_wheel_wrap .wlwl-frontend-result[data-lime-prize="25"] {
    border-top: 6px solid #22bfdc !important;
}

.wlwl_lucky_wheel_wrap .wlwl-button-apply-coupon-form .wlwl-button-apply-coupon,
.wlwl_lucky_wheel_wrap .wlwl-button-apply-coupon {
    min-height: 48px !important;
    padding: 11px 18px !important;
    border-radius: 12px !important;
    background: #11afd0 !important;
    color: #fff !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Errores de campos */
.wlwl_lucky_wheel_wrap .wlwl_error_field {
    color: #c24132 !important;
    font-size: 13px !important;
    margin-top: 4px !important;
}

/* =========================================================
   MOBILE — modal, no pantalla completa
   ========================================================= */
@media (max-width: 767px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        left: 50% !important;
        top: 50% !important;
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        height: calc(100dvh - 28px) !important;
        max-height: calc(100dvh - 28px) !important;
        border-radius: 22px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        transform: translate(-50%, -50%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel-content-wrapper,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel-content-wrapper {
        flex-direction: column !important;
        justify-content: flex-start !important;
        height: auto !important;
        min-height: 100% !important;
        gap: 0 !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 315px !important;
        margin: 0 !important;
        padding: 22px 12px 18px !important;
        background: #123f79 !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_right,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_right {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 27px 20px 24px !important;
        background: #ffffff !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description {
        margin-bottom: 18px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description h1,
    .wlwl_lucky_wheel_wrap .wheel_description h2,
    .wlwl_lucky_wheel_wrap .wheel_description h3,
    .wlwl_lucky_wheel_wrap .wheel_description h4 {
        font-size: 27px !important;
        line-height: 1.06 !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description,
    .wlwl_lucky_wheel_wrap .wheel_description p,
    .wlwl_lucky_wheel_wrap .wheel_description span {
        font-size: 16px !important;
        line-height: 1.42 !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
        min-height: 50px !important;
        font-size: 16px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button {
        min-height: 54px !important;
        font-size: 22px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl-close-wheel,
    .wlwl_lucky_wheel_wrap .wlwl-hide-after-spin {
        top: 10px !important;
        right: 10px !important;
        width: 36px !important;
        height: 36px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl-frontend-result {
        padding: 21px !important;
        font-size: 16px !important;
    }
}

/* =========================================================
   V2.1 AJUSTES FINOS
   ========================================================= */

/* Garantiza que el panel azul cubra todo el alto, incluso si Lucky Wheel deja huecos internos */
.wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content {
    background: #123f79 !important;
}

.wlwl_lucky_wheel_wrap .wheel-content-wrapper,
.wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left,
.wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_right {
    min-height: 100% !important;
}

.wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left {
    align-self: stretch !important;
    border-radius: 0 !important;
}

/* Campos con mayor contraste y legibilidad */
.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
    background: #f6f8fb !important;
    border: 2px solid #a9b7ca !important;
    color: #173464 !important;
    font-weight: 500 !important;
    box-shadow: 0 3px 10px rgba(23,52,100,.06) !important;
}

.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input::placeholder {
    color: #6f809a !important;
    opacity: 1 !important;
    font-weight: 500 !important;
}

.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input:focus,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select:focus {
    background: #ffffff !important;
    border-color: #12b3d5 !important;
    box-shadow: 0 0 0 4px rgba(18,179,213,.14) !important;
}

/* Elimina todos los copos/efectos visuales configurados por Lucky Wheel */
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflake,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-1,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-1 span,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-2,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-2 i,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-2 i::before,
.wlwl_lucky_wheel_wrap .wlwl-background-effect-snowflakes-2 i::after,
.wlwl-overlay.wlwl-background-effect-snowflakes-2 i,
.wlwl-overlay.wlwl-background-effect-snowflakes-2 i::before,
.wlwl-overlay.wlwl-background-effect-snowflakes-2 i::after {
    display: none !important;
    background: none !important;
    animation: none !important;
}

/* Móvil: bloque azul completo sin bandas */
@media (max-width: 767px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 44%, #ffffff 44% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        align-self: stretch !important;
        border-radius: 0 !important;
    }
}

/* =========================================================
   V2.2 — logo proporcional + mobile compacto + fuente sans
   ========================================================= */

/* Tipografía UI consistente (no afecta la lógica ni el canvas). */
.wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
.wlwl_lucky_wheel_wrap .wheel_description,
.wlwl_lucky_wheel_wrap .wheel_content_right,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky input,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky select,
.wlwl_lucky_wheel_wrap .wlwl_user_lucky button,
.wlwl_lucky_wheel_wrap .wlwl_spin_button,
.wlwl_lucky_wheel_wrap .wlwl-frontend-result {
    font-family: Arial, Helvetica, sans-serif !important;
}

@media (max-width: 767px) {
    /* Modal completo dentro del viewport dejando un borde visible de la tienda. */
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        height: calc(100dvh - 20px) !important;
        max-height: calc(100dvh - 20px) !important;
        overflow: hidden !important;
        border-radius: 22px !important;
        background: linear-gradient(to bottom, #123f79 0 39%, #ffffff 39% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel-content-wrapper,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel-content-wrapper {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex: 0 0 39% !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 10px 12px 8px !important;
        overflow: hidden !important;
    }

    /* Reduce el tamaño visual de la rueda sin tocar su cálculo interno. */
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(72vw, 34dvh, 290px) !important;
        height: min(72vw, 34dvh, 290px) !important;
        margin: 0 auto !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin canvas,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin canvas {
        width: 100% !important;
        height: 100% !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin_container,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin_container {
        width: 100% !important;
        height: 100% !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_pointer:before {
        font-size: 30px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_right,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_right {
        flex: 1 1 61% !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 13px 18px 14px !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description {
        margin: 0 0 10px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description h1,
    .wlwl_lucky_wheel_wrap .wheel_description h2,
    .wlwl_lucky_wheel_wrap .wheel_description h3,
    .wlwl_lucky_wheel_wrap .wheel_description h4,
    .wlwl_lucky_wheel_wrap .wheel_description strong {
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 20px !important;
        line-height: 1.08 !important;
        font-weight: 800 !important;
        margin-bottom: 7px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description,
    .wlwl_lucky_wheel_wrap .wheel_description p,
    .wlwl_lucky_wheel_wrap .wheel_description span {
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 14.5px !important;
        line-height: 1.34 !important;
        margin-bottom: 0 !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_field_name_wrap,
    .wlwl_lucky_wheel_wrap .wlwl_field_mobile_wrap,
    .wlwl_lucky_wheel_wrap .wlwl_field_email_wrap {
        margin-bottom: 7px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
        min-height: 43px !important;
        height: 43px !important;
        padding: 8px 12px !important;
        border-radius: 12px !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 14px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button {
        min-height: 46px !important;
        height: 46px !important;
        margin-top: 1px !important;
        border-radius: 12px !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 19px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_error_field {
        font-size: 11px !important;
        line-height: 1.15 !important;
        margin-top: 2px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl-close-wheel,
    .wlwl_lucky_wheel_wrap .wlwl-hide-after-spin {
        top: 7px !important;
        right: 7px !important;
        width: 34px !important;
        height: 34px !important;
    }
}

/* Teléfonos de menor altura: compactar un poco más sin cortar contenido. */
@media (max-width: 767px) and (max-height: 740px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 36%, #ffffff 36% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex-basis: 36% !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(64vw, 31dvh, 245px) !important;
        height: min(64vw, 31dvh, 245px) !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description h1,
    .wlwl_lucky_wheel_wrap .wheel_description h2,
    .wlwl_lucky_wheel_wrap .wheel_description h3,
    .wlwl_lucky_wheel_wrap .wheel_description h4,
    .wlwl_lucky_wheel_wrap .wheel_description strong {
        font-size: 18px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_description,
    .wlwl_lucky_wheel_wrap .wheel_description p,
    .wlwl_lucky_wheel_wrap .wheel_description span {
        font-size: 13.5px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
        min-height: 40px !important;
        height: 40px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button {
        min-height: 43px !important;
        height: 43px !important;
        font-size: 18px !important;
    }
}

/* =========================================================
   V2.3 — rueda mayor + ajuste mobile
   ========================================================= */

/* Un poco más de presencia en desktop, manteniendo espacio para el formulario. */
@media (min-width: 768px) {
    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left {
        width: 54% !important;
        padding: 22px 16px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_right {
        width: 46% !important;
        padding-left: 46px !important;
        padding-right: 46px !important;
    }
}

/* En móvil aprovechamos más el panel azul para agrandar la rueda sin crear scroll. */
@media (max-width: 767px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 43%, #ffffff 43% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex: 0 0 43% !important;
        padding: 7px 8px 4px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(82vw, 40dvh, 330px) !important;
        height: min(82vw, 40dvh, 330px) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_right,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_right {
        flex: 1 1 57% !important;
        padding-top: 10px !important;
        padding-bottom: 11px !important;
    }
}

@media (max-width: 767px) and (max-height: 740px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 40%, #ffffff 40% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex-basis: 40% !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(75vw, 37dvh, 285px) !important;
        height: min(75vw, 37dvh, 285px) !important;
    }
}

/* =========================================================
   V2.4 — desktop sin recorte + más azul móvil + premios bold
   ========================================================= */

/* Desktop: conserva la presencia de la rueda, pero evita que el canvas se corte. */
@media (min-width: 768px) {
    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left {
        width: 54% !important;
        padding: 18px 10px !important;
        overflow: hidden !important;
    }

    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_right {
        width: 46% !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_content_left .wlwl_wheel_spin {
        max-width: calc(100% - 8px) !important;
        max-height: calc(100% - 8px) !important;
    }
}

/* Mobile: más respiración azul debajo de la rueda sin perder el contenido del formulario. */
@media (max-width: 767px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 46%, #ffffff 46% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex: 0 0 46% !important;
        padding: 7px 8px 16px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(82vw, 39dvh, 330px) !important;
        height: min(82vw, 39dvh, 330px) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_right,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_right {
        flex: 1 1 54% !important;
        padding: 8px 18px 10px !important;
    }

    /* Compactamos levemente para que el modal siga entrando completo. */
    .wlwl_lucky_wheel_wrap .wheel_description {
        margin-bottom: 8px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_field_name_wrap,
    .wlwl_lucky_wheel_wrap .wlwl_field_mobile_wrap,
    .wlwl_lucky_wheel_wrap .wlwl_field_email_wrap {
        margin-bottom: 6px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_input,
    .wlwl_lucky_wheel_wrap .wlwl_user_lucky .wlwl_field_select {
        min-height: 41px !important;
        height: 41px !important;
    }

    .wlwl_lucky_wheel_wrap .wheel_content_right .wlwl_user_lucky .wlwl_spin_button {
        min-height: 44px !important;
        height: 44px !important;
    }
}

@media (max-width: 767px) and (max-height: 740px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile {
        background: linear-gradient(to bottom, #123f79 0 43%, #ffffff 43% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wheel_content_left,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content.wlwl_lucky_wheel_content_mobile .wheel_content_left {
        flex-basis: 43% !important;
        padding-bottom: 12px !important;
    }

    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content_mobile .wlwl_wheel_spin,
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content .wlwl_wheel_spin {
        width: min(74vw, 36dvh, 282px) !important;
        height: min(74vw, 36dvh, 282px) !important;
    }
}

/* =========================================================
   V2.5 — correcciones puntuales desktop
   - logo con área segura para no deformarse/cortarse en el centro
   - fondo azul alineado exactamente con el ancho del panel izquierdo
   ========================================================= */
@media (min-width: 768px) {
    .wlwl_lucky_wheel_wrap .wlwl_lucky_wheel_content,
    .wlwl_lucky_wheel_wrap .wheel-content-wrapper {
        background: linear-gradient(to right, #123f79 0 54%, #ffffff 54% 100%) !important;
    }

    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_left {
        width: 54% !important;
        height: 100% !important;
        min-height: 100% !important;
        align-self: stretch !important;
        background: #123f79 !important;
        box-shadow: 2px 0 0 #123f79 !important;
    }

    .wlwl_lucky_wheel_wrap .wheel-content-wrapper .wheel_content_right {
        width: 46% !important;
        height: 100% !important;
        min-height: 100% !important;
        align-self: stretch !important;
        background: #ffffff !important;
    }
}
