/* ============================================
   CORRECTION DU DÉPASSEMENT DES TABLEAUX
   S'applique à tous les onglets de l'application
   ============================================ */

/* Conteneurs de tableaux - Correction globale */
.data-grid-container,
.table-container,
.advanced-table-container,
.controle-table-container,
.history-table-container,
.rapport-table-container,
.excel-table-container,
.arrets-table-container,
.production-table-container,
.management-table-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    position: relative !important;
    box-sizing: border-box !important;
}

/* Wrapper pour les tableaux dans les sections */
.table-wrapper,
.grid-wrapper,
.data-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    box-sizing: border-box !important;
}

/* Scrollbar personnalisée pour les conteneurs de tableaux */
.data-grid-container::-webkit-scrollbar,
.table-container::-webkit-scrollbar,
.advanced-table-container::-webkit-scrollbar,
.controle-table-container::-webkit-scrollbar,
.history-table-container::-webkit-scrollbar,
.rapport-table-container::-webkit-scrollbar,
.excel-table-container::-webkit-scrollbar,
.arrets-table-container::-webkit-scrollbar,
.production-table-container::-webkit-scrollbar {
    height: 10px !important;
}

.data-grid-container::-webkit-scrollbar-track,
.table-container::-webkit-scrollbar-track,
.advanced-table-container::-webkit-scrollbar-track,
.controle-table-container::-webkit-scrollbar-track,
.history-table-container::-webkit-scrollbar-track,
.rapport-table-container::-webkit-scrollbar-track,
.excel-table-container::-webkit-scrollbar-track,
.arrets-table-container::-webkit-scrollbar-track,
.production-table-container::-webkit-scrollbar-track {
    background: #f1f5f9 !important;
    border-radius: 5px !important;
}

.data-grid-container::-webkit-scrollbar-thumb,
.table-container::-webkit-scrollbar-thumb,
.advanced-table-container::-webkit-scrollbar-thumb,
.controle-table-container::-webkit-scrollbar-thumb,
.history-table-container::-webkit-scrollbar-thumb,
.rapport-table-container::-webkit-scrollbar-thumb,
.excel-table-container::-webkit-scrollbar-thumb,
.arrets-table-container::-webkit-scrollbar-thumb,
.production-table-container::-webkit-scrollbar-thumb {
    background: #cbd5e1 !important;
    border-radius: 5px !important;
}

.data-grid-container::-webkit-scrollbar-thumb:hover,
.table-container::-webkit-scrollbar-thumb:hover,
.advanced-table-container::-webkit-scrollbar-thumb:hover,
.controle-table-container::-webkit-scrollbar-thumb:hover,
.history-table-container::-webkit-scrollbar-thumb:hover,
.rapport-table-container::-webkit-scrollbar-thumb:hover,
.excel-table-container::-webkit-scrollbar-thumb:hover,
.arrets-table-container::-webkit-scrollbar-thumb:hover,
.production-table-container::-webkit-scrollbar-thumb:hover {
    background: #94a3b8 !important;
}

/* Tous les tableaux - Respect des conteneurs */
table,
.data-grid,
#productionTable,
#arretsTable,
#advancedTable,
.history-grid,
.rapport-grid,
.excel-grid {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: auto !important;
    box-sizing: border-box !important;
}

/* Tableau de contrôle - Exception pour permettre le scroll horizontal */
.controle-grid {
    width: 100% !important;
    min-width: 1200px !important;
    max-width: none !important;
    table-layout: auto !important;
    box-sizing: border-box !important;
}

/* Conteneurs de contenu - Limitation de largeur */
.tab-panel,
.tab-content,
.production-content,
.arrets-content,
.controle-content,
.advanced-content,
.rapport-content,
.excel-content,
.history-content {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    padding: 0 20px !important;
}

/* Content groups - Respect des limites */
.content-group {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* Sections avec tableaux */
.grid-section,
.table-section,
.chart-section {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* Grid containers */
.grid-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* Responsive - Petits écrans */
@media (max-width: 1400px) {
    .data-grid-container,
    .table-container,
    .advanced-table-container,
    .controle-table-container,
    .history-table-container,
    .rapport-table-container,
    .excel-table-container,
    .arrets-table-container,
    .production-table-container {
        overflow-x: auto !important;
    }
}

/* Assurer que les tableaux dans les modals respectent aussi les limites */
.modal-body .data-grid-container,
.modal-body .table-container {
    max-width: 100% !important;
    overflow-x: auto !important;
}

/* Fix pour les tableaux de gestion */
.management-table-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
}

/* Fix pour les tableaux dans les sections spécifiques */
.history-tables-section .table-container,
.history-tables-section .data-grid-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
}

/* Assurer que les cellules ne débordent pas */
.data-grid td,
.data-grid th,
#productionTable td,
#productionTable th,
#arretsTable td,
#arretsTable th,
#advancedTable td,
#advancedTable th,
.controle-grid td,
.controle-grid th {
    max-width: 300px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-wrap: break-word !important;
}

/* Exception pour les colonnes qui peuvent être plus larges si nécessaire */
.data-grid td:first-child,
.data-grid th:first-child,
#productionTable td:first-child,
#productionTable th:first-child {
    max-width: 400px !important;
}