/* Pannello di manutenzione — SOLO per la demo, non fa parte del tool. */

:root {
  --mnt-bg: #1f2933;
  --mnt-accent: #f5a524;
  --mnt-ok: #2fa76a;
  --mnt-ko: #e5534b;
}

/* ---- Linguetta di apertura ---- */
.mnt-toggle {
  position: fixed; left: 16px; bottom: 16px; z-index: 2147482000;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--mnt-bg); color: #fff;
  border: none; border-radius: 999px;
  font: inherit; font-size: 13px; font-weight: 600;
  padding: 10px 16px; cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .28);
}
.mnt-toggle:hover { background: #2c3946; }
.mnt-toggle:focus-visible { outline: 3px solid var(--mnt-accent); outline-offset: 2px; }

/* ---- Barra ---- */
.mnt-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147482001;
  background: var(--mnt-bg); color: #fff;
  padding: 12px 18px 14px;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, .25);
  display: none;
  font-size: 13px;
}
.mnt-bar.open { display: block; }
body.mnt-attiva { padding-bottom: 132px; }   /* la barra non copre l'ultimo artefatto */

.mnt-bar .riga { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mnt-bar .riga + .riga { margin-top: 10px; }

.mnt-titolo { font-weight: 700; letter-spacing: .02em; }
.mnt-conteggio { color: #b9c4d0; }
.mnt-chiudi {
  margin-left: auto; background: none; border: none; color: #b9c4d0;
  font: inherit; font-size: 18px; line-height: 1; cursor: pointer; padding: 4px 6px;
}
.mnt-chiudi:hover { color: #fff; }

.mnt-bar button.azione {
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  background: #33414f; color: #fff;
  border: 1px solid #47586a; border-radius: 8px; padding: 7px 13px;
}
.mnt-bar button.azione:hover:not(:disabled) { background: #43535f; }
.mnt-bar button.azione:disabled { opacity: .45; cursor: progress; }
.mnt-bar button.azione.pericolo { border-color: #7a3b38; background: #58302e; }
.mnt-bar button.azione.pericolo:hover:not(:disabled) { background: #6d3936; }
.mnt-bar button:focus-visible { outline: 3px solid var(--mnt-accent); outline-offset: 2px; }

.mnt-bar .secondario {
  background: none; border: none; color: #9fb0c0; text-decoration: underline;
  font: inherit; font-size: 12.5px; cursor: pointer; padding: 4px 2px;
}
.mnt-bar .secondario:hover { color: #fff; }

.mnt-esito {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px; color: #cfd8e3;
  background: #16202a; border-radius: 8px; padding: 8px 10px;
  max-height: 84px; overflow: auto; white-space: pre-wrap; width: 100%;
}
.mnt-esito .ok { color: var(--mnt-ok); }
.mnt-esito .ko { color: var(--mnt-ko); }

/* ---- Caselle sugli artefatti ---- */
.mnt-scelta {
  display: none; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 600; color: var(--mnt-bg);
  background: #fff8e8; border: 1px solid #f0dcb4; border-radius: 8px;
  padding: 5px 10px; margin-bottom: 8px; width: fit-content; cursor: pointer;
}
body.mnt-attiva .mnt-scelta { display: inline-flex; }
.mnt-scelta input { width: 16px; height: 16px; margin: 0; cursor: pointer; accent-color: #b8860b; }
.mnt-scelta .id { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

@media (prefers-reduced-motion: reduce) {
  .mnt-toggle, .mnt-bar button { transition: none; }
}
