/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
/* Estilos para logo centrado y más grande */
.logo-container-centered {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    text-decoration: none !important;
}

.logo-large {
    max-height: 160px !important; /* Doble del tamaño típico (40px) */
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

.brand-text-large {
    font-size: 2rem !important; /* Doble del tamaño típico */
    font-weight: bold;
    white-space: nowrap;
}

/* Ajustes para diferentes tamaños de pantalla */
@media (max-width: 768px) {
    .logo-large {
        max-height: 60px !important; /* Un poco más pequeño en móviles */
    }
    
    .brand-text-large {
        font-size: 1.5rem !important;
    }
}

@media (max-width: 576px) {
    .logo-large {
        max-height: 50px !important;
    }
    
    .brand-text-large {
        font-size: 1.2rem !important;
    }
}

/* Asegurar que el navbar tenga suficiente altura para el logo más grande */
#survey-nav {
    min-height: 100px;
}

/* Ajustar el padding del container para acomodar el logo más grande */
#survey-nav .container-fluid {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Estilos para elementos específicos con texto blanco */

/* Título del grupo/módulo */
.group-title {
    color: white !important;
}

/* Nombre de la encuesta */
.survey-name {
    color: white !important;
}

/* Descripción de la encuesta */
.survey-description {
    color: white !important;
}

/* Bienvenida de la encuesta */
.survey-welcome {
    color: white !important;
}

/* También aplicar color blanco a todos los elementos dentro de survey-welcome */
.survey-welcome p,
.survey-welcome li,
.survey-welcome ul,
.survey-welcome strong,
.survey-welcome b {
    color: white !important;
}

/* Encabezado de privacidad */
.ls-privacy-head {
    color: white !important;
}

/* Cuerpo de privacidad */
.ls-privacy-body {
    color: white !important;
}

/* También aplicar a párrafos dentro del cuerpo de privacidad */
.ls-privacy-body p {
    color: white !important;
}

/* Opcional: Asegurar que los enlaces dentro de estos elementos también sean blancos o visibles */
.group-title a,
.survey-name a,
.survey-description a,
.survey-welcome a,
.ls-privacy-head a,
.ls-privacy-body a {
    color: #cccccc !important; /* Un poco más gris para diferenciarse */
    text-decoration: underline;
}

.group-title a:hover,
.survey-name a:hover,
.survey-description a:hover,
.survey-welcome a:hover,
.ls-privacy-head a:hover,
.ls-privacy-body a:hover {
    color: white !important;
}

/* Agregar estas reglas a tu CSS existente */

/* Wrapper de texto completado */
.completed-wrapper {
    color: white !important;
}

/* Texto de finalización de encuesta */
.completed-text {
    color: white !important;
}

/* También aplicar color blanco a todos los elementos dentro de completed-text */
.completed-text p,
.completed-text strong,
.completed-text b,
.control-label radio-label,
.completed-text br {
    color: white !important;
}

/* Enlaces en el texto de finalización */
.completed-text a {
    color: #cccccc !important; /* Gris claro para ser visible */
    text-decoration: underline;
}

.completed-text a:hover {
    color: white !important;
}

.survey-description-white {
    color: #ffffff !important;
}
/* Texto de las opciones de respuesta (radio/checkbox) */
.radio-item label,
.checkbox-item label {
    color: #ffffff !important;
}

/* Título de la pregunta */
.question-text,
.ls-label-xs-visibility {
    color: #ffffff !important;
}

/* Texto de ayuda ("Seleccione una de las siguientes opciones") */
.question-help,
.help-text {
    color: #ffffff !important;
}

/* Por si acaso, cubrir todos los textos dentro del contenedor de pregunta */
.question .question-text *,
.answer-item label {
    color: #ffffff !important;
}