/* Gestione tecnica (pacchetto C): istanze dei clienti, PC locali e cloud. Solo token della piattaforma: chiaro e scuro. */
.gt-head { align-items: flex-end; }
.gt-head-r { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.gt-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.gt-seg button { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.gt-seg svg { width: var(--ic-sm); height: var(--ic-sm); }
.gt-seg .gt-n { font-size: var(--fs-2xs); min-width: 1.3rem; padding: 0 .35rem; border-radius: var(--radius); background: var(--surface-3); color: var(--ink-2); }
.gt-seg button.on .gt-n { background: var(--accent); color: var(--accent-ink); }

/* numeri in alto */
.gt-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.gt-kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .85rem 1rem; min-width: 0; box-shadow: var(--shadow); }
.gt-kpi b { display: block; font-family: var(--font-display); font-weight: 500; font-size: var(--fs-3xl); letter-spacing: -.02em; line-height: 1.15; color: var(--ink); }
.gt-kpi span { font-size: var(--fs-sm); color: var(--muted); }
.gt-kpi.warn b { color: var(--warn); }

.gt-sec { display: flex; flex-direction: column; gap: .7rem; }
.gt-sec > header { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; flex-wrap: wrap; }
.gt-sec > header h3 { font-size: var(--fs-lg); }
.gt-sec > header .meta { margin: 0; }
.gt-empty { padding: 1.1rem 1.2rem; border: 1px dashed var(--line-strong); border-radius: var(--radius-sm); color: var(--muted); background: var(--surface-2); }
.gt-empty strong { color: var(--ink); display: block; margin-bottom: .15rem; }

/* schede delle istanze */
.gt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr)); gap: .85rem; }
.gt-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1rem 1.05rem .9rem; display: flex; flex-direction: column; gap: .7rem; min-width: 0; }
.gt-card-top { display: flex; align-items: flex-start; gap: .7rem; min-width: 0; }
.gt-avatar { flex: none; width: 2.4rem; height: 2.4rem; border-radius: var(--radius); display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); }
.gt-card-t { min-width: 0; flex: 1; }
.gt-card-t h4 { margin: 0; font-size: var(--fs-md); font-weight: 600; overflow-wrap: anywhere; }
.gt-card-t a, .gt-card-t .meta { display: block; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.gt-chip { flex: none; display: inline-flex; align-items: center; gap: .35rem; font-size: var(--fs-xs); font-weight: 600; padding: .2rem .55rem; border-radius: var(--radius); white-space: nowrap; background: var(--surface-3); color: var(--ink-2); }
.gt-chip::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; opacity: .85; }
.gt-chip.ok { background: var(--t-green); color: var(--t-green-ink); }
.gt-chip.warn { background: var(--t-amber); color: var(--t-amber-ink); }
.gt-chip.ko { background: var(--t-red); color: var(--t-red-ink); }
.gt-chip.info { background: var(--t-blue); color: var(--t-blue-ink); }
.gt-chip.plain::before { display: none; }

.gt-meters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.gt-meter span { display: flex; justify-content: space-between; font-size: var(--fs-xs); color: var(--muted); gap: .3rem; }
.gt-meter span b { color: var(--ink-2); font-weight: 600; }
.gt-bar { height: .38rem; border-radius: var(--radius); background: var(--surface-3); overflow: hidden; margin-top: .25rem; }
.gt-bar i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.gt-bar i.warn { background: var(--amber); }
.gt-bar i.ko { background: var(--danger); }
.gt-svc { display: flex; flex-wrap: wrap; gap: .35rem .9rem; font-size: var(--fs-sm); color: var(--ink-2); }
.gt-svc span { display: inline-flex; align-items: center; gap: .35rem; }
.gt-dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--line-strong); flex: none; }
.gt-dot.ok { background: var(--ok); }
.gt-dot.ko { background: var(--danger); }
.gt-facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .25rem .8rem; font-size: var(--fs-sm); margin: 0; }
.gt-facts dt { color: var(--muted); }
.gt-facts dd { margin: 0; color: var(--ink-2); overflow-wrap: anywhere; }
.gt-acts { display: flex; gap: .4rem; flex-wrap: wrap; padding-top: .7rem; margin-top: auto; border-top: 1px solid var(--line); }
.gt-acts button { min-height: 2.15rem; padding: .3rem .7rem; font-size: var(--fs-sm); display: inline-flex; align-items: center; gap: .35rem; }
.gt-acts button svg { width: var(--ic-xs); height: var(--ic-xs); }
.gt-acts .gt-more { margin-left: auto; }

/* ordini da installare in loco */
.gt-orders { display: grid; gap: .6rem; }
.gt-order { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: .6rem 1rem; align-items: center; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .8rem 1rem; }
.gt-order h4 { margin: 0 0 .15rem; font-size: var(--fs-md); }
.gt-order .meta { margin: 0; }
.gt-order label { display: grid; gap: .2rem; font-size: var(--fs-xs); color: var(--muted); }
.gt-order input { min-height: 2.2rem; }
.gt-order-acts { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
.gt-order-acts button { min-height: 2.2rem; font-size: var(--fs-sm); }

/* comando pronto da copiare */
.gt-cmd { position: relative; margin: 0; padding: .75rem 3rem .75rem .85rem; border-radius: var(--radius-sm); background: var(--navy); color: #e8ecf6; font-family: var(--mono); font-size: var(--fs-sm); line-height: 1.5; white-space: pre-wrap; word-break: break-all; }
.gt-cmd button { position: absolute; top: .45rem; right: .45rem; min-height: 0; width: 2.1rem; height: 2.1rem; padding: 0; display: grid; place-items: center; border-radius: var(--radius); background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.gt-cmd button svg { width: var(--ic-sm); height: var(--ic-sm); }

/* provisioning cloud: i passi */
.gt-steps { display: flex; gap: .25rem; margin: .1rem 0 0; padding: 0; list-style: none; counter-reset: s; overflow-x: auto; scrollbar-width: none; }
.gt-steps li { flex: 1 1 0; min-width: 4.4rem; display: grid; gap: .3rem; font-size: var(--fs-2xs); color: var(--muted); text-align: center; }
.gt-steps li::before { content: ""; height: .3rem; border-radius: var(--radius); background: var(--surface-3); }
.gt-steps li.done::before { background: var(--ok); }
.gt-steps li.now::before { background: var(--accent); }
.gt-steps li.err::before { background: var(--danger); }
.gt-steps li.now, .gt-steps li.err { color: var(--ink); font-weight: 600; }
.gt-err { display: flex; gap: .5rem; align-items: flex-start; padding: .55rem .7rem; border-radius: var(--radius-sm); background: var(--t-red); color: var(--t-red-ink); font-size: var(--fs-sm); }
.gt-err svg { width: var(--ic-sm); height: var(--ic-sm); flex: none; margin-top: .1rem; }

/* impostazioni del cloud e della console */
.gt-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1rem; }
.gt-form label { display: grid; gap: .25rem; font-size: var(--fs-sm); color: var(--ink-2); min-width: 0; }
.gt-form label small { color: var(--muted); font-size: var(--fs-xs); }
.gt-form .wide { grid-column: 1 / -1; }
.gt-form-foot { display: flex; gap: .5rem; justify-content: flex-end; flex-wrap: wrap; grid-column: 1 / -1; }
.gt-ready { display: flex; gap: .5rem; flex-wrap: wrap; }

/* scheda di dettaglio (finestra) */
.gt-sheet .sheet-card { width: min(44rem, 100%); }
.gt-sheet .sheet-body { display: grid; gap: 1rem; align-content: start; }
.gt-tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--line); padding: 0 1.25rem; overflow-x: auto; scrollbar-width: none; flex: none; }
.gt-tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; min-height: 2.6rem; padding: .3rem .7rem; color: var(--muted); font-size: var(--fs-base); white-space: nowrap; }
.gt-tabs button.on { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.gt-log { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.gt-log li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: .2rem .8rem; padding: .55rem 0; border-bottom: 1px solid var(--line); font-size: var(--fs-sm); }
.gt-log li:last-child { border-bottom: 0; }
.gt-log time { color: var(--muted); font-size: var(--fs-xs); }
.gt-log b { font-weight: 600; }
.gt-log small { display: block; color: var(--muted); overflow-wrap: anywhere; }
.gt-days { display: grid; margin: .4rem 0 0; padding: 0; list-style: none; }
.gt-days li { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.gt-days li:last-child { border-bottom: 0; }
.gt-days span { display: grid; min-width: 0; font-size: var(--fs-base); font-weight: 500; }
.gt-days small { color: var(--muted); font-size: var(--fs-xs); font-weight: 400; }
.gt-days button { flex: none; }
@media (max-width: 560px) { .gt-days li { flex-wrap: wrap; } .gt-days button { width: 100%; justify-content: center; } }
.gt-ai { display: grid; gap: .7rem; }
.gt-ai-row { display: grid; grid-template-columns: 9rem minmax(0, 1fr) minmax(0, 1fr); gap: .5rem; align-items: center; }
.gt-ai-row > span { font-size: var(--fs-sm); font-weight: 600; }
.gt-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.gt-table th { text-align: left; color: var(--muted); font-weight: 500; font-size: var(--fs-xs); padding: .35rem .5rem .35rem 0; border-bottom: 1px solid var(--line); }
.gt-table td { padding: .45rem .5rem .45rem 0; border-bottom: 1px solid var(--line); }
.gt-table td.n { text-align: right; font-variant-numeric: tabular-nums; }
.gt-wrap { overflow-x: auto; }
.gt-logs td { vertical-align: top; overflow-wrap: anywhere; font-size: var(--fs-sm); }
.gt-logs td.nowrap { white-space: nowrap; color: var(--muted); }
.gt-logs-f .gt-form-foot button svg { width: var(--ic-xs); height: var(--ic-xs); }

/* ---------------------------------------------------------------- chi è, a che punto è, manutenzione SSH */
.gt-head-r [data-gt-update-all] { display: inline-flex; align-items: center; gap: .4rem; }
.gt-head-r [data-gt-update-all] .gt-n { font-size: var(--fs-2xs); min-width: 1.3rem; padding: 0 .35rem; border-radius: var(--radius);
  background: var(--t-amber); color: var(--t-amber-ink); text-align: center; }
.gt-who { display: block; font-size: var(--fs-sm); color: var(--ink-2); overflow-wrap: anywhere; }
.gt-tags { display: flex; flex-wrap: wrap; gap: .3rem; }
.gt-path { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: .5rem; margin: 0; padding: .8rem 0 0; list-style: none; border-top: 1px solid var(--line); }
.gt-path li { display: grid; gap: .15rem; font-size: var(--fs-sm); color: var(--muted); }
.gt-path li::before { content: ""; height: .3rem; border-radius: var(--radius); background: var(--surface-3); margin-bottom: .2rem; }
.gt-path li.done::before { background: var(--ok); }
.gt-path li.done b { color: var(--ink); }
.gt-path b { font-weight: 600; }
.gt-ssh-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; flex-wrap: wrap; }
.gt-ssh-head > div { display: grid; gap: .1rem; min-width: 0; }
.gt-ssh-head .meta { margin: 0; overflow-wrap: anywhere; }
.gt-need { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.gt-need li { display: flex; gap: .5rem; align-items: flex-start; font-size: var(--fs-sm); color: var(--t-amber-ink); }
.gt-need svg { width: var(--ic-sm); height: var(--ic-sm); flex: none; margin-top: .1rem; }
.gt-ssh-acts { justify-content: flex-start; padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.gt-ssh-acts button { display: inline-flex; align-items: center; gap: .4rem; }
.gt-ssh-acts button svg { width: var(--ic-sm); height: var(--ic-sm); }
.gt-ssh-steps { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; counter-reset: ssh; }
.gt-ssh-steps li { counter-increment: ssh; display: grid; gap: .3rem; min-width: 0; }
.gt-ssh-steps li > b::before { content: counter(ssh) ". "; color: var(--accent); }
.gt-ssh-steps .meta { margin: 0; font-size: var(--fs-sm); }

@media (max-width: 900px) {
  .gt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gt-order { grid-template-columns: minmax(0, 1fr); }
  .gt-order-acts { justify-content: flex-start; }
}
@media (max-width: 600px) {
  .gt-head-r { width: 100%; }
  .gt-head-r .gt-seg { flex: 1 1 100%; }
  .gt-head-r .gt-seg button { flex: 1 1 0; justify-content: center; }
  .gt-grid { grid-template-columns: minmax(0, 1fr); }
  .gt-form { grid-template-columns: minmax(0, 1fr); }
  .gt-form.gt-logs-f { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gt-ai-row { grid-template-columns: minmax(0, 1fr); }
  .gt-kpi b { font-size: var(--fs-xl); }
  .gt-log li { grid-template-columns: minmax(0, 1fr); }
  .gt-acts .gt-more { margin-left: 0; }
  .gt-tabs { padding: 0 .75rem; }
}

/* ---------------------------------------------------------------- in diretta: il semaforo di ogni cliente */
.mon-dot { --lv: #94a3b8; display: inline-block; flex: none; width: .7rem; height: .7rem; border-radius: 50%; background: var(--lv);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lv) 20%, transparent); }
.mon-dot.lv-ok { --lv: #12A56A; } .mon-dot.lv-warn { --lv: #F5B941; } .mon-dot.lv-ko { --lv: #EF4444; }
.mon-row .mon-dot.lv-ko, .mon-kpi.lv-ko .mon-dot { animation: mon-pulse 1.6s ease-out infinite; }
@keyframes mon-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, #EF4444 55%, transparent); } 100% { box-shadow: 0 0 0 9px transparent; } }
.mon-kpi span { display: inline-flex; align-items: center; gap: .4rem; }
.mon-kpi.lv-ko b { color: #EF4444; } .mon-kpi.lv-warn b { color: color-mix(in srgb, #F5B941 80%, var(--ink)); } .mon-kpi.lv-ok b { color: #12A56A; }
.gt-n.mon-n-ko { background: #EF4444; color: #fff; } .gt-n.mon-n-warn { background: #F5B941; color: #0B1220; }
.mon-sec header .meta { display: flex; align-items: center; gap: .45rem; }
.mon-live { width: .5rem; height: .5rem; border-radius: 50%; background: #12A56A; animation: mon-blink 2s ease-in-out infinite; }
@keyframes mon-blink { 50% { opacity: .25; } }
.mon-filter { margin: .2rem 0 .8rem; flex-wrap: wrap; }
.mon-list { display: grid; gap: .5rem; }
.mon-row { display: grid; grid-template-columns: auto minmax(10rem, 1.1fr) minmax(0, 2fr) auto auto; align-items: center; gap: .9rem;
  padding: .75rem 1rem; border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--line);
  box-shadow: var(--shadow); border-left: 3px solid var(--line); }
.mon-row.lv-ko { border-left-color: #EF4444; background: color-mix(in srgb, #EF4444 5%, var(--surface)); }
.mon-row.lv-warn { border-left-color: #F5B941; }
.mon-row.lv-ok { border-left-color: #12A56A; }
.mon-row.lv-idle { opacity: .75; }
.mon-who { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.mon-who strong { overflow-wrap: anywhere; }
.mon-why { display: flex; flex-wrap: wrap; gap: .25rem .7rem; min-width: 0; font-size: var(--fs-base); color: var(--ink-2); }
.mon-why b { font-weight: 600; color: var(--ink); }
.mon-row.lv-ko .mon-why b { color: #DC2626; }
:root[data-theme="dark"] .mon-row.lv-ko .mon-why b { color: #F87171; }
.mon-meta { display: flex; flex-wrap: wrap; gap: .2rem .6rem; font-size: var(--fs-xs); color: var(--muted); justify-content: flex-end; }
.gt-card.gt-flash { box-shadow: 0 0 0 3px color-mix(in srgb, #2F6BFF 40%, transparent), var(--shadow); transition: box-shadow .3s; }
@media (max-width: 860px) {
  .mon-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: .4rem .7rem; }
  .mon-why, .mon-meta { grid-column: 2 / -1; justify-content: flex-start; }
  .mon-row > button { grid-row: 1; grid-column: 3; }
}
@media (prefers-reduced-motion: reduce) { .mon-row .mon-dot.lv-ko, .mon-kpi.lv-ko .mon-dot, .mon-live { animation: none; } }