/* AIDEV-NOTE: pagina Scaletta (change pianificazione-scaletta, design D4). Tabella unica stile foglio Excel:
   intestazione fissa, fascia di linea fissa sotto l'intestazione, righe compatte. Tutto sotto .scaletta. */

.scaletta {
    --scaletta-thead: 30px;
    --linea-01: #1565c0;
    --linea-02: #616161;
    --linea-03: #2e7d32;
    --linea-04: #00838f;
    --linea-06: #ef6c00;
    --linea-07: #6d4c41;
    --linea-08: #6a1b9a;
    --linea-09: #ad1457;
    font-size: 12px;
}

.scaletta .barra {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 6px 4px 8px 4px;
}

.scaletta .filtro-linee { display: flex; gap: 2px; }
.scaletta .ricerca { max-width: 240px; }
.scaletta .fonti { display: flex; gap: 12px; color: #555; margin-left: auto; }
.scaletta .fonti .avviso { color: #c62828; font-weight: 600; }

.scaletta .tabella-contenitore {
    height: calc(100vh - 150px);
    overflow: auto;
    border: 1px solid #ccc;
    background: #fff;
}

.scaletta .tabella {
    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    min-width: 100%;
}

.scaletta .tabella th {
    position: sticky;
    top: 0;
    z-index: 3;
    height: var(--scaletta-thead);
    background: #eceff1;
    border-bottom: 1px solid #b0bec5;
    padding: 2px 6px;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
}

.scaletta .tabella td {
    padding: 1px 6px;
    border-bottom: 1px solid #eee;
    white-space: nowrap;
    height: 24px;
    vertical-align: middle;
}

.scaletta .tabella .num { text-align: right; font-variant-numeric: tabular-nums; }
.scaletta .tabella .testo { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.scaletta .tabella .note { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.scaletta .tabella .op { font-weight: 600; }
.scaletta .tabella .stato { color: #607d8b; }

/* Fascia di linea: resta sotto l'intestazione mentre si scorre la sua parte */
.scaletta .tabella tr.fascia td {
    position: sticky;
    top: var(--scaletta-thead);
    z-index: 2;
    padding: 0 4px;
    color: #fff;
    background: var(--colore-linea, #455a64);
    border-bottom: none;
}

/* il contenuto della fascia resta a sinistra anche scorrendo la tabella in orizzontale */
.scaletta .fascia-contenuto { display: flex; align-items: center; gap: 16px; position: sticky; left: 4px; width: max-content; }
.scaletta .fascia-contenuto .mud-icon-button { color: #fff; }
.scaletta .fascia-contenuto .in-corso { background: rgba(255,255,255,.2); padding: 0 6px; border-radius: 3px; }
.scaletta .fascia-contenuto .ferma { background: #c62828; padding: 0 6px; border-radius: 3px; font-weight: 600; }
.scaletta .fascia-contenuto .avviso { background: #f9a825; color: #000; padding: 0 6px; border-radius: 3px; }

.scaletta tbody.l01 { --colore-linea: var(--linea-01); }
.scaletta tbody.l02 { --colore-linea: var(--linea-02); }
.scaletta tbody.l03 { --colore-linea: var(--linea-03); }
.scaletta tbody.l04 { --colore-linea: var(--linea-04); }
.scaletta tbody.l06 { --colore-linea: var(--linea-06); }
.scaletta tbody.l07 { --colore-linea: var(--linea-07); }
.scaletta tbody.l08 { --colore-linea: var(--linea-08); }
.scaletta tbody.l09 { --colore-linea: var(--linea-09); }
.scaletta .chip-linea.l01 { --colore-linea: var(--linea-01); }
.scaletta .chip-linea.l03 { --colore-linea: var(--linea-03); }
.scaletta .chip-linea.l08 { --colore-linea: var(--linea-08); }
.scaletta .chip-linea.mud-chip-filled { background: var(--colore-linea, #455a64); color: #fff; }

/* Righe */
.scaletta tr.riga td:first-child { border-left: 4px solid var(--colore-linea, #455a64); }
.scaletta tr.riga:hover td { background: #f5f9ff; }
/* Fermi programmati (change pianificazione-fermi-programmati): in sequenza grigi, a calendario grigio più scuro a righe */
.scaletta tr.riga.fermo td { background: #eceff1; color: #37474f; }
.scaletta tr.riga.fermo td.op a { font-weight: 600; letter-spacing: .5px; }
.scaletta tr.riga.fermo-calendario td { background: repeating-linear-gradient(135deg, #e0e0e0 0 6px, #eeeeee 6px 12px); }
/* Righe schedulate (change pianificazione-consegna-schedulato): sfondo e segno a sinistra; gli altri stati colorati restano sopra */
.scaletta tr.riga.schedulata td { background: #e0f2f1; }
.scaletta tr.riga.schedulata td:first-child { box-shadow: inset 4px 0 0 #00897b; }
.scaletta .c-sched { width: 30px; padding: 0 2px !important; text-align: center; }
.scaletta tr.riga.in-corso td { background: #e8f5e9; }
.scaletta tr.riga.prova td { background: #e3f2fd; }
.scaletta tr.riga.membro td { background: #fafafa; color: #555; }
.scaletta tr.riga.trovata td { background: #fff9c4 !important; }
.scaletta tr.riga-fantasma td { background: #bbdefb !important; opacity: .7; }
/* riga che segue il mouse durante il trascinamento (fallback di SortableJS, appesa al body) */
tr.sortable-fallback { display: table; background: #e3f2fd; box-shadow: 0 2px 8px rgba(0,0,0,.25); font-size: 12px; opacity: .9 !important; }
tr.sortable-fallback td { padding: 1px 6px; white-space: nowrap; }

.scaletta .c-maniglia { width: 34px; padding: 0 2px !important; text-align: center; white-space: nowrap; }
/* OPV di simulazione (change pianificazione-opv): casella di selezione, riga spuntata, azioni Separa / Togli */
.scaletta input.seleziona { width: 12px; height: 12px; margin: 0 2px 0 0; vertical-align: middle; cursor: pointer; }
.scaletta tr.riga.selezionata td { background: #e8eaf6 !important; }
.scaletta .selezione { display: flex; align-items: center; gap: 8px; padding: 2px 8px; background: #e8eaf6; border-radius: 4px; font-size: 13px; }
.scaletta .azione { cursor: pointer; color: #546e7a; }
.scaletta .azione:hover { color: #1565c0; }
.scaletta .maniglia { cursor: grab; color: #90a4ae; font-size: 14px; user-select: none; }
.scaletta .maniglia:active { cursor: grabbing; }

/* Fine rispetto alla consegna, come la formattazione condizionale dell'Excel */
.scaletta td.fine.oltre { background: #ffcdd2 !important; color: #b71c1c; font-weight: 600; }
.scaletta td.fine.vicino { background: #ffe0b2 !important; color: #e65100; }

/* Celle modificabili */
/* tutta la cella è cliccabile, anche quando è vuota */
.scaletta .modificabile { display: block; min-width: 40px; min-height: 18px; cursor: text; border-bottom: 1px dashed transparent; }
.scaletta .modificabile:hover { border-bottom-color: #90a4ae; }
.scaletta .modificabile.imposto { color: #1565c0; font-weight: 600; }
.scaletta .cella-input { width: 100%; min-width: 60px; font-size: 12px; padding: 0 2px; border: 1px solid #1565c0; }
/* Consegna: indicatore delle settimane e data sulla stessa riga, anche quando la data è modificabile (JWJ-W78) */
.scaletta td.consegna { white-space: nowrap; }
.scaletta td.consegna .modificabile { display: inline-block; vertical-align: middle; }
.scaletta td.consegna .cella-input { width: 72px; min-width: 0; vertical-align: middle; }

.scaletta .evidenze { display: flex; gap: 2px; align-items: center; }
.scaletta .evidenza-prova { background: #1565c0; color: #fff; padding: 0 4px; border-radius: 3px; cursor: pointer; font-size: 11px; }
.scaletta .evidenza-nc { background: #ef6c00; color: #fff; padding: 0 4px; border-radius: 3px; font-size: 11px; }
.scaletta .da-interpretare { background: #fff3e0; color: #e65100; padding: 0 4px; border-radius: 3px; cursor: help; }
.scaletta .espandi { cursor: pointer; color: #1565c0; }
/* NxP da interpretare (change pianificazione-pedane): cella evidenziata, cliccabile per imporre il valore */
.scaletta td.nxp-da-interpretare { background: #fff3e0; color: #e65100; font-weight: 600; }

/* Colonne nascoste (change pianificazione-viste, JWJ-W30, D7): per posizione, come ColonneScaletta in VisteSalvate.cs.
   La fascia di linea ha una sola cella e non viene toccata. */
.scaletta .tabella.nascondi-schedulato tr > :nth-child(2) { display: none; }
.scaletta .tabella.nascondi-stato tr > :nth-child(5) { display: none; }
.scaletta .tabella.nascondi-cliente tr > :nth-child(6) { display: none; }
.scaletta .tabella.nascondi-mescola tr > :nth-child(7) { display: none; }
.scaletta .tabella.nascondi-variante tr > :nth-child(8) { display: none; }
.scaletta .tabella.nascondi-fascia tr > :nth-child(9) { display: none; }
.scaletta .tabella.nascondi-spessore tr > :nth-child(10) { display: none; }
.scaletta .tabella.nascondi-consegna tr > :nth-child(12) { display: none; }
.scaletta .tabella.nascondi-bobine tr > :nth-child(13) { display: none; }
.scaletta .tabella.nascondi-bxl tr > :nth-child(14) { display: none; }
.scaletta .tabella.nascondi-ftot tr > :nth-child(15) { display: none; }
.scaletta .tabella.nascondi-kgh tr > :nth-child(16) { display: none; }
.scaletta .tabella.nascondi-cambio tr > :nth-child(17) { display: none; }
.scaletta .tabella.nascondi-pedana tr > :nth-child(20) { display: none; }
.scaletta .tabella.nascondi-nxp tr > :nth-child(21) { display: none; }
.scaletta .tabella.nascondi-pedane tr > :nth-child(22) { display: none; }
.scaletta .tabella.nascondi-note tr > :nth-child(23) { display: none; }

/* Selezione per le somme (change pianificazione-selezione-somme, JWJ-W69): distinta dalla casella per l'OPV */
.scaletta tr.riga.sel-somme td { background: #bbdefb !important; }
.scaletta .selezione.somme { background: #e3f2fd; }
.pannello-selezione-sfondo { position: fixed; inset: 0; z-index: 1400; }
.pannello-selezione { position: fixed; z-index: 1401; width: 440px; max-height: calc(100vh - 16px); overflow: auto; background: #fff;
    border-radius: 6px; box-shadow: 0 6px 24px rgba(0,0,0,.25); padding: 6px 10px 8px; font-size: 13px; }
.pannello-selezione .titolo { display: flex; align-items: center; gap: 8px; }
.pannello-selezione .titolo span { flex: 1; color: #546e7a; }
.pannello-selezione table.somme { width: 100%; border-collapse: collapse; margin: 4px 0; }
.pannello-selezione table.somme th, .pannello-selezione table.somme td { padding: 2px 6px; border-bottom: 1px solid #eceff1; text-align: left; }
.pannello-selezione table.somme th { color: #546e7a; font-weight: 500; }
.pannello-selezione .num { text-align: right !important; white-space: nowrap; }
.pannello-selezione td.valore { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pannello-selezione tr.totale td { font-weight: 600; }
.pannello-selezione .voci { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin: 6px 0; }
.pannello-selezione .voci > span { color: #546e7a; margin-right: 4px; }
.pannello-selezione button.voce { border: 1px solid #90caf9; background: #fff; color: #1565c0; border-radius: 12px; padding: 1px 10px; cursor: pointer; font-size: 12px; }
.pannello-selezione button.voce.attiva { background: #1565c0; color: #fff; }
.pannello-selezione .gruppi { max-height: 240px; overflow: auto; }
.pannello-selezione .azioni { display: flex; justify-content: flex-end; margin-top: 4px; }

/* Caso migliore e peggiore sotto inizio e fine (change pianificazione-previsione-forbice, JWJ-W71) */
.scaletta .tabella .forbice { font-size: 11px; color: #607d8b; white-space: nowrap; line-height: 1.2; }
.scaletta .tabella .forbice .fuori { color: #e65100; font-weight: 600; }