/* Le etichette degli elementi sui nodi e la scheda dell'elemento come pannello della board (passo 8,
   lotto 5; D27). Solo gettoni: i --bs-* della board e i ruoli di app.css. Monocromo: il colore non dice
   lo stato, il fucsia non c'e' (non e' un'allerta). Un elemento tagliato resta, barrato. */

/* I gettoni sul nodo: in fondo, sopra il bordo; il piede e le azioni della task salgono. */
#board-studio .bs-labels {position:absolute;left:12px;right:12px;bottom:10px;height:24px;display:flex;align-items:center;gap:4px;overflow:hidden;z-index:1}
#board-studio .bs-label {display:block;flex:none;min-width:0;max-width:150px;height:22px;padding:0 7px;border:1px solid var(--bs-line);border-radius:5px;background:var(--bs-panel);color:var(--bs-ink);font:600 11px/20px var(--cifre,ui-monospace,monospace);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
#board-studio .bs-label:hover {border-color:var(--bs-ink);background:var(--bs-soft)}
#board-studio .bs-label.is-tagliato {color:var(--bs-muted);text-decoration:line-through}
#board-studio .bs-label-altri {font-family:inherit;color:var(--bs-muted)}
#board-studio .bs-card.bs-with-labels .bs-card-foot {bottom:42px}
#board-studio .bs-card.bs-with-labels .bs-work-actions {bottom:42px}
#board-studio .bs-card.bs-with-labels.bs-with-work .bs-card-foot {bottom:84px}
/* Il difetto vecchio (trovato nei controlli di SB2): le regole del nodo di prima di SB1, coi comandi in fondo al nodo,
   alzavano di 44 px (86 con la task) i comandi del generatore grande, che stanno nel flusso: sopra il prompt e le
   reference. Il generatore ha gia' il posto per la task e per le etichette in fondo (GRANDE, board_studio.js): niente sale. */

/* La scelta dell'elemento da etichettare: una riga per elemento, il codice prima del nome. */
#board-studio .bs-dialog .bs-label-stato {margin:8px 0 4px}
#board-studio .bs-label-scelta {display:flex;flex-direction:column;max-height:min(46vh,360px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--bs-line);border-radius:8px}
#board-studio .bs-dialog .bs-label-riga {display:flex;align-items:flex-start;gap:10px;margin:0;padding:8px 10px;border-top:1px solid var(--bs-line);font-size:12px;color:var(--bs-ink);cursor:pointer}
#board-studio .bs-dialog .bs-label-riga:first-child {border-top:0}
#board-studio .bs-dialog .bs-label-riga:hover {background:var(--bs-soft)}
#board-studio .bs-dialog .bs-label-riga input {display:inline-block;flex:none;width:auto;margin:2px 0 0;padding:0;border:0;accent-color:var(--bs-accent)}
#board-studio .bs-dialog .bs-label-riga input:disabled + .bs-label-testo {color:var(--bs-muted)}
#board-studio .bs-label-testo {display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0}
#board-studio .bs-label-testo b {font:600 12px var(--cifre,ui-monospace,monospace)}
#board-studio .bs-label-testo span {min-width:0;overflow-wrap:anywhere}
#board-studio .bs-label-testo small {flex-basis:100%;color:var(--bs-muted);font-size:11px}
#board-studio .bs-label-lista {display:flex;flex-direction:column;gap:4px}
#board-studio .bs-label-voce {display:flex;justify-content:flex-start;gap:10px;width:100%;border:1px solid var(--bs-line);text-align:left;white-space:normal}
#board-studio .bs-label-voce b {font:600 12px var(--cifre,ui-monospace,monospace)}
#board-studio .bs-label-voce.is-tagliato b {text-decoration:line-through;color:var(--bs-muted)}

/* La scheda dell'elemento dentro la board: al posto dell'editor dei nodi, sullo stesso piano e nel tema. */
#board-studio .el-scheda {position:absolute;top:calc(112px + var(--bs-regia,0px));right:16px;bottom:76px;left:auto;
  width:min(420px,calc(100vw - 96px));z-index:9;padding:16px 18px;overflow:auto;overscroll-behavior:contain;
  background:var(--bs-panel);color:var(--bs-ink);border:1px solid var(--bs-line);border-radius:12px;box-shadow:0 10px 40px #0002}
#board-studio .el-scheda .btn {display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid var(--bs-line);border-radius:6px;background:var(--bs-panel);font-size:12px}
#board-studio .el-scheda .btn:hover {background:var(--bs-soft)}
#board-studio .el-scheda .el-chip-apri {padding:0;border:0;border-radius:0;background:none}
#board-studio .el-scheda .el-mini {padding:0 4px;border:0;border-radius:0;background:none}
#board-studio .el-scheda .el-s-nuova .input {border:1px solid var(--bs-line);background:var(--bs-bg);border-radius:6px}
/* Sul telefono la barra della selezione scende sotto la testata: la scheda parte sotto di lei. */
@media (max-width:760px) {#board-studio .el-scheda {top:calc(152px + var(--bs-regia,0px))}}
@media (max-width:600px) {#board-studio .el-scheda {right:8px;width:calc(100vw - 86px);padding:13px}}