/* Forzar ancho máximo correcto en el modal */
.backoffice .modal-dialog {
    max-width: 90% !important;  /* como lo veías local */
}

/* Centrado del header del modal */
.backoffice .modal-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Ajustar título secundario */
.backoffice .modal-header h4 {
    margin-top: 0.5rem;
}

/* Centrar el botón de descarga */
.backoffice #downloadFileBtn {
    margin-top: 1rem;
}

/* media query para reducir tamaño y padding para resoluciones <= 1366 */
@media (max-width: 1366px) {
    .table th, 
    .table td {
        font-size: 0.75rem;   /* más chica la fuente */
        padding: 0.25rem;     /* menos espacio interno */
        white-space: normal;  /* que no salte de línea */
    }

    .table {
        font-size: 0.8rem;
    }

    .acciones-column {
        width: auto;          /* Permite un poco más de flexibilidad */
        white-space: normal;  /* Si hay poco espacio, que pueda bajar de línea */
    }

    .acciones-column .btn {
        padding: 0.25rem 0.4rem;
        font-size: 0.7rem;
    }

    .acciones-column i {
        font-size: 0.8rem;
    }
}

.acciones-column {
    width: 1%;  /* Esto hace que la columna tome solo lo que necesita */
    white-space: nowrap;   /* Evita saltos de línea innecesarios */
    padding: 0.25rem 0.5rem;
    text-align: left; 
    vertical-align: middle;        
}

/* Hacer que la tabla use ancho automático según contenido */
.table {
    table-layout: auto;            /* Permite que las columnas tomen el ancho de su contenido */
    width: 100%;                    /* La tabla sigue ocupando toda la pantalla */
}