:root {
    /* Color que se cambian globalmente */
    --color-fondo: #F6FBFE !important;
    --color-header: #D6E6F2 !important;
    --color-logo-fondo: #DFF5FF !important;
    --color-menu: #5FA1D3 !important;
    --color-menu-over: #46446b !important;
    --color-buscador: #F5F5F5 !important;
    --color-faceta: #5FA1D3 !important;
    --color-faceta-cuerpo: #C6DAEA !important;
    --color-faceta-separador: #DFEBF4 !important;
    --color-faceta-numero: #7AB2D3 !important;
    --color-fondo-panel-busqueda: #5FA1D3 !important;
    --color-fondo-panel: #EEEEEE !important;
    --color-fondo-panel-resultado: #EEEEEE !important;
    --color-texto-panel-resultado: #2c2a2a !important;
    --color-borde-panel: #8484a3 !important;
    --color-linea-superior: #769FCD !important;
    --color-btn-principal: #1D3589 !important;
    --color-btn-principal-over: #180617 !important;
    --color-btn-secundario: #151c46 !important;
    --color-btn-secundario-over: #67C6E3 !important;
    --color-btn-orden-cantidad: #6F778A !important;
    --color-btn-orden-cantidad_seleccionado: #273c83 !important;
    --color-btn-arriba: #378CE7 !important;
    --color-btn-arriba-over: #769FCD !important;
}

/* https://www.colorhunt.co/palette/dff2ebb9e5e87ab2d34a628a
https://www.colorhunt.co/palette/5356ff378ce767c6e3dff5ff
https://www.colorhunt.co/palette/f7fbfcd6e6f2b9d7ea769fcd
*/

/* Cabecera del sitio */
#header {
    /*background-image: url("bg_clasificacion_ddhh01.jpg");
    background-color: var(--color-header) !important;
    */
    background-image: linear-gradient(to right, #5FA1D3 , #FFFFFF);
    border-bottom: 1px solid #ffffff;
}

/* Nombre del buscador en el header */
#nombre_buscador {
    color: var(--color-buscador) !important;
    text-shadow: 1px 1px 2px var(--color-linea-superior) !important;
}
.navbar-form-custom {
    width: 800px !important;
}

body {
  background-color: #fff;
  color: var(--color-texto-panel-resultado) !important;
}

/* Boton Menu  */
.header-link {
    background: var(--color-menu) !important;
    border-right: 1px solid #000000;
    border-left: 1px solid #000000;
}

.header-link:hover {
    background: var(--color-menu-over) !important;
}

/* Logo Color */
#logo.light-version {
    background-color: var(--color-logo-fondo) !important;
    border-bottom: 1px solid #ffffff;
}

/* Color de fondo */
#wrapper {
    background: var(--color-fondo) !important;
    border-left: 1px solid #e4e5e7;
}
/* Fondo cuadros busqueda */
.ambos_paneles_busqueda .panel-body  {
    background: var(--color-fondo-panel-busqueda) !important;
}

/* Fondo cuadros resultados */
#resultado_busqueda_div .hpanel .panel-body {
    background: var(--color-fondo-panel) !important;
    border: 1px solid var(--color-borde-panel) !important;
}

/* Fondo dentro de los cuadros resultados  */
.contenido_resultado_div {
    background: var(--color-fondo-panel-resultado) !important;
    color: var(--color-texto-panel-resultado) !important;
}


/* Faceta  */
.hpanel .hbuilt.panel-heading {
    background: var(--color-faceta) !important;
    color: #ffffff;
    text-shadow: 1px 1px 2px var(--color-linea-superior) !important;
}

/* Cuerpo de Faceta */
.list-group-item {
  background-color: var(--color-faceta-cuerpo) !important;
  border: 1px solid var(--color-faceta-separador) !important;
}separador

/* Pie de faceta */
.hpanel .panel-footer {
    background: var(--color-fondo-panel-resultado) !important;
    color: #ffffff;
    text-shadow: 1px 1px 2px var(--color-linea-superior) !important;
}

/* Color del numero en la faceta */
.badge.badge-primary {
  background: var(--color-faceta-numero) !important;
}

/* Linea superior del header */
.color-line {
    background: var(--color-linea-superior) !important;
    height: 6px;
    background-size: 100% 6px;
    background-position: 50% 100%;
    background-repeat: no-repeat;
}

/* Boton guardar busqueda  */
.btn-primary {
    background-color: var(--color-btn-principal) !important;
    border-color: #000000;
    color: #FFFFFF;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-color: var(--color-btn-principal-over) !important;
    border-color: #000000 !important;
    color: #FFFFFF;
}

/* Boton Descarga masiva  */
.btn-info {
    background-color: var(--color-btn-secundario) !important;
    border-color: #000000 !important;
    color: #FFFFFF;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
    background-color: var(--color-btn-secundario-over) !important;
    border-color: #000000 !important;
    color: #FFFFFF;
}

.btn_todo_fac {
  border-color: #000000 !important;
}

/* Botones ordenamiento y resultados por pagina, seleccionados */
.label-warning {
    background-color: var(--color-btn-orden-cantidad_seleccionado) !important;
}

.label-warning[href]:hover,
.label-warning[href]:focus {
    background-color: var(--color-btn-orden-cantidad_seleccionado) !important;
}

/* Botones ordenamiento y resultados por pagina, No seleccionados */
.label-info {
    background-color: var(--color-btn-orden-cantidad) !important;
}

.label-info[href]:hover,
.label-info[href]:focus {
    background-color: var(--color-btn-orden-cantidad) !important;
}


/* Boton subir desde el fondo de la pagina    */
#boton_arriba {
    background-color: var(--color-btn-arriba) !important;
}

#boton_arriba::after {
    color: #ffffff;
}

#boton_arriba:hover {
    cursor: pointer;
    background-color: var(--color-btn-arriba-over) !important;
}

#boton_arriba:active {
    background-color: var(--color-btn-arriba-over) !important;
}

#boton_arriba.show {
    opacity: 1;
    visibility: visible;
}