/******************
    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
*/

  .table-bordered > thead > tr > th {
    border: 1px solid #dadada;
  }
  .table-bordered > thead > tr > td {
    border: 1px solid #dadada;
  }
  
/* ===================================================================================================
 * GESTIÓN TECNOLÓGICA - CORRECCIÓN DEFINITIVA DE BOTONES
 * Máxima Especificidad CSS para anular el color azul.
 * =================================================================================================== */

/* -----------------------------------------------------------
 * A. ESTILO NO SELECCIONADO (Gris Claro)
 * ----------------------------------------------------------- */
.question-container .answer-item .btn-group .btn:not(.active),
.question-container .answer-item .btn-group .btn-primary:not(.active) {
    background-color: #E0E0E0 !important; /* Gris Claro */
    border-color: #A0A0A0 !important; 
    color: #4D4D4D !important; /* Texto Gris Oscuro */
    box-shadow: none !important;
}

/* -----------------------------------------------------------
 * B. ESTILO SELECCIONADO (Verde Manzana)
 * ----------------------------------------------------------- */
.question-container .answer-item .btn-group .btn.active,
.question-container .answer-item .btn-group .btn-primary.active {
    background-color: #8DEB6D !important; /* Verde Manzana */
    border-color: #4CAF50 !important; 
    color: #FFFFFF !important; /* Texto Blanco */
    box-shadow: 0 0 0 1px #4CAF50 inset, 0 2px 5px rgba(0,0,0,0.2) !important;
}

/* Ejemplo CSS a añadir en su plantilla */
.limite-alcanzado {
    opacity: 0.4; /* Hacer la imagen semitransparente */
    cursor: not-allowed; /* Mostrar el ícono de "prohibido" */
    border: 2px solid #dc3545; /* Añadir un borde rojo de advertencia */
}

/*
 * Script CSS para LimeSurvey
 * Objetivo: Establecer el fondo del área de ayuda de los grupos de preguntas a color blanco
 */

.group-help-text {
    /* Establece el color de fondo a blanco (código hexadecimal #FFFFFF) */
    background-color: #FFFFFF !important;

    /* Opcional: Añadir un pequeño relleno (padding) para mejor legibilidad */
    padding: 10px;

    /* Opcional: Añadir un borde sutil para delimitar el área */
    border: 1px solid #e0e0e0;

    /* Opcional: Pequeños bordes redondeados */
    border-radius: 5px;
}

/*
 * Script CSS de Máxima Prioridad para Forzar el Fondo Blanco
 * Anula cualquier fondo gris claro aplicado por el tema.
 */

/* * 1. Anula las clases más comunes para el recuadro de la descripción
 * (card, card-body y group-description)
 */
.card,
.card-body,
.group-description,
.card-body > p {
    background-color: #FFFFFF !important;
}

/*
 * 2. Anula el color de borde y la sombra que visualmente contribuyen al gris claro.
 * Esto elimina el efecto "caja" que puede hacer que el blanco parezca gris.
 */
.group-container .card {
    border-color: #FFFFFF !important; /* Asegura que el borde sea blanco */
    box-shadow: none !important;      /* Elimina cualquier sombra */
}

/*
 * 3. Selector de último recurso: Si el gris es un efecto de la clase 'text-box'
 */
.text-box {
    background-color: #FFFFFF !important;
}

/*
 * Script CSS para LimeSurvey: Fondo Blanco en el Área del Logo
 *
 * Anula cualquier color de fondo que el tema esté aplicando al contenedor del logo.
 */

.custom-logo,
.navbar-brand {
    /* Fuerza el fondo a blanco puro (#FFFFFF) */
    background-color: #FFFFFF !important;

    /* Opcional: Esto asegura que el contenedor tenga el mismo color que el fondo de la página,
       eliminando cualquier rastro de color alrededor del logo. */
    border-color: #FFFFFF !important;
}

/* Selector adicional, a veces necesario para temas que usan una barra de navegación (navbar) */
.navbar-header {
    background-color: #FFFFFF !important;
}

/*
 * Script CSS para LimeSurvey: Fondo Blanco en el área de la Cabecera
 *
 * NOTA: Esto anulará el fondo gris/azul claro que ves al lado del logo.
 */

/* Apunta a la barra de navegación principal */
.navbar,
.navbar-default,
.navbar-header {
    background-color: #FFFFFF !important; /* Fuerza el fondo a blanco */
    border-color: #FFFFFF !important;     /* Elimina cualquier borde inferior que pueda ser gris */
}

/* Selector para el contenedor más grande (wrapper) */
#wrapper {
    background-color: #FFFFFF !important;
}

/* Asegura que el contenedor del logo también sea blanco */
.custom-logo,
.navbar-brand {
    background-color: #FFFFFF !important;
}

/*
 * Script CSS para LimeSurvey: Ocultar Enlaces de Registro/Guardado (Versión Forzada)
 *
 * NOTA: Esto apunta al ID de los contenedores para garantizar que se oculten,
 * además de usar selectores de atributo muy específicos.
 */

/* Oculta los contenedores comunes de registro diferido/guardar */
#save-load-wrapper,
#register-link,
.save-load-wrapper,
.save-and-continue-button {
    display: none !important;
}

/* Oculta el enlace "Register" basado en el texto del atributo de la URL */
a[href*="register"] {
    display: none !important;
}

/* Oculta el enlace "Continuar después" (saveandload) basado en el texto del atributo de la URL */
a[href*="saveandload"] {
    display: none !important;
}


@font-face {
    font-family: "gotham"; /* Nombre que usarás en CSS */
    src: url('fonts/GothamNarrow-Black.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Muestra texto temporal mientras carga la fuente */
}

body {
    font-family: "gotham", Arial, sans-serif !important;
}

/* Selector de alta especificidad para el texto de ayuda de la pregunta */
.tip-text,
.ls-questionhelp {
    /* Define el color del texto. Cambia el código #00698f por el color deseado */
    color: #3d6ec1 !important; /* EJEMPLO: Azul oscuro */
}

k/* 1. ANULAR COMPORTAMIENTO DE SUPERÍNDICE (sup) */
/* El asterisco está dentro de un 'sup.text-danger.fa.fa-asterisk.small' */
sup.text-danger.fa.fa-asterisk.small {
    /* Fuerza que se comporte como un elemento en línea */
    display: inline !important; 
    
    /* Anula cualquier posicionamiento que lo suba */
    position: static !important; 
    
    /* Anula cualquier margen o padding extraño del sup */
    margin: 0 !important; 
    padding: 0 0 0 5px !important; /* Añade un espacio a la izquierda del asterisco */
    
    /* Asegura que el color se aplique al contenedor */
    color: #dc325f !important;
}

/* 2. REFORZAR EL ESTILO DEL ICONO */
/* Esto se asegura que el pseudo-elemento :before herede correctamente el color y tamaño */
.required-indicator,
.asterisk,
.text-danger,
.fa-asterisk:before {
    color: #dc325f !important; 
    font-size: 100% !important; /* Usa el tamaño normal del texto, no lo achica */
}

/* 3. CONTENEDOR DE LA PREGUNTA (Asegurar que sea la misma línea) */
/* Mantiene el texto y el asterisco en la misma línea usando flexbox */
.question-text-container,
.survey-question-text {
    display: flex !important; 
    flex-direction: row !important; /* Fila */
    flex-wrap: wrap !important;     /* Permite que el texto largo envuelva */
    align-items: center !important; /* Centra verticalmente */
}


.text-primary {
    --bs-text-opacity: 1;
    color: #464e55 !important;
}

.text-info {
    --bs-text-opacity: 1;
    color: #464e55 !important;
}

.question-valid-container .text-info {
    position: relative;
    color: #dc3545 !important;
}

.btn-primary {
    background-color: #3d6ec1 !important;
    border-color: #3d6ec1 !important;
    color: #fff;
}



/* -------------------------------------------------------------------------- */
/* AJUSTE DE COLORES PARA LA PREGUNTA DE GÉNERO (Usando la Clase .pregunta-genero) */
/* -------------------------------------------------------------------------- */

/* ⚠️ NOTA: Asegúrate de que los valores 'M' y 'F' coincidan con los códigos 
   de respuesta que configuraste en LimeSurvey.
*/

/* ----------------------------------- */
/* MASCULINO (CÓDIGO 'M') - AZUL */
/* ----------------------------------- */

/* Estilos iniciales y al pasar el cursor (hover) */
.pregunta-genero input[value="M"] + label {
    /* Identifica la etiqueta asociada al input radio con value="M" dentro de la clase */
    border: 2px solid #589bff; /* Borde azul suave */
    color: #FFF;            /* Texto azul oscuro #004085 */
    transition: all 0.2s ease; /* Transición suave para el cambio de color */
}

/* Estilos cuando la opción está SELECCIONADA (:checked) */
.pregunta-genero input[value="M"]:checked + label {
    background-color: #007bff !important; /* Azul más fuerte */
    color: white !important;           /* Texto blanco */
    font-weight: bold;                 /* Texto en negrita para énfasis */
}

/* ----------------------------------- */
/* FEMENINO (CÓDIGO 'F') - ROSA */
/* ----------------------------------- */

/* Estilos iniciales y al pasar el cursor (hover) */
.pregunta-genero input[value="F"] + label {
    /* Identifica la etiqueta asociada al input radio con value="F" dentro de la clase */
    border: 2px solid #ff99cc; /* Borde rosa suave */
    color: #FFF;            /* Texto rosa oscuro #cc0066 */
    transition: all 0.2s ease;
}

/* Estilos cuando la opción está SELECCIONADA (:checked) */
.pregunta-genero input[value="F"]:checked + label {
    background-color: #007bff !important; /* Azul más fuerte */
    color: white !important;           /* Texto blanco */
    font-weight: bold;
}

/* ----------------------------------- */
/* AJUSTES ADICIONALES (OPCIONAL) */
/* ----------------------------------- */

/* Hace las etiquetas de selección un poco más grandes y uniformes */
.pregunta-genero label {
    min-width: 120px; /* Asegura un ancho mínimo para que se vean como "botones" */
    text-align: center;
    padding: 10px 15px;
    border-radius: 5px; /* Bordes redondeados */
}


/* -------------------------------------------------------------------------- */
/* SELECTORES GLOBALES PARA TEXTO INFORMATIVO (JUSTIFICADO Y SIN GUIONES) */
/* -------------------------------------------------------------------------- */

/* 1. SELECTOR MÁS AMPLIO: Aplica la regla a TODO el contenido del cuerpo de la página. */
.group-description,     /* Descripción de los grupos */
.question-text,         /* Texto principal de la pregunta */
.ls-questionhelp,       /* Texto de ayuda de la pregunta (el que está en cursiva) */
.control-label {        /* Etiquetas generales de las preguntas (p. ej., subpreguntas) */
    
    /* Justificación y reglas de formato */
    text-align: justify !important; /* 💡 CLAVE: Aplica la justificación */
    word-break: normal;             /* Evita cortar palabras si no cabe una completa */
    
    /* Desactivar la separación silábica (Guiones) */
    hyphens: none !important;
    -ms-hyphens: none !important;
    -moz-hyphens: none !important;
    -webkit-hyphens: none !important;
}

/* -------------------------------------------------------------------------- */
/* EXCEPCIONES NECESARIAS (Restaurar alineación izquierda o central) */
/* La justificación en estos elementos rompe la usabilidad. */
/* -------------------------------------------------------------------------- */

/* 2. Excepción 1: Campos donde el usuario escribe */
/* El texto escrito por el usuario debe ir a la izquierda. */
input[type="text"],
input[type="number"],
input[type="email"],
textarea {
    text-align: left !important; 
}

/* 3. Excepción 2: Botones y Navegación */
/* Los botones y la navegación deben ir centrados o a la izquierda, no justificados. */
.submit-buttons,
.save-submit-row,
.navbar,
.navbar *,
.logo-container,
.logo-container * {
    text-align: center !important; /* Generalmente centrados */
}


/* -------------------------------------------------------------------------- */
/* AJUSTE DE COLORES PARA LA PREGUNTA DE NACIONALIDAD (Usando la Clase .nacionalidad) */
/* -------------------------------------------------------------------------- */

/* ⚠️ NOTA: Reemplaza [CÓDIGO_V] y [CÓDIGO_E] con los códigos reales de tu encuesta. */

/* ----------------------------------- */
/* VENEZOLANO (CÓDIGO '[CÓDIGO_V]') - Color Primario (Verde/Azul) */
/* ----------------------------------- */

/* Estilos iniciales y al pasar el cursor (hover) */
.nacionalidad input[value="AO01"] + label {
    border: 2px solid #007bff; /* Borde verde suave */
    color: #fff;              /* Texto oscuro inicial */
    background-color: #eafaea; /* Fondo muy claro */
    transition: all 0.2s ease;
}

/* Estilos cuando la opción está SELECCIONADA (:checked) */
.nacionalidad input[value="AO01"]:checked + label {
    background-color: #007bff !important; /* Verde fuerte */
    color: white !important;
    font-weight: bold;
}

/* ----------------------------------- */
/* EXTRANJERO (CÓDIGO '[CÓDIGO_E]') - Color Secundario (Gris/Naranja) */
/* ----------------------------------- */

/* Estilos iniciales y al pasar el cursor (hover) */
.nacionalidad input[value="AO02"] + label {
    border: 2px solid #007bff; /* Borde naranja suave */
    color: #fff;
    background-color: #fff8e1; /* Fondo muy claro (casi blanco) */
    transition: all 0.2s ease;
}

/* Estilos cuando la opción está SELECCIONADA (:checked) */
.nacionalidad input[value="AO02"]:checked + label {
    background-color: #007bff !important; /* Naranja fuerte */
    color: white !important;
    font-weight: bold;
}

/* ----------------------------------- */
/* AJUSTES DE BOTÓN GENERALES PARA NACIONALIDAD */
/* ----------------------------------- */

/* Asegúrate de que las etiquetas se vean como botones */
.nacionalidad label {
    min-width: 140px; 
    text-align: center;
    padding: 10px 15px;
    border-radius: 5px; 
    /* El display: flex en el contenedor o display: inline-block en el label es crucial */
    display: inline-block; 
}

/* Asegura que los radios nativos estén ocultos */
.nacionalidad .answer-item input[type="radio"] {
    position: absolute !important;
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px !important;
    width: 1px !important;
    overflow: hidden;
}