/* Evitar scroll horizontal en toda la página */
body {
    overflow-x: hidden; /* Esto evitará el desplazamiento horizontal */
    margin: 0; /* Eliminar márgenes predeterminados */
    padding: 0; /* Eliminar relleno predeterminado */
    width: 100%; /* Asegurarse de que el body ocupe todo el ancho de la pantalla */
    
    font-family: 'Arial', sans-serif;
    font-size: 12px;
}

/* Asegurar que el contenido se ajuste a la pantalla */
html, body {
    height: 100%; /* Asegurar que la altura ocupe todo el espacio disponible */
    width: 100%;  /* Asegurar que el ancho ocupe todo el espacio disponible */
}

/* Si estás usando un contenedor principal, asegúrate de que no se desborde */
.container-fluid, .container {
    max-width: 100%; /* Evita que se desborde el ancho */
    padding: 0; /* Eliminar relleno innecesario */
}

/* Para evitar el desbordamiento horizontal en otros elementos */
* {
    box-sizing: border-box; /* Incluye los márgenes y rellenos dentro del tamaño total */
}



h1 {
    text-align: center;
}



/* Hacer que la tabla se ajuste al ancho de la pantalla */
table {
    width: 100%; /* Asegura que la tabla ocupe todo el ancho disponible */
    table-layout: fixed; /* Hace que las columnas se ajusten de manera proporcional */
    border-collapse: collapse; /* Elimina los bordes dobles */
}

/* Estilo para las celdas de la tabla */
th, td {
    padding: 8px; /* Espaciado interno de las celdas */
    text-align: left; /* Alineación del texto a la izquierda */
    border: 1px solid #ddd; /* Borde de las celdas */
}

/* Estilo para las filas alternas (si deseas cambiar el color de fondo) */
tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* Estilo para las cabeceras */
th {
    background-color: #4CAF50; /* Color de fondo para las cabeceras */
    color: white; /* Color de texto en las cabeceras */
}

/* Asegurarse que los elementos de la tabla no desborden */
table, th, td {
    max-width: 100%; /* Evitar que se desborden de la pantalla */
    word-wrap: break-word; /* Hacer que el texto largo se divida para evitar el desbordamiento */
    box-sizing: border-box; /* Asegurarse de que el relleno no cause desbordamiento */
}

/* Responsividad: hacer que la tabla se ajuste en pantallas pequeñas */
@media (max-width: 768px) {
    /* Hacer que la tabla sea desplazable horizontalmente en pantallas pequeñas */
    .table-responsive {
        overflow-x: auto; /* Permite el scroll horizontal en pantallas pequeñas */
        -webkit-overflow-scrolling: touch; /* Habilitar desplazamiento suave en iOS */
    }
}



.card {
        background-color: rgba(255, 255, 255, 0.85); /* Blanco con transparencia */
        backdrop-filter: blur(5px); /* Suaviza el fondo */
    }

    .chart-fixed-height {
        height: 300px !important;
    }
        .chart-fixed-height {
            height: 300px !important;
        }



/* REGISTRO */

.card {
    border-radius: 15px;
}

.btn-primary {
    background-color: #4CAF50;
    border-color: #4CAF50;
}

.btn-primary:hover {
    background-color: #45a049;
    border-color: #45a049;
}