/*************************************/
/*************  GENERAL **************/
/*************************************/
body {
    background-color: #5891BE;
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
    font-family: Arial, sans-serif;
}

/*********************************************/
/************* FORMULARIO INDEX **************/
/*********************************************/

/* CONTENEDOR */
.center-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /*height: 100vh;*/
    padding-top: 80px;
}

/* FORMULARIO */
.logo-container {
    width: 100%;
    display: flex;
    justify-content: center;
}

.logo {
    max-width: 1093px;
    width: 100%;
    height: auto;
}

.form-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
    width: auto;
    max-width: 100%;
}

.form-container select,
.form-container input,
.form-container button {
    margin: 5px;
 }

/* Ajustar el tamaño del formulario */
.formulario {
    max-width: 400px; /* Aumentar el ancho máximo */
    width: 90%; /* Asegurar que ocupe el 90% del ancho disponible */
    margin: auto;
    margin-top: 80px; /* Reducir el margen superior */
    transform: scale(1.1); /* Aumentar el tamaño en un 20% */
    transform-origin: top center; /* Mantener la posición superior centrada */
}

/* Aumentar el tamaño de los inputs y labels */
.form-control, .form-label {
    font-size: 1.1rem; /* Aumentar el tamaño de la fuente */
}

/* Aumentar el tamaño del botón */
.btn-primary {
    font-size: 1.1rem; /* Aumentar el tamaño de la fuente del botón */
    padding: 0.6rem 1rem; /* Aumentar el padding del botón */
}

/* Ajustar el tamaño del título del formulario */
.formulario h3 {
    font-size: 1.6rem; /* Aumentar el tamaño del título */
    margin-bottom: 1.5rem; /* Aumentar el espacio debajo del título */
}


/*********************************************/
/************* GESTIÓN FACTURAS **************/
/*********************************************/

/* CONTENEDOR */
.container-centro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 4300px; /* Aumenté el valor para permitir una tabla más ancha */
    margin: 50px auto;
}

/* BOTÓN CERRAR SESIÓN */
.boton-fijo {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
}

/* TABLA RESULTADOS */
.tabla {
    width: 100%;
    table-layout: auto; /* Cambié 'fixed' por 'auto' para ajustar el tamaño de las columnas */
    border-collapse: collapse;
}

.tabla-container {
    border: 2px solid #fff;
    width: 90vw; /* Esto ya permite que el contenedor tenga el tamaño adecuado */
    max-width: 100%;
    max-height: 500px;
    overflow-y: auto;
    margin-top: 30px;
    scrollbar-width: auto;
    scrollbar-color: #4A90E2 #f1f1f1;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: whitesmoke;
}

.tabla-container .tabla {
    flex: 1;
    overflow: auto;
}

.labels-controles {
    color: white;
    font-size: 18px;
}

.descarga-boton-container {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 40px;
}

.tabla th {
    position: sticky;
    top: 0;
    background-color: #2C5170;
    color: #fff;
    z-index: 2;
    border: 1px solid #000;
    font-weight: normal;
}

.tabla tbody {
    z-index: 1;
}

/*.tabla th {
    font-weight: normal;
}*/


.tabla th,
.tabla td {
    border: 2px solid #4A90E2; /* azul claro */
}

.tabla tbody tr td {
    background-color: #cfe2ff; /* Azul claro (puedes cambiar el tono) */
    color: #00496C; /* Texto negro para contraste */
    
}


/* AJUSTE ANCHO COLUMNAS DE LA TABLA */

/*.tabla .col-checkbox {
    width: 40px;*/ /* Ajusté el tamaño para ser más amplio */
/*}

.tabla .col-nom-fichero {
    width: 150px;*/ /* Aumenté el tamaño de esta columna */
/*}

.tabla .col-num-factura {
    width: 100px;*/ /* Aumenté el tamaño de esta columna */
/*}

.tabla .col-cod-sgae {
    width: 100px;*/ /* Aumenté el tamaño de esta columna */
/*}

.tabla .col-nom-local {
    width: 250px;*/ /* Aumenté el tamaño de la columna para más espacio */
    /*white-space: nowrap;*/ /* Evita que el texto se divida en varias líneas */
    /*overflow: hidden;*/ /* Oculta el texto que se desborda (opcional) */
    /*text-overflow: ellipsis;*/ /* Añade '...' si el texto es demasiado largo */
/*}

.tabla .col-nom-usuario {
    width: 250px;*/ /* Aumenté el tamaño de la columna para más espacio */
    /*white-space: nowrap;*/ /* Evita que el texto se divida en varias líneas */
    /*overflow: hidden;*/ /* Oculta el texto que se desborda (opcional) */
    /*text-overflow: ellipsis;*/ /* Añade '...' si el texto es demasiado largo */
/*}

.tabla .col-nif {
    width: 100px;*/ /* Aumenté el tamaño de esta columna */
/*}

.tabla .col-anio {
    width: 100px;*/ /* Aumenté el tamaño de esta columna */
/*}*/


/**************************************************/
/********* FORMULARIO CAMBIAR CONTRASEÑA **********/
/**************************************************/

/* CONTENEDOR */
.center-container_pass {
    /*display: flex;*/
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /*height: 100vh;*/
    padding-top: 80px;
}

.formulario_pass {
    max-width: 400px; /* Aumentar el ancho máximo */
    width: 90%; /* Asegurar que ocupe el 90% del ancho disponible */
    margin: auto;
    margin-top: 80px; /* Reducir el margen superior */
    transform: scale(1.1); /* Aumentar el tamaño en un 20% */
    transform-origin: top center; /* Mantener la posición superior centrada */
}

.titulo_pass {
    font-size: 1.6rem;
    text-align: center;
}


/******************************************/
/************* MENÚ SUPERIOR **************/
/******************************************/

.custom-navbar {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    background: transparent;
    padding: 10px;
}

.navbar-nav .nav-link {
    color: white !important;
    font-size: 1.2em;
    transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover {
    color: #0DCAF0 !important;
    text-decoration: underline;
}


/*********************************************/
/************* GESTIÓN CONTRATOS *************/
/*********************************************/

.container-centro-contratos {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 4300px;
    margin: 50px auto;
}

.tabla-contratos {
    /*table-layout: fixed !important; */ 
    width: 100%;
    table-layout:auto;
    border-collapse:collapse;
}


.tabla-container-contratos {
    border: 2px solid #000;
    width: 90vw;
    /*width: auto;
    max-width: 100%;*/
    max-height: 500px;
    /*overflow-x: auto;*/
    overflow-y: auto;
    margin-top: 30px;
    margin-bottom: 0;
    scrollbar-width: auto;
    scrollbar-color: #4A90E2 #f1f1f1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: whitesmoke
}


.tabla-container-contratos .tabla-contratos{
    flex: 1;
    overflow: auto;
}


.tabla-contratos th {
    position: sticky;
    top: 0;
    background-color: #2C5170;
    color: #fff;
    z-index: 2;
    border: 2px solid #000;
    font-weight: normal;
}


.tabla-contratos tbody{
    z-index: 1;
}


.tabla-contratos td {
    border: 2px solid #000;
    background: #e9f2fa;
}

.tabla-contratos th,
.tabla-contratos td {
    border: 1px solid #4A90E2; /* azul claro */
}

.tabla-contratos tbody tr td {
    background-color: #cfe2ff;
    color: #00496C; 
}



/* AJUSTE ANCHO COLUMNAS DE LA TABLA */


/*
.col-checkbox-contratos {
    width: 50px;
}

.col-nom-fichero-contratos {
    width: 580px;
}

.col-cod-contrato-contratos {
    width: 120px;
}

.col-loc-sgae-contratos {
    width: 120px;
}

.col-actividad-contratos {
    width: 160px;
}

.col-cod-sgae-contratos {
    width: 100px;
}

.col-nif-contratos {
    width: 100px;
}

.col-tit-contratos {
    width: auto;
}
/* La última columna puede ser flexible */




/*
.tabla-contratos th.col-checkbox-contratos,
.tabla-contratos td.col-checkbox-contratos {
    width: 40px;
}

.tabla-contratos th.col-nom-fichero-contratos,
.tabla-contratos td.col-nom-fichero-contratos {
    width: 280px;
}

.tabla-contratos th.col-cod-contrato-contratos,
.tabla-contratos td.col-cod-contrato-contratos {
    width: 50px;
}

.tabla-contratos th.col-loc-sgae-contratos,
.tabla-contratos td.col-loc-sgae-contratos {
    width: 50px;
}

.tabla-contratos th.col-actividad-contratos,
.tabla-contratos td.col-actividad-contratos {
    width: 80px;
}
    
.tabla-contratos th.col-cod-sgae-contratos,
.tabla-contratos td.col-cod-sgae-contratos {
    width: 60px;
}

.tabla-contratos th.col-nif-contratos,
.tabla-contratos td.col-nif-contratos {
    width: 30px;
}

.tabla-contratos th.col-tit-contratos,
.tabla-contratos td.col-tit-contratos {
    width: 200px;
}

/*

.tabla-contratos col-checkbox-contratos
{
    width: 40px;
}

    
.tabla-contratos col-nom-fichero-contratos {
    width: 860px;
}

    
.tabla-contratos col-cod-contrato-contratos {
    width: 40px;
}

    
.tabla-contratos col-loc-sgae-contratos {
    width: 40px;
}

    
.tabla-contratos col-actividad-contratos {
    width: 50px;
}

  
.tabla-contratos col-cod-sgae-contratos {
    width: 40px;
}

 
.tabla-contratos col-nif-contratos {
    width: 30px;
}

    
.tabla-contratos col-tit-contratos {
    width: 100px;
}

*/


/*********************************************/
/************* GESTIÓN DEUDA *************/
/*********************************************/

.container-centro-deuda {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 4300px;
    /*margin: 50px auto;*/
}

.tabla-deuda {
    /*table-layout: fixed !important; */
    width: 100%;
    table-layout: auto;
    border-collapse: collapse;
}


.tabla-container-deuda {
    border: 2px solid #fff;
    width: 90vw;
    /*width: auto;
    max-width: 100%;*/
    max-height: 500px;
    /*overflow-x: auto;*/
    overflow-y: auto;
    margin-top: 30px;
    margin-bottom: 0;
    scrollbar-width: auto;
    scrollbar-color: #4A90E2 #f1f1f1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: whitesmoke;
}


.tabla-container-deuda .tabla-deuda {
    flex: 1;
    overflow: auto;
}


.tabla-deuda th {
    position: sticky;
    top: 0;
    background-color: #2C5170;
    color: #fff;
    z-index: 2;
    border: 1px solid #fff;
    font-weight: normal;
}


.tabla-deuda tbody {
    z-index: 1;
}


.tabla-deuda td {
    border: 2px solid #fff;
    background: #e9f2fa;
}

.tabla-deuda th,
.tabla-deuda td {
    border: 2px solid #4A90E2; /* azul claro */
}

.tabla-deuda tbody tr td {
    background-color: #cfe2ff; 
    color: #00496C;