.elementor-906 .elementor-element.elementor-element-e78c069{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}@media(min-width:768px){.elementor-906 .elementor-element.elementor-element-e78c069{--content-width:100%;}}/* Start custom CSS for shortcode, class: .elementor-element-815a5cd *//* --- LIMPIEZA GENERAL DEL FORMULARIO 908 --- */

/* Forzar que las etiquetas de pregunta aparezcan arriba de los cuadros */
#forminator-module-908 .forminator-field-radio .forminator-label {
    display: block !important;
    width: 100% !important;
    margin-bottom: 15px !important;
    font-weight: 600;
}

.forminator-pagination-steps {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 10px !important;
    }

/* Contenedor de los radios: Lo convertimos en una rejilla */
#forminator-module-908 .forminator-field-radio [role="radiogroup"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: stretch !important;
}

/* Estilo de cada Tarjeta/Cuadrado */
#forminator-module-908 .forminator-radio {
    flex: 1 1 calc(25% - 10px); /* 4 por fila en desktop */
    min-width: 100px;
    margin: 0 !important;
    padding: 0px 0px !important;
    background-color: #fcfcfc;
    border: 2px solid #e1e1e1;
    border-radius: 8px;
    text-align: center;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    position: relative;
}

/* Ocultar elementos nativos de Forminator */
#forminator-module-908 .forminator-radio input,
#forminator-module-908 .forminator-radio-bullet {
    display: none !important;
}

/* Ajustar el texto dentro del cuadro */
#forminator-module-908 .forminator-radio-label {
    margin: 0 !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    color: #444;
}

/* --- ESTADOS: HOVER Y SELECCIONADO --- */

/* Hover */
#forminator-module-908 .forminator-radio:hover {
    border-color: #bababa;
    background-color: #bababa;
}

/* Seleccionado (Checkbox activo) */
#forminator-module-908 .forminator-radio:has(input:checked) {
    background-color: #000 !important;
    border-color: #000 !important;
    box-shadow: 0 4px 10px rgba(0, 115, 170, 0.2);
}

/* Texto blanco cuando está seleccionado */
#forminator-module-908 .forminator-radio:has(input:checked) .forminator-radio-label {
    color: #ffffff !important;
}

.forminator-pagination-footer{
    align-content: center !important;
    justify-content: center !important;
}


#forminator-module-908{
    width: 500px;
}

.forminator-radio {
    display: block !important;
    cursor: pointer !important;
}

/* Forzamos al span a expandirse para llenar todo el contenedor */
.forminator-radio .forminator-radio-label {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    /* Esto asegura que el click en el "aire" alrededor del texto también cuente */
    padding: 10px 0px; 
}

/* Opcional: Si el bullet (el circulito) te molesta para el centrado, 
   puedes ocultarlo, ya que el botón seguirá funcionando al clickear el texto */
.forminator-radio-bullet {
    pointer-events: none; /* El click pasa a través del círculo al label */
}
/* --- AJUSTES PARA MÓVIL --- */
@media (max-width: 600px) {
    #forminator-module-908 .forminator-radio {
        flex: 1 1 calc(50% - 10px); /* 2 por fila en móvil */
    }
    
    #forminator-module-908{
    width: 250px;
}
    
    /* Para la segunda pregunta que tiene textos largos, mejor 1 por fila */
    #radio-2 .forminator-radio {
        flex: 1 1 100%;
    }
    .forminator-pagination-steps {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 10px !important;
    }

    /* Ocultamos los divisores de línea que mete Forminator por defecto */
    .forminator-pagination-steps .forminator-break {
        display: none !important;
    }

    /* Ajustamos el tamaño de cada paso para que no se amontonen */
    .forminator-step {
        margin: 0 !important;
        padding: 5px !important;
        flex: 1; /* Esto hace que ambos ocupen el mismo ancho */
        text-align: center;
    }
    
    /* Si los nombres son muy largos, podemos reducir la fuente */
    .forminator-step-label {
        font-size: 12px !important;
        display: inline-block !important;
    }

    /* Aseguramos que el formulario no se vea tan estrecho (opcional) */
    #forminator-module-908 {
        width: 100% !important; /* Cambié 250px por 100% para que use todo el móvil */
        max-width: 350px; /* Ajusta según prefieras */
        margin: 0 auto;
    }
}/* End custom CSS */