/* -------------------------------------------------------------------------
 * gantt.css — editor di diagrammi di Gantt (gest/grafici/gantt.php).
 *
 * Stessa impaginazione degli altri due editor SVG: a sinistra le attività e
 * le proprietà, a destra il disegno, sotto la tabella delle dipendenze.
 * Altezza e carattere dei campi stanno in css/common/editor_svg.css
 * (.eds-campi), come la barra di ripescaggio e la tavolozza.
 * ------------------------------------------------------------------------- */

.gt-barra {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  padding: .5rem .6rem;
  margin-bottom: .6rem;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  background: #f8f9fa;
}
.gt-barra .gt-sep { width: 1px; height: 1.6rem; background: #dee2e6; margin: 0 .3rem; }
/* i comandi che vanno insieme vanno a capo insieme */
.gt-barra .gt-gr { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: .4rem; }
.gt-barra label { font-size: .82rem; margin: 0 .2rem 0 0; }
.gt-barra input[type=text] { width: 10rem; }
.gt-barra input[type=number] { width: 5rem; }
.gt-barra .gt-dim { font-size: .78rem; color: #6c757d; margin-left: auto; white-space: nowrap; cursor: help; }
.gt-barra .gt-zoom-val { min-width: 4.2rem; font-variant-numeric: tabular-nums; }

.gt-griglia { display: grid; grid-template-columns: minmax(0, 23rem) minmax(0, 1fr); gap: .8rem; align-items: start; }
@media (max-width: 991.98px) { .gt-griglia { grid-template-columns: minmax(0, 1fr); } }

.gt-pannello { border: 1px solid #dee2e6; border-radius: 6px; background: #fff; }
.gt-pannello > h4 {
  font-size: .85rem; font-weight: bold; margin: 0;
  padding: .35rem .6rem; background: #eef1f4; border-bottom: 1px solid #dee2e6;
  border-radius: 6px 6px 0 0;
}
.gt-corpo { padding: .5rem .6rem; max-height: 26rem; overflow: auto; }

/* --- elenco delle attività: l'albero, con l'inizio calcolato a destra --- */
.gt-elenco { list-style: none; margin: 0; padding: 0; font-size: .84rem; }
.gt-elenco li { display: flex; align-items: center; gap: .4rem; padding: .05rem 0; }
.gt-nodo {
  cursor: pointer; display: inline-block; padding: .05rem .35rem; border-radius: 4px;
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;
}
.gt-nodo:hover { background: #eef1f4; }
.gt-nodo.gt-attivo { background: #0d6efd; color: #fff; }
.gt-nodo.gt-scelto { background: #cfe2ff; color: #084298; }
.gt-nodo .bi { opacity: .7; }
.gt-auto { color: #5b3fa8; opacity: 1 !important; }
.gt-crit { color: #c0392b; opacity: 1 !important; }
.gt-nodo.gt-attivo .gt-auto, .gt-nodo.gt-attivo .gt-crit { color: #fff; }
.gt-quando { margin-left: auto; font-size: .72rem; color: #6c757d; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* --- proprietà --- */
.gt-tit-sel { font-weight: bold; font-size: .86rem; margin: 0 0 .4rem; color: #0a58ca; }
.gt-gruppo { border: 1px solid #dee2e6; border-radius: 5px; margin: 0 0 .45rem; padding: .3rem .5rem .4rem; }
.gt-gruppo legend { width: auto; float: none; font-size: .78rem; font-weight: bold; padding: 0 .3rem; margin: 0; color: #495057; }
.gt-riga { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: .18rem 0; font-size: .8rem; }
.gt-et { min-width: 9rem; flex: 0 0 9rem; margin: 0; color: #495057; }
.gt-riga input[type=number] { width: 5rem; }
.gt-riga input.gt-data { width: 11.5rem; }
.gt-riga .gt-largo { flex: 1 1 9rem; min-width: 0; }
.gt-riga textarea { font-family: inherit; resize: vertical; }
.gt-col { width: 2.2rem; height: 1.6rem; padding: 0; cursor: pointer; }
.gt-inline { display: inline-flex; align-items: center; gap: .25rem; margin: 0; font-size: .8rem; }
.gt-giorni { display: inline-flex; flex-wrap: wrap; gap: .1rem .55rem; flex: 1 1 9rem; }
.gt-nota { font-size: .76rem; color: #6c757d; margin: .2rem 0 .4rem; }
.gt-azioni { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .5rem; }
.gt-azioni .btn { font-size: .76rem; padding: .1rem .4rem; }

/* --- il disegno --- */
.gt-tela {
  border: 1px solid #dee2e6; border-radius: 6px; background: #fff;
  padding: .6rem; overflow: auto; min-height: 18rem;
}
/* la scacchiera sta SOTTO il disegno: si vede solo dove è davvero trasparente */
.gt-tela svg {
  max-width: 100%; height: auto; display: block; margin: 0 auto;
  background-image:
    linear-gradient(45deg, #eceff1 25%, transparent 25%, transparent 75%, #eceff1 75%),
    linear-gradient(45deg, #eceff1 25%, transparent 25%, transparent 75%, #eceff1 75%);
  background-size: 16px 16px;
  background-position: 0 0, 8px 8px;
}
.gt-tela [data-id] { cursor: pointer; }
.gt-tela [data-id]:hover { filter: brightness(0.97); }

/* la comparsa la governa .eds-avviso (editor_svg.css): niente display */
.gt-avvisi {
  margin-top: .5rem; padding: .4rem .6rem; font-size: .82rem;
  border: 1px solid #f5c2c7; border-radius: 5px; background: #f8d7da; color: #842029;
}

/* --- dipendenze --- */
.gt-tab-dip { font-size: .78rem; margin: 0; }
.gt-tab-dip th { font-weight: bold; white-space: nowrap; background: #eef1f4; }
.gt-tab-dip td, .gt-tab-dip th { padding: .15rem .3rem; vertical-align: middle; }
.gt-tab-dip select, .gt-tab-dip input { max-width: 100%; width: 100%; }
/* Colonne: Da, A, Vincolo, Ritardo, Tratto, Colore, Spessore, elimina. */
.gt-tab-dip td:nth-child(1), .gt-tab-dip td:nth-child(2) { width: 22%; }
.gt-tab-dip td:nth-child(3) { width: 16%; }
.gt-tab-dip td:nth-child(4) { width: 5.5rem; }
.gt-tab-dip td:nth-child(5) { width: 12%; }
.gt-tab-dip td:nth-child(6) { width: 3rem; }
.gt-tab-dip td:nth-child(7) { width: 4.4rem; }
.gt-tab-dip td:last-child { width: 2.4rem; }
.gt-vuoto { color: #6c757d; font-style: italic; text-align: center; }

/* --- editor JSON e filtro --- */
.gt-json { margin-top: .8rem; }
.gt-json > summary { cursor: pointer; font-weight: bold; font-size: .86rem; padding: .2rem 0; }
#gt_ace { width: 100%; height: 20rem; border: 1px solid #dee2e6; border-radius: 5px; }
.gt-filtro { display: block; width: calc(100% - 1.2rem); margin: .4rem .6rem 0; }

/* --- festività: l'elenco del periodo, con le spunte e le crocette --- */
.gt-fest { font-size: .78rem; margin: 0 0 .3rem; }
.gt-fest-r { display: flex; align-items: center; gap: .3rem; padding: .05rem 0; border-bottom: 1px dotted #eceff1; }
.gt-fest-r .gt-inline { font-size: .78rem; }
.gt-fest-d { font-variant-numeric: tabular-nums; color: #343a40; white-space: nowrap; }
.gt-fest-t { color: #6c757d; font-style: italic; }
/* una festività nazionale tolta: si vede ancora, barrata, per poterla rimettere */
.gt-fest-tolta .gt-inline { color: #868e96; text-decoration: line-through; }
.gt-fest-del { padding: 0 .25rem; line-height: 1; color: #c0392b; margin-left: auto; }
.gt-fest-agg { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin-top: .4rem; }
.gt-fest-agg input.gt-data { width: 10.5rem; }
.gt-fest-agg .btn { font-size: .76rem; padding: .1rem .4rem; }

/* --- categorie (v1.3): nome, riempimento, contorno, quante la usano --- */
.gt-cat { display: flex; align-items: center; gap: .3rem; padding: .12rem 0; border-bottom: 1px dotted #eceff1; font-size: .78rem; }
.gt-cat-nome { flex: 1 1 7rem; min-width: 0; }
.gt-cat-n { color: #6c757d; font-style: italic; white-space: nowrap; }
.gt-cat-del { padding: 0 .25rem; line-height: 1; color: #c0392b; }
/* il nome di una festività aggiunta, che il disegno mostra sulla sua colonna */
.gt-fest-nome { flex: 1 1 6rem; min-width: 0; font-size: .76rem; padding: 0 .25rem; }

/* --- la legenda si trascina; il suggerimento col nome della festività --- */
.gt-tela [data-legenda] { cursor: move; touch-action: none; }
.gt-sugg {
  position: fixed; z-index: 1080; pointer-events: none;
  padding: .15rem .45rem; border-radius: 4px; font-size: .78rem;
  background: #343a40; color: #fff; opacity: 0; transition: opacity .12s;
}
.gt-sugg.gt-sugg-su { opacity: .95; }
@media (prefers-reduced-motion: reduce) { .gt-sugg { transition: none; } }

/* --- fasi richiuse (v1.4): il triangolo nell'elenco e nel disegno --- */
.gt-apri {
  flex: 0 0 1rem; width: 1rem; padding: 0; margin: 0; border: 0; background: none;
  color: #6c757d; line-height: 1; font-size: .7rem; cursor: pointer;
}
.gt-apri:hover { color: #0d6efd; }
.gt-apri:focus-visible { outline: 2px solid #0d6efd; outline-offset: 1px; border-radius: 2px; }
.gt-apri-vuoto { display: inline-block; cursor: default; }
.gt-apri-tutte { display: flex; flex-wrap: wrap; gap: .1rem .6rem; margin: 0 0 .2rem; }
.gt-apri-tutte .btn { font-size: .74rem; padding: 0; text-decoration: none; }
.gt-tela .gt-apri-svg { cursor: pointer; }
.gt-tela .gt-apri-svg:hover path { fill: #0d6efd; }
