/* =========================================================
   PALETA LA NAVE
   ========================================================= */
:root{
  --nave-azul: #323ffa;
  --nave-azul-oscuro: #1f2acb;
  --nave-amarillo: #f5c400;
  --nave-gris: #f4f6fb;
  --nave-gris-borde: #e0e4f0;
  --nave-texto: #2b2b2b;
  --nave-blanco: #ffffff;
}

/* =========================================================
   BASE
   ========================================================= */
body{
    color: var(--nave-texto);
}

/* =========================================================
   NAVEGACIÓN SUPERIOR (TABS)
   ========================================================= */
ul#css_nav{
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

ul#css_nav li{
    list-style: none;
    padding: 10px 18px;
    background: #e9ecf8;
    border-radius: 10px 10px 0 0;
    font-weight: 600;
    cursor: pointer;
    color: #555;
}

ul#css_nav li.css_nav_current_page{
    background: var(--nave-azul);
    color: white !important;
}

ul#css_nav li a:link,
ul#css_nav li a:visited{
    height: 40px;
}

/* =========================================================
   FORMULARIOS – INPUTS
   ========================================================= */
input[type="text"],
input[type="number"],
input[type="email"],
input[type="date"],
select,
textarea,
.cf_datepicker{
    width: 100%;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--nave-gris-borde);
    background: var(--nave-blanco);
    font-size: 14px;
    color: var(--nave-texto);
    transition: all .2s ease;
}

input:focus,
select:focus,
textarea:focus{
    outline: none;
    border-color: var(--nave-azul);
    box-shadow: 0 0 0 3px rgba(50,63,250,.15);
}

/* =========================================================
   COMENTARIOS / AYUDAS
   ========================================================= */
.cf_field_comments{
    font-size: 13px;
    font-style: italic;
    color: var(--nave-azul-oscuro);
    background: #eef1ff;
    padding: 8px 12px;
    border-left: 4px solid var(--nave-azul);
    border-radius: 6px;
    margin-bottom: 20px;
}

/* =========================================================
   LISTAS DE OPCIONES
   ========================================================= */
.cf_option_list_2cols .column{
    width: 100%;
    float: left;
}

.cf_option_list_2cols,
.cf_option_list_3cols,
.cf_option_list_4cols{
    margin-left: 20px;
}

/* =========================================================
   MENSAJES
   ========================================================= */
.mensaje span{
    display: block;
    text-align: justify;
    margin-top: 20px;
}

/* =========================================================
   DIALOG / POPUP
   ========================================================= */
.ui-dialog.ui-widget{
    width: 750px !important;
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
    border: none;
}

/* =========================================================
   IFRAME ENCUESTA
   ========================================================= */
#FrameEncuesta{
    width: 100%;
    height: 1100px;
    border: none;
}

/* =========================================================
   BOTONES
   ========================================================= */
button,
table tr button{
    background: var(--nave-azul);
    border: none;
    min-height: 30px;
    min-width: 30px;
    color: white;
    font-weight: 700;
    font-size: 14px;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    transition: all .2s ease;
}

button:hover{
    background: var(--nave-azul-oscuro);
    transform: translateY(-1px);
}

/* =========================================================
   FECHAS
   ========================================================= */
span.fecha{
    white-space: nowrap;
}

span.fecha label{
    width: 50px;
    min-width: 50px;
    display: inline-block;
}

/* =========================================================
   TABLAS – PLAN DE TRABAJO
   ========================================================= */
table.plan_trabajo{
    border-collapse: collapse;
    margin-top: 20px;
    width: 100%;
    background: var(--nave-blanco);
    border-radius: 10px;
    overflow: hidden;
}

table.plan_trabajo thead tr{
    background: var(--nave-azul);
    color: white;
}

table.plan_trabajo thead tr th,
table.plan_trabajo tfoot tr th{
    padding: 8px 10px;
    color: white;
}

table.plan_trabajo tbody tr td{
    padding: 8px 10px;
}

table.plan_trabajo tbody tr:nth-child(even){
    background: var(--nave-gris);
}

table.plan_trabajo tfoot tr th{
    text-align: right;
    background: var(--nave-azul-oscuro);
}

table.plan_trabajo input,
table.plan_trabajo textarea{
    padding: 6px;
}

table.plan_trabajo select{
    width: auto !important;
}

/* =========================================================
   TABLA PRESUPUESTO
   ========================================================= */
table.presupuesto{
    display: block;
    overflow-x: auto;
}

/* =========================================================
   VISIBILIDAD CONDICIONAL – INTEGRANTES
   ========================================================= */
#div_integrantes .eps,
#div_integrantes .grado,
#div_integrantes .institucion,
#div_integrantes .alergias_c,
#div_integrantes .cualalergia_c,
#div_integrantes .vacunado_c,
#div_integrantes .dosis_c,
#div_integrantes .talla_c,
#div_integrantes .antiguedad_c,
#div_integrantes .rol_c,
#div_integrantes .nombreacudiente_c,
#div_integrantes .identificacionacudiente_c,
#div_integrantes .vegetariano_c{
    display: none;
}

#div_integrantes select[name^=convocatorias_rol_c] option[value="I"]{
    display: none;
}

#div_integrantes select[name^=convocatorias_tipo_documento] option[value="TI"],
#div_integrantes select[name^=convocatorias_tipo_documento] option[value="RC"],
#div_integrantes select[name^=convocatorias_tipo_documento] option[value="PEP"],
#div_integrantes select[name^=convocatorias_tipo_documento] option[value="APEP"],
#div_integrantes select[name^=convocatorias_tipo_poblacion_c] option[value="AM"],
#div_integrantes select[name^=convocatorias_tipo_poblacion_c] option[value="N"]{
    display: none;
}

/* =========================================================
   RESUMEN INTEGRANTES
   ========================================================= */
table.integrantes .antiguedad_c,
table.integrantes .grado,
table.integrantes .institucion,
table.integrantes .talla_c,
table.integrantes .vacunado_c,
table.integrantes .dosis_c,
table.integrantes .vegetariano_c,
table.integrantes .nombreacudiente_c,
table.integrantes .identificacionacudiente_c{
    display: none;
}
/* =========================================================
   OVERRIDE TABS – LA NAVE
   ========================================================= */

/* Tabs inactivos */
ul#css_nav li{
    background: #e9ecf8 !important;
    color: #4a4a4a !important;
    border: none !important;
}

/* Tab activo (antes verde) */
ul#css_nav li.css_nav_current_page{
    background-color: #323ffa !important;   /* AZUL LA NAVE */
    border-color: #323ffa !important;
    color: #ffffff !important;
    font-weight: 700;
}

/* Hover tabs */
ul#css_nav li:hover{
    background: #dfe3ff !important;
}

/* =========================================================
   BOTÓN "GUARDAR Y CONTINUAR"
   ========================================================= */

input#form_tools_continue,
input[type="submit"]{
    background-color: #323ffa !important;   /* AZUL LA NAVE */
    border: none !important;
    color: #ffffff !important;
    font-size: 18px !important;
    padding: 12px 26px !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    cursor: pointer;
    transition: all .25s ease;
    box-shadow: 0 8px 18px rgba(50,63,250,.25);
}

/* Hover botón */
input#form_tools_continue:hover,
input[type="submit"]:hover{
    background-color: #1f2acb !important; /* Azul oscuro */
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(31,42,203,.35);
}

/* =========================================================
   BOTONES SECUNDARIOS (si aparecen)
   ========================================================= */
button,
table tr button{
    background-color: #323ffa !important;
    color: white !important;
    border-radius: 8px;
}

/* =========================================================
   ELIMINAR VERDES HEREDADOS
   ========================================================= */
[style*="#5cb85c"],
.bg-success,
.btn-success{
    background-color: #323ffa !important;
    border-color: #323ffa !important;
    color: #ffffff !important;
}


body{
    background: linear-gradient(
        135deg,
        #1f2acb 0%,
        #323ffa 50%,
        #1f2acb 100%
    );
}

/* Card blanca encima */
.ts_content{
    background: #ffffff;
    border-radius: 0 !important;
    padding: 30px;
    box-shadow: 0 25px 50px rgba(0,0,0,.25);
}
/* =========================================================
   CARD FORMULARIO – BORDE AMARILLO LA NAVE
   ========================================================= */
.ts_content{
    background: #ffffff;
    border-radius: 18px;
    padding: 30px;
    border: 4px solid #f5c400; /* AMARILLO LA NAVE */
    box-shadow: 0 20px 40px rgba(0,0,0,.12);
}

/* =========================================================
   ELIMINAR BORDE VERDE EXTERNO
   ========================================================= */

/* Contenedor general */
.ts_page{
    border: none !important;
    outline: none !important;
}

/* Por si viene de form o fieldset */
.ts_page form,
.ts_page fieldset{
    border: none !important;
    outline: none !important;
}

/* Neutralizar cualquier verde heredado */
[style*="#5cb85c"],
[style*="green"]{
    border-color: transparent !important;
}

/* =========================================================
   BORDE AMARILLO CABECERA (IMAGEN)
   ========================================================= */
.ts_header img{
    border: none !important;
}
.ts_header{
    border: 4px solid #f5c400; /* Amarillo La Nave */
}
/* =========================================================
   TABS – VERSIÓN FINAL (CURVOS + LIMPIOS)
   ========================================================= */

ul#css_nav{
    display: flex;
    gap: 14px;
    margin-bottom: 20px;
}

/* TAB BASE */
ul#css_nav li{
    list-style: none;
    padding: 12px 22px;
    font-size: 16px;
    font-weight: 600;
    color: #666;
    background: #eef1f7;
    border-radius: 12px 12px 0 0;   /* CURVOS arriba */
    cursor: pointer;
    transition: all .25s ease;
}

/* Hover */
ul#css_nav li:hover{
    background: #e3e7ff;
    color: #323ffa;
}

/* TAB ACTIVO */
ul#css_nav li.css_nav_current_page{
    background: #323ffa;
    color: #ffffff;
    font-weight: 700;
}

/* ---------------------------------------------------------
   NEUTRALIZAR <a> (CLAVE para quitar el gris)
   --------------------------------------------------------- */
ul#css_nav li a,
ul#css_nav li a:link,
ul#css_nav li a:visited,
ul#css_nav li a:hover,
ul#css_nav li a:active{
    all: unset;
    color: inherit;
    cursor: pointer;
    display: block;
}
