/* Console di amministrazione: stessi colori del tema scuro della suite. */
:root {
  --bg: #0f1115;
  --bg-elevated: #181b22;
  --bordo: #2a2f3a;
  --testo: #e6e8ee;
  --tenue: #9aa3b2;
  --accento: #8b7cf6;
  --ok: #3fbf7f;
  --attenzione: #f0a43a;
  --errore: #f0566b;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--testo); font-size: 14px; }
.testata { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; border-bottom: 1px solid var(--bordo); background: var(--bg-elevated); }
.marchio { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .05em; color: var(--tenue); }
h1 { margin: 0; font-size: 17px; }
h2 { margin: 0 0 8px; font-size: 16px; }
main { padding: 20px; max-width: 1300px; margin: 0 auto; }
button { background: transparent; color: var(--testo); border: 1px solid var(--bordo); border-radius: 8px; padding: 6px 12px; font: inherit; cursor: pointer; }
button:hover { background: rgba(255, 255, 255, .05); }
button[type="submit"] { background: var(--accento); border-color: var(--accento); color: #fff; }
.collegamento { border: 0; padding: 0; color: var(--accento); }
input, select { background: transparent; color: var(--testo); border: 1px solid var(--bordo); border-radius: 8px; padding: 7px 10px; font: inherit; }
.riquadro { background: var(--bg-elevated); border: 1px solid var(--bordo); border-radius: 12px; padding: 16px; }
.accesso { max-width: 360px; margin: 60px auto; display: flex; flex-direction: column; gap: 10px; }
.nota { color: var(--tenue); font-size: 12px; margin: 0; }
.errore { color: var(--errore); min-height: 1em; margin: 0; font-size: 13px; }
.intestazione-sezione { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 12px; gap: 12px; }
.griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.cliente { cursor: pointer; text-align: left; display: flex; flex-direction: column; gap: 6px; padding: 14px; }
.cliente .nome { font-size: 15px; font-weight: 600; }
.cliente .righe { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; font-size: 12px; }
.cliente .righe dt { color: var(--tenue); }
.cliente .righe dd { margin: 0; }
.stato { font-size: 12px; font-weight: 600; }
.stato.ok { color: var(--ok); }
.stato.ko { color: var(--errore); }
.schede { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.schede button[aria-current="page"] { border-color: var(--accento); color: var(--accento); }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th { text-align: left; color: var(--tenue); font-weight: 500; padding: 4px 6px; }
td { border-top: 1px solid var(--bordo); padding: 4px 6px; vertical-align: top; }
tr.cliccabile { cursor: pointer; }
tr.cliccabile:hover td { background: rgba(255, 255, 255, .03); }
pre { white-space: pre-wrap; word-break: break-word; font-size: 12px; line-height: 1.45; margin: 0; }
.filtri { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; align-items: center; }
.tenue { color: var(--tenue); }
.badge { display: inline-block; border-radius: 999px; padding: 1px 8px; font-size: 11px; border: 1px solid var(--bordo); }
.badge.nuovo { color: var(--errore); border-color: var(--errore); }
.badge.visto { color: var(--attenzione); border-color: var(--attenzione); }
.badge.risolto { color: var(--ok); border-color: var(--ok); }
mark { background: var(--attenzione); color: #000; }
