/* Importar la fuente Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');

:root {
    /* Colores Principales */
    --color-Principal: #002a7f; /* Azul oscuro */
    --color-PrincipalClaro: #4852af; /* Azul claro */
    --color-PrincipalFuerte: #000152; /* Azul muy oscuro */

    /* Colores Secundarios */
    --color-Secundario: #a3bd36; /* Verde */
    --color-SecundarioClaro: #d7f068; /* Verde claro */
    --color-SecundarioFuerte: #d7f068; /* Verde intenso */
    
    --color-Secundario70:rgba(163, 189, 54,0.7);  /* Color Verde Secundario al 70% opacicty*/
    --color-Secundario50:rgba(163, 189, 54,0.5);  /* Color Verde Secundario al 50% opacicty*/
    --color-Secundario30:rgba(163, 189, 54,0.3);  /* Color Verde Secundario al 30% opacicty*/

    /* Colores Neutros */
    --color-Neutro: #c5c5c5; /* Gris claro */
        --color-Neutro70:rgba(197, 197, 197, 0.7);  /* Color Gris claro al 70% opacicty*/
    --color-Neutro50:rgba(197, 197, 197,0.5);  /* Color Gris claro al 50% opacicty*/
    --color-Neutro30:rgba(197, 197, 197,0.3);  /* Color Gris claro al 30% opacicty*/
    --color-NeutroClaro: rgba(197, 197, 197, 0.25); /* Gris claro con transparencia */
    --color-NeutroFuerte: #272d3b; /* Gris oscuro */


    /* Colores de Error */
    --color-Error: #f44336; /* Rojo */
    --color-ErrorClaro: #ff7961; /* Rojo claro */
    --color-ErrorFuerte: #ba000d; /* Rojo oscuro */

    /* Colores de Avisos */
    --color-Avisos: #fcc835; /* Amarillo */
    --color-AvisosClaro: #ffff6b; /* Amarillo claro */
    --color-AvisosFuerte: #c6a700; /* Amarillo intenso */

    /* Colores de Éxito */
    --color-Exito: #64dd17; /* Verde éxito */
    --color-ExitoClaro: #9cff57; /* Verde éxito claro */
    --color-ExitoFuerte: #1faa00; /* Verde éxito oscuro */

    /* fuente principal */
    --fuente-Principal: 'Montserrat', sans-serif; 
}

/* Aplica la fuente principal en el cuerpo del documento */
body {
    font-family: var(--fuente-Principal) !important;
}
.container {
    width: 100% !important;
    background-color:#F6F6F6 !important;
}
/* Modifica el estilo del scroll */
.scrollable{
  overflow-x: auto;
  overflow-y: auto;
  width: 100%;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) #f1f1f1;
}

/* Modifica los colores del marco de boostrap */
.panel-default,.panel-default > .panel-heading,.panel-footer,html,.container{
background-color: #F6F6F6 !important;
border-color: white !important;
} 

/* Personaliza el spinner */
.blockUI.blockMsg.blockPage {
    width: 200px !important; 
    height: 200px !important;
    display: flex; 
    justify-content: center;
    align-items: center; 
}
/* svg seekop */
.img.blockUIDefaultImg {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" style="margin: auto; display: block; shape-rendering: auto;" width="300" height="300" viewBox="0 0 100 100"><path fill="none" stroke="%23a3bd36" stroke-width="7" stroke-dasharray="133.42624267578125 123.162685546875" d="M24.3 30C11.4 30 5 43.3 5 50s6.4 20 19.3 20c19.3 0 32.1-40 51.4-40 C88.6 30 95 43.3 95 50s-6.4 20-19.3 20C56.4 70 43.6 30 24.3 30z" stroke-linecap="round" style="transform:scale(0.81);transform-origin:50px 50px"><animate attributeName="stroke-dashoffset" repeatCount="indefinite" dur="1.408450704225352s" keyTimes="0;1" values="0;256.58892822265625"></animate></path></svg>') no-repeat center center / contain; 
    width: 100%; 
    height: 100%; 
}

/* svg xlsx */
.imgXlsx {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14,2H6A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M15.8,20H14L12,16.6L10,20H8.2L11.1,15.5L8.2,11H10L12,14.4L14,11H15.8L12.9,15.5L15.8,20M13,9V3.5L18.5,9H13Z" fill="%23A3BD36"/></svg>') no-repeat center center / contain; 
    width: 35px; /* Ajusta el tamaño */
    height: 35px; /* Ajusta el tamaño */
    margin-left: 8px; /* Espacio entre el texto y el SVG */
    display: inline-block; /* Asegúrate de que sea en línea */
}

/*Estilos para estilizar scrolls*/
::-webkit-scrollbar {
  width: 3px;
}
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background-color: #c5c5c5;
  border-radius: 4px;
}
/* Fondo de la barra de desplazamiento */
::-webkit-scrollbar-track {
  background-color: #f0f0f0;
}

/*Estilos para Tables*/
thead {
    position: sticky;
    top: -1px;    
    z-index: 1;
    background-color: #F6F6F6 !important;
}


.tituloPrincipal{
    background-color: var(--color-Principal);
    color: white;font-weight: 900;
    text-align: center;
    border-radius: 20px;
}
.Card{
    margin-bottom: 40px;
    background: #ffffff;
    box-shadow: 0px 3px 6px rgba(197, 197, 197, .5019607843);
    border-radius: 20px;
    opacity: 1;
    padding: 18px 0px 28px 0px;    
} 
.btnV10 {
    border: 0 !important;
    gap: 6px !important;
    cursor: pointer !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    color: black !important;
    display: flex; /* Asegúrate de que el botón sea un contenedor flex */
    align-items: center; /* Alinea los elementos verticalmente al centro */
    padding: 10px; /* Ajusta el padding según necesites */
}
#exportBtn:active,
#exportBtn:focus,
#exportBtn:hover{
    background-color: transparent !important; /* Evita que cambie el fondo al hacer clic */
    border: none !important; /* Evita que aparezca borde al hacer clic o al enfocarlo */
    box-shadow: none; /* Elimina cualquier sombra que pueda aparecer al hacer clic */
    outline: none; /* Elimina el borde de enfoque */
} 
.buttonWrapper{
    display: flex;
    flex-direction: row-reverse;
    background-color: white;
}
.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) {
    background-color: white !important;
}