/* ==========================================================
   ORDERFLOW - CSS PER LISTE
   ========================================================== */

.table-container{
    flex:1;
    overflow:auto;
    min-height:0;
    padding: 0;  /* Rimuovo il padding per evitare problemi di allineamento */
    position:relative;
}

table{
    width:100%;
    border-collapse:separate;  /* Cambiato da collapse a separate */
    border-spacing:0;          /* Per evitare spazi tra celle */
    table-layout:fixed;
    min-width:900px;
}

thead th{
    position:sticky;
    top:0;
    background:var(--header);
    border-bottom:2px solid #bbb;  /* Bordo inferiore più evidente */
    border-right:1px solid #ddd;
    border-left:1px solid #ddd;
    border-top:1px solid #ddd;
    padding:6px 5px;
    text-align:left;
    font-weight:600;
    color:#444;
    z-index:10;
    white-space:nowrap;
}

thead th:last-child {
    border-right:1px solid #ddd;
}

thead th:first-child {
    border-left:1px solid #ddd;
}

tbody td{
    border-bottom:1px solid #ececec;
    border-right:1px solid #ececec;
    border-left:1px solid #ececec;
    padding:5px 6px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color:var(--text);
    background:#fff;
    vertical-align:middle;
}

/* Rimuovo il bordo sinistro della prima colonna per evitare doppioni */
tbody td:first-child {
    border-left:1px solid #ececec;
}

/* Ultima colonna */
tbody td:last-child {
    border-right:1px solid #ececec;
}

/* Righe alternate - applicato ai td per lo scroll */
tbody tr:nth-child(even) td{
    background:#fcfcfc;
}

tbody tr:hover td{
    background:#f3f7fb;
}

tbody tr.selected td{
    background:var(--selected);
    color:#fff;
}

/* Per colonna codice fissa a sinistra (se necessario) */
/*
tbody td:first-child,
thead th:first-child {
    position:sticky;
    left:0;
    z-index:11;
    background:inherit;
}

tbody td:first-child {
    z-index:5;
    border-right:2px solid var(--border);
}

tbody tr.selected td:first-child {
    background:var(--selected);
}
*/

/* Larghezze colonne personalizzabili in pagina */
/* 
    Esempio di utilizzo nel file HTML:
    <style>
        #tabella-articoli th.cod { width: 10%; }
        #tabella-articoli th.desc { width: 40%; }
        #tabella-articoli th.sm { width: 6%; }
        #tabella-articoli th.num { width: 7%; }
        #tabella-articoli th.xs { width: 3%; }
    </style>
*/

@media screen and (max-width: 1200px) {
    table {
        min-width: 700px;
    }

    thead th,
    tbody td {
        padding: 4px 4px;
        font-size: 11px;
    }
}

@media screen and (max-width: 768px) {
    table {
        min-width: 600px;
    }

    thead th,
    tbody td {
        padding: 3px 3px;
        font-size: 10px;
    }
}

@media screen and (max-width: 480px) {
    table {
        min-width: 500px;
    }

    thead th,
    tbody td {
        padding: 2px 2px;
        font-size: 9px;
    }
}