/* Gère les variables */

.table {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #fff;
    --bs-table-border-color: #dee2e6;
    --bs-table-striped-color: #000;
    --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
    --bs-table-active-color: #000;
    --bs-table-active-bg: rgba(0, 0, 0, 0.1);
    --bs-table-hover-color: #000;
    --bs-table-hover-bg: rgba(0, 0, 0, 0.075);
}

.dark-mode .table {
    /* Corrige le thème */
    --bs-table-color: #fff;
    --bs-table-bg: #212529;
    --bs-table-border-color: #4d5154;
    --bs-table-striped-bg: #2c3034;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #373b3e;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #323539;
    --bs-table-hover-color: #fff;
}

.table-primary {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #cfe2ff;
    --bs-table-border-color: #a6b5cc;
    --bs-table-striped-bg: #c5d7f2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #bacbe6;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #bfd1ec;
    --bs-table-hover-color: #000;
}

.table-secondary {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #e2e3e5;
    --bs-table-border-color: #b5b6b7;
    --bs-table-striped-bg: #d7d8da;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #cbccce;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #d1d2d4;
    --bs-table-hover-color: #000;
}

.table-success {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #d1e7dd;
    --bs-table-border-color: #a7b9b1;
    --bs-table-striped-bg: #c7dbd2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #bcd0c7;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #c1d6cc;
    --bs-table-hover-color: #000;
}

.table-danger {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #f8d7da;
    --bs-table-border-color: #c6acae;
    --bs-table-striped-bg: #eccccf;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #dfc2c4;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #e5c7ca;
    --bs-table-hover-color: #000;
}

.table-warning {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #fff3cd;
    --bs-table-border-color: #ccc2a4;
    --bs-table-striped-bg: #f2e7c3;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #e6dbb9;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #ece1be;
    --bs-table-hover-color: #000;
}

.table-info {
    /* Corrige le thème */
    --bs-table-color: #000;
    --bs-table-bg: #cff4fc;
    --bs-table-border-color: #a6c3ca;
    --bs-table-striped-bg: #c5e8ef;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #badce3;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #bfe2e9;
    --bs-table-hover-color: #000;
}

/* Corrige le thème */

.table > :not(:first-child) {
    border-top: initial;
}

/* Gère les colonnes qui contiennent les boutons */

.col-1-btn {
    width: 40px;
    min-width: 40px;
}

.col-2-btn {
    width: 70px;
    min-width: 70px;
}

.col-3-btn {
    width: 100px;
    min-width: 100px;
}

.col-4-btn {
    width: 130px;
    min-width: 130px;
}

.col-5-btn {
    width: 160px;
    min-width: 160px;
}

.col-6-btn {
    width: 190px;
    min-width: 190px;
}

.col-btn {
    text-align: center;
}

    .col-btn > :not(:first-child) {
        margin-left: 2px;
    }

/* Gère le sticky table header */

.table > thead {
    position: sticky;
    top: var(--app-top-offset);
    background-clip: padding-box;
    z-index: 2; /* Pour passer devant les positions relative. */
}

@media (max-width: 767.98px) {
    .table {
        --app-top-offset: 0; /* Le fait d'avoir un conteneur avec un scroll rend inopérationnel le sticky header.  */
    }
}

/* Gère les tableaux responsive. */

.table-container {
    width: 100% !important;
    overflow-x: scroll;
}

    .table-container .table {
        --app-top-offset: 0; /* Le fait d'avoir un conteneur avec un scroll rend inopérationnel le sticky header.  */
    }

        .table-container .table th {
            overflow-x: hidden; /* Le texte des header doit être caché s'il dépasse. */
            text-overflow: ellipsis;
            white-space: nowrap;
        }

            .table-container .table th.w-10px {
                width: 10px !important;
                min-width: 10px !important; /* Permet d'éviter que la colonne rétrécisse par rapport aux autres colonnes avec une taille minimum. */
                max-width: 10px !important;
            }

            .table-container .table th.w-20px {
                width: 20px !important;
                min-width: 20px !important;
                max-width: 20px !important;
            }

            .table-container .table th.w-30px {
                width: 30px !important;
                min-width: 30px !important;
                max-width: 30px !important;
            }

            .table-container .table th.w-40px {
                width: 40px !important;
                min-width: 40px !important;
                max-width: 40px !important;
            }

            .table-container .table th.w-50px {
                width: 50px !important;
                min-width: 50px !important;
                max-width: 50px !important;
            }

            .table-container .table th.w-60px {
                width: 60px !important;
                min-width: 60px !important;
                max-width: 60px !important;
            }

            .table-container .table th.w-70px {
                width: 70px !important;
                min-width: 70px !important;
                max-width: 70px !important;
            }

            .table-container .table th.w-80px {
                width: 80px !important;
                min-width: 80px !important;
                max-width: 80px !important;
            }

            .table-container .table th.w-90px {
                width: 90px !important;
                min-width: 90px !important;
                max-width: 90px !important;
            }

            .table-container .table th.w-100px {
                width: 100px !important;
                min-width: 100px !important;
                max-width: 100px !important;
            }

            .table-container .table th.w-110px {
                width: 110px !important;
                min-width: 110px !important;
                max-width: 110px !important;
            }

            .table-container .table th.w-120px {
                width: 120px !important;
                min-width: 120px !important;
                max-width: 120px !important;
            }

            .table-container .table th.w-130px {
                width: 130px !important;
                min-width: 130px !important;
                max-width: 130px !important;
            }

            .table-container .table th.w-140px {
                width: 140px !important;
                min-width: 140px !important;
                max-width: 140px !important;
            }

            .table-container .table th.w-150px {
                width: 150px !important;
                min-width: 150px !important;
                max-width: 150px !important;
            }

            .table-container .table th.w-160px {
                width: 160px !important;
                min-width: 160px !important;
                max-width: 160px !important;
            }

            .table-container .table th.w-170px {
                width: 170px !important;
                min-width: 170px !important;
                max-width: 170px !important;
            }

            .table-container .table th.w-180px {
                width: 180px !important;
                min-width: 180px !important;
                max-width: 180px !important;
            }

            .table-container .table th.w-190px {
                width: 190px !important;
                min-width: 190px !important;
                max-width: 190px !important;
            }

            .table-container .table th.w-200px {
                width: 200px !important;
                min-width: 200px !important;
                max-width: 200px !important;
            }

            .table-container .table th.min-w-10px {
                min-width: 10px !important;
                max-width: 10px !important; /* Bizarrement, permet aux colonnes qui changent de taille de cacher leur contenu qui dépasse en DESSOUS de cette taille. */
            }

            .table-container .table th.min-w-20px {
                min-width: 20px !important;
                max-width: 20px !important;
            }

            .table-container .table th.min-w-30px {
                min-width: 30px !important;
                max-width: 30px !important;
            }

            .table-container .table th.min-w-40px {
                min-width: 40px !important;
                max-width: 40px !important;
            }

            .table-container .table th.min-w-50px {
                min-width: 50px !important;
                max-width: 50px !important;
            }

            .table-container .table th.min-w-60px {
                min-width: 60px !important;
                max-width: 60px !important;
            }

            .table-container .table th.min-w-70px {
                min-width: 70px !important;
                max-width: 70px !important;
            }

            .table-container .table th.min-w-80px {
                min-width: 80px !important;
                max-width: 80px !important;
            }

            .table-container .table th.min-w-90px {
                min-width: 90px !important;
                max-width: 90px !important;
            }

            .table-container .table th.min-w-100px {
                min-width: 100px !important;
                max-width: 100px !important;
            }

            .table-container .table th.min-w-110px {
                min-width: 110px !important;
                max-width: 110px !important;
            }

            .table-container .table th.min-w-120px {
                min-width: 120px !important;
                max-width: 120px !important;
            }

            .table-container .table th.min-w-130px {
                min-width: 130px !important;
                max-width: 130px !important;
            }

            .table-container .table th.min-w-140px {
                min-width: 140px !important;
                max-width: 140px !important;
            }

            .table-container .table th.min-w-150px {
                min-width: 150px !important;
                max-width: 150px !important;
            }

            .table-container .table th.min-w-160px {
                min-width: 160px !important;
                max-width: 160px !important;
            }

            .table-container .table th.min-w-170px {
                min-width: 170px !important;
                max-width: 170px !important;
            }

            .table-container .table th.min-w-180px {
                min-width: 180px !important;
                max-width: 180px !important;
            }

            .table-container .table th.min-w-190px {
                min-width: 190px !important;
                max-width: 190px !important;
            }

            .table-container .table th.min-w-200px {
                min-width: 200px !important;
                max-width: 200px !important;
            }