/* Asegurarse de que el header ocupe el 100% del ancho de la pantalla */
header.menu_sistema {
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #000; /* Asegurarse que el color del fondo ocupe todo el ancho */
}

/* Ajustes para la clase container */
.container {
    max-width: 100%; /* Ocupa todo el ancho de la pantalla */
    padding-left: 15px;
    padding-right: 15px;
}

/* Asegurarse que los elementos del header (dentro de .menu_sistema) se ajusten correctamente */
.menu_sistema .d-flex {
    justify-content: space-between; /* Separar el contenido del header */
    align-items: center; /* Alineación vertical */
}

/* Ajuste para los contenedores de los grupos */
.grupos-container table {
    border-spacing: 20px; /* Espacio entre las celdas */
    width: 100%; /* Asegurar que la tabla tome todo el ancho disponible */
}

.grupos-container td {
    vertical-align: top; /* Alinear el contenido de las celdas al inicio */
}

.grupos-container .card {
    width: 280px;
    display: inline-block;
    box-shadow: 4px 9px 8px 5px rgb(0 0 0 / 41%);
    background: black;
}
.accordion-button:not(.collapsed) {
    color: #ffffff;
    background-color: #000000;
}
.card h5 {
    margin: 0;
    background-color: #ffc107;
    text-align: center;
    color: #000000;
    padding: .7rem .5rem;
    font-size: 1rem;
    border-radius: 5px 5px 0 0;
    border-bottom: solid 10px #000;
}
/* estilos de botones estatus*/

/* Cambiar el borde superior según el estatus */
.estatus-pendiente {
    border-top: 2px solid #7c1500; /* Amarillo para pendientes */
}
.estatus-en-proceso {
    border-top: 2px solid #007bff; /* Azul para en proceso */
}
.estatus-completada {
    border-top: 2px solid #28a745; /* Verde para completadas */
}
.estatus-no-asignado {
    border-top: 2px solid #6c757d; /* Gris para no asignado */
}
.badge-avance {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 0.9rem;
    background-color: #007bff; /* Puedes cambiar este color según lo que desees */
}
.badge {
    margin-left: -15px; /* Ajusta según sea necesario */
    margin-top: -10px;
}