/* ================================================
   CORRECTION TABLEAU - VERSION SAFE (ne casse rien)
   ================================================ */

@media (max-width: 768px) {
    /* SECTION TABLEAU - Correction de l'espacement */
    #tableau {
        padding-top: 80px;
    }

    #tableau .section-title {
        margin-bottom: 2rem;
    }

    /* Container du tableau */
    .tableau-container {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 1rem 0;
    }

    /* Table responsive */
    table {
        min-width: 700px;
        font-size: 0.85rem;
        border-collapse: collapse;
    }

    /* En-tête sticky */
    table thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background: linear-gradient(135deg, rgba(0, 210, 255, 0.3), rgba(0, 255, 234, 0.3));
    }

    table th {
        padding: 1rem 0.8rem;
        font-size: 0.85rem;
        white-space: nowrap;
        border-bottom: 2px solid var(--primary);
    }

    /* Première colonne sticky */
    table th:first-child,
    table td:first-child {
        position: sticky;
        left: 0;
        z-index: 5;
        background: var(--darker);
        min-width: 180px;
        box-shadow: 3px 0 8px rgba(0, 0, 0, 0.3);
    }

    table th:first-child {
        z-index: 15;
        background: linear-gradient(135deg, rgba(0, 210, 255, 0.4), rgba(0, 255, 234, 0.4));
    }

    /* Cellules */
    table td {
        padding: 1rem 0.8rem;
        font-size: 0.85rem;
        border-bottom: 1px solid rgba(0, 210, 255, 0.2);
    }

    /* Texte de la première colonne */
    table td:first-child {
        font-weight: 600;
        color: var(--white);
        font-size: 0.9rem;
    }

    /* Colonne validation (centrée) */
    table td:last-child {
        text-align: center;
        font-size: 1.2rem;
    }

    /* Barre de scroll visible */
    .tableau-container::-webkit-scrollbar {
        height: 10px;
    }

    .tableau-container::-webkit-scrollbar-track {
        background: rgba(0, 210, 255, 0.1);
        border-radius: 10px;
    }

    .tableau-container::-webkit-scrollbar-thumb {
        background: var(--primary);
        border-radius: 10px;
    }

    /* Hover sur les lignes */
    table tbody tr:hover {
        background: rgba(0, 210, 255, 0.1);
    }
}