html,body {
    height: 100%;
    margin:0;
}

.container-fluid{
    display: flex;
    flex-direction: column;
    min-height: 100vh; 
}

.formato{
    font-family: Arial, sans-serif;
    background-color: #7a7a7a;
    color: #ffffff;
}

.color_button{
    background-color: #7a7a7a;
    color: black
}

.colorflat{
    background: #0c8ec2 !important;/*azul */
}

.solo-mayus {
    text-transform: uppercase;
}

/* --- OPTIMIZACIONES DE ADAPTABILIDAD --- */

/* Forzar que el contenedor principal use todo el alto útil sin desbordar */
.height-max {
    min-height: calc(100vh - 120px); /* Resta el tamaño aproximado del banner de base.php */
}

/* Evitar que los textos largos en celdas estiren la tabla artificialmente */
.table td, .table th {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 250px;
    overflow: hidden;
}

/* Ajustes finos para pantallas de Laptop o Notebooks (Menores a 1400px) */
@media (max-width: 1400px) {
    body {
        font-size: 13px; /* Reduce un punto la fuente general para optimizar espacio */
    }

    .table {
        font-size: 12px; /* Las tablas reducen ligeramente su tamaño para no requerir tanto scroll */
    }

    .p-4 {
        padding: 1.5rem !important; /* Optimiza márgenes internos del panel central */
    }
}

/* Manejo del banner superior para que no se coma la pantalla en la Laptop */
.contenedorbanner img {
    width: 100%;
    height: auto;
    max-height: 120px; /* Limita la altura del banner superior para ganar espacio de trabajo vertical */
    object-fit: cover;
}