/* GR Connect — foglio di stile admin
   Palette GR Digital: #0b3d5c (blu petrolio), #127e78 (verde acqua).
   Impianto: sidebar fissa a sinistra + area contenuto. Rifatto 2026-09-02. */

:root {
  --blu: #0b3d5c;
  --blu-scuro: #072c43;
  --verde: #127e78;
  --verde-scuro: #0d5c56;
  --fondo: #f2f6f8;
  --bianco: #fff;
  --testo: #1c2a32;
  --tenue: #6d8792;
  --bordo: #e2eaee;
  --bordo-forte: #cfdce2;
  --ombra: 0 1px 2px rgba(11,61,92,.06), 0 4px 12px rgba(11,61,92,.05);
  --raggio: 12px;
  --raggio-s: 8px;
  --sidebar: 232px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--fondo);
  color: var(--testo);
  line-height: 1.5;
  font-size: 15px;
}

a { color: var(--verde); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Impianto: sidebar + contenuto ---------- */

.layout { display: flex; min-height: 100vh; }

.sidebar {
  width: var(--sidebar);
  flex: 0 0 var(--sidebar);
  background: var(--blu);
  color: #cfe0e9;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
}

.sidebar .brand {
  padding: 1.4rem 1.3rem 1.1rem;
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.sidebar .brand a {
  color: #fff; font-weight: 700; font-size: 1.08rem;
  display: flex; align-items: center; gap: .5rem; text-decoration: none;
}
.sidebar .brand .ver {
  display: block; color: #7ea6bc; font-size: .72rem;
  margin-top: .25rem; font-weight: 400;
}

.sidebar nav { padding: .8rem .7rem; flex: 1; overflow-y: auto; }
.sidebar nav .gruppo {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .09em;
  color: #6f97ad; padding: 1rem .6rem .35rem; font-weight: 600;
}
.sidebar nav a {
  display: flex; align-items: center; gap: .6rem;
  padding: .5rem .6rem; margin-bottom: .12rem;
  border-radius: var(--raggio-s);
  color: #cfe0e9; font-size: .9rem; text-decoration: none;
  transition: background .12s, color .12s;
}
.sidebar nav a:hover { background: rgba(255,255,255,.07); color: #fff; text-decoration: none; }
.sidebar nav a.attivo { background: var(--verde); color: #fff; font-weight: 600; }
.sidebar nav a .ico { width: 1.1rem; text-align: center; opacity: .9; font-size: .95rem; }

.sidebar .utente {
  padding: .9rem 1.2rem; border-top: 1px solid rgba(255,255,255,.09);
  font-size: .82rem; color: #9dbecd;
}
.sidebar .utente strong { display: block; color: #fff; font-weight: 600; }
.sidebar .utente a { color: #9dbecd; font-size: .78rem; }

.contenuto { flex: 1; min-width: 0; }
.container { max-width: 1240px; margin: 0 auto; padding: 2rem 2.2rem 4rem; }

/* ---------- Testata di pagina ---------- */

.intestazione {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 1.5rem; margin-bottom: 1.8rem; flex-wrap: wrap;
}
h1 { margin: 0; font-size: 1.55rem; letter-spacing: -.02em; color: var(--blu); }
.sottotitolo { margin: .35rem 0 0; color: var(--tenue); font-size: .92rem; max-width: 62ch; }

h2 { margin: 2.6rem 0 1rem; font-size: 1.05rem; color: var(--blu); letter-spacing: -.01em; }
h2:first-of-type { margin-top: 0; }

/* ---------- Riquadri metrica ---------- */

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 1rem; margin-bottom: 2rem;
}
.card {
  background: var(--bianco); border: 1px solid var(--bordo);
  border-radius: var(--raggio); padding: 1.1rem 1.2rem;
  box-shadow: var(--ombra);
}
.card h3 {
  margin: 0 0 .5rem; font-size: .74rem; color: var(--tenue);
  text-transform: uppercase; letter-spacing: .07em; font-weight: 600;
}
.big { font-size: 2rem; font-weight: 700; color: var(--blu); line-height: 1.1; margin: 0; }
.card .nota { font-size: .78rem; color: var(--tenue); margin-top: .3rem; }
.card.accento-ok .big { color: var(--verde); }
.card.accento-allarme .big { color: #b3261e; }

/* ---------- Pannelli ---------- */

.pannello {
  background: var(--bianco); border: 1px solid var(--bordo);
  border-radius: var(--raggio); box-shadow: var(--ombra);
  overflow: hidden; margin-bottom: 1.6rem;
}
.pannello > .testa {
  padding: .9rem 1.2rem; border-bottom: 1px solid var(--bordo);
  background: #fafcfd; display: flex; align-items: center;
  justify-content: space-between; gap: 1rem; flex-wrap: wrap;
}
.pannello > .testa h2 { margin: 0; font-size: .98rem; }
.pannello > .corpo { padding: 1.2rem; }
.pannello > .corpo.stretto { padding: 0; }

/* ---------- Tabelle ---------- */

.tabella-wrap { overflow-x: auto; }
.grid { width: 100%; border-collapse: collapse; background: var(--bianco); }
.grid th, .grid td {
  padding: .72rem .9rem; text-align: left;
  border-bottom: 1px solid var(--bordo); font-size: .88rem; vertical-align: top;
}
.grid th {
  background: #f7fafb; font-weight: 600; color: #52707e;
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  white-space: nowrap;
}
.grid tbody tr:hover { background: #fafcfd; }
.grid tr:last-child td { border-bottom: 0; }
.grid td.azioni { white-space: nowrap; }
.grid .principale { font-weight: 600; color: var(--testo); }

.vuoto { padding: 2.5rem 1.2rem; text-align: center; color: var(--tenue); }
.vuoto .ico { font-size: 1.8rem; display: block; margin-bottom: .5rem; opacity: .5; }

code {
  background: #eef4f6; padding: .1em .4em; border-radius: 4px;
  font-size: .85em; font-family: ui-monospace, Menlo, Consolas, monospace;
}
pre.json {
  background: #0d3247; color: #cfe3ec; padding: .8rem; border-radius: var(--raggio-s);
  font-size: .78rem; overflow-x: auto; max-height: 210px; margin: 0;
}

/* ---------- Etichette di stato ---------- */

.status {
  display: inline-block; padding: .2em .6em; border-radius: 20px;
  font-size: .72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em; white-space: nowrap;
}
.status-delivered, .status-ok { background: #d7f2ec; color: #0b5a52; }
.status-dead, .status-failed, .status-error { background: #fde5e3; color: #8e2018; }
.status-queued, .status-unverified { background: #fdf0cf; color: #86620d; }
.status-delivering { background: #dbeafe; color: #1e40af; }
.status-neutro { background: #eaf0f3; color: #5b7482; }

.pallino { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; margin-right: .4rem; }
.pallino-ok { background: #16a34a; }
.pallino-ko { background: #cbd5dc; }

/* ---------- Avvisi ---------- */

.alert {
  padding: .85rem 1.1rem; border-radius: var(--raggio-s);
  margin-bottom: 1.4rem; font-size: .9rem; border: 1px solid transparent;
}
.alert.ok { background: #d7f2ec; color: #0b5a52; border-color: #9ad9cd; }
.alert.err { background: #fde5e3; color: #8e2018; border-color: #f5b3ad; }
.alert.info { background: #e8f1f6; color: #1d4e63; border-color: #b9d5e2; }

/* ---------- Form ---------- */

.form { display: flex; flex-direction: column; gap: 1rem; max-width: 680px; }
.form.inline {
  flex-direction: row; flex-wrap: wrap; align-items: flex-end;
  max-width: none; gap: .8rem;
}
.form label {
  display: flex; flex-direction: column; gap: .3rem;
  font-size: .82rem; color: #3f5b68; font-weight: 600;
}
.form label .aiuto { font-weight: 400; color: var(--tenue); font-size: .78rem; }
.form input, .form select, .form textarea {
  padding: .58rem .7rem; border: 1px solid var(--bordo-forte);
  border-radius: var(--raggio-s); font-size: .92rem; font-family: inherit;
  background: #fff; color: var(--testo); transition: border-color .12s, box-shadow .12s;
}
.form input:focus, .form select:focus, .form textarea:focus {
  outline: 0; border-color: var(--verde);
  box-shadow: 0 0 0 3px rgba(18,126,120,.13);
}
.form textarea {
  resize: vertical; font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: .84rem; min-height: 5rem;
}
.form .riga { display: flex; gap: .8rem; flex-wrap: wrap; }
.form .riga > label { flex: 1; min-width: 190px; }

.btn {
  background: var(--verde); color: #fff; border: 0;
  padding: .58rem 1.15rem; border-radius: var(--raggio-s);
  font-weight: 600; cursor: pointer; font-size: .89rem;
  font-family: inherit; display: inline-flex; align-items: center;
  gap: .4rem; text-decoration: none; transition: background .12s;
  white-space: nowrap;
}
.btn:hover { background: var(--verde-scuro); text-decoration: none; color: #fff; }
.btn-secondary { background: var(--blu); }
.btn-secondary:hover { background: var(--blu-scuro); }
.btn-tenue { background: #fff; color: #3f5b68; border: 1px solid var(--bordo-forte); }
.btn-tenue:hover { background: #f2f7f9; color: var(--blu); }
.btn-small { padding: .32rem .7rem; font-size: .79rem; }
.azioni form { display: inline-block; margin-right: .3rem; }
.azioni .btn { margin-bottom: .25rem; }

details { margin-top: .5rem; }
details summary {
  cursor: pointer; font-size: .8rem; color: var(--verde);
  list-style: none; user-select: none;
}
details summary::-webkit-details-marker { display: none; }
details summary::before { content: "\25B8  "; }
details[open] summary::before { content: "\25BE  "; }
details > .form {
  margin-top: .6rem; padding: .9rem; background: #f7fafb;
  border: 1px solid var(--bordo); border-radius: var(--raggio-s);
}

.muted { color: var(--tenue); font-size: .84rem; }

/* ---------- Login ---------- */

.login-body {
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; margin: 0;
  background: linear-gradient(150deg, #0b3d5c 0%, #10556f 55%, #127e78 100%);
}
.login-card {
  width: 100%; max-width: 23rem; padding: 2.3rem 2.1rem;
  border-radius: 16px; background: #fff; box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.login-card h1 { font-size: 1.3rem; margin: 0 0 .15rem; }
.login-card .muted { margin: 0 0 1.6rem; }
.login-card .form { gap: 1.05rem; max-width: none; }
.login-card input { width: 100%; }
.login-card .btn { width: 100%; justify-content: center; padding: .68rem; font-size: .95rem; }
.login-pie { margin-top: 1.5rem; text-align: center; font-size: .76rem; color: var(--tenue); }

/* ---------- Responsive ---------- */

@media (max-width: 860px) {
  .layout { flex-direction: column; }
  .sidebar { width: 100%; flex: none; height: auto; position: static; }
  .sidebar nav { display: flex; flex-wrap: wrap; gap: .2rem; padding: .6rem; }
  .sidebar nav .gruppo { display: none; }
  .sidebar nav a { flex: 0 0 auto; }
  .container { padding: 1.3rem 1rem 3rem; }
}

/* ---------- Selettore con ricerca (picker.js) ----------
   Sostituisce i <select> lunghi: con ~20 account e decine di moduli una tendina
   nativa costringe a scorrere una lista di ID indistinguibili. */

.picker { position: relative; }
.pk-campo {
  display: flex; align-items: center; gap: .5rem; min-height: 2.5rem;
  padding: .4rem .6rem; border: 1px solid var(--bordo-forte);
  border-radius: var(--raggio-s); background: #fff; cursor: text;
  transition: border-color .12s, box-shadow .12s;
}
.pk-campo.pk-attivo, .pk-campo:focus-within {
  border-color: var(--verde); box-shadow: 0 0 0 3px rgba(18,126,120,.13);
}
.pk-etichetta { flex: 1; display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; min-width: 0; }
.pk-vuoto { color: #9bb0ba; font-size: .9rem; font-weight: 400; }
.pk-sel { font-weight: 600; font-size: .9rem; color: var(--testo); }
.pk-id-sel {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .76rem;
  color: var(--tenue); background: #eef4f6; padding: .1em .4em; border-radius: 4px;
}
.pk-chip {
  background: #e4f2ef; color: #0b5a52; padding: .18em .55em;
  border-radius: 20px; font-size: .78rem; font-weight: 600;
}
.pk-campo .pk-input {
  border: 0; outline: 0; padding: 0; font: inherit; font-size: .9rem;
  min-width: 5rem; flex: 1; background: transparent; font-weight: 400;
}
.pk-freccia { color: #9bb0ba; font-size: .8rem; }

.pk-lista {
  position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 4px);
  max-height: 17rem; overflow-y: auto; background: #fff;
  border: 1px solid var(--bordo-forte); border-radius: var(--raggio-s);
  box-shadow: 0 8px 28px rgba(11,61,92,.16);
}
.pk-voce {
  display: flex; align-items: baseline; gap: .6rem; padding: .5rem .7rem;
  cursor: pointer; border-bottom: 1px solid #f2f6f8;
}
.pk-voce:last-child { border-bottom: 0; }
.pk-voce:hover, .pk-voce.pk-evidenziata { background: #f2f9f8; }
.pk-voce.pk-scelto { background: #e4f2ef; }
.pk-voce.pk-scelto .pk-nome::after { content: " ¹3"; color: var(--verde); }
.pk-nome { font-size: .88rem; font-weight: 500; flex: 1; min-width: 0; }
.pk-id {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: .74rem; color: var(--tenue); white-space: nowrap;
}
.pk-nessuno, .pk-manuale { padding: .7rem; font-size: .85rem; color: var(--tenue); }
.pk-manuale { cursor: pointer; }
.pk-manuale:hover { background: #f2f9f8; }
.pk-avviso {
  margin-top: .35rem; font-size: .78rem; color: #86620d;
  background: #fdf7e6; border: 1px solid #f0e0b6;
  padding: .35rem .55rem; border-radius: 6px;
}

/* ---------- Card selezionabili (al posto delle tendine con 2-3 opzioni) ---------- */

.scelte { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .7rem; }
.scelta {
  position: relative; display: block; cursor: pointer;
  border: 1px solid var(--bordo-forte); border-radius: var(--raggio);
  padding: .9rem 1rem; background: #fff; transition: border-color .12s, box-shadow .12s;
}
.scelta:hover { border-color: var(--verde); }
.scelta input { position: absolute; opacity: 0; pointer-events: none; }
.scelta .titolo { font-weight: 600; font-size: .92rem; display: block; color: var(--testo); }
.scelta .desc { font-size: .78rem; color: var(--tenue); margin-top: .2rem; display: block; }
.scelta:has(input:checked) {
  border-color: var(--verde); background: #f4fbfa;
  box-shadow: 0 0 0 3px rgba(18,126,120,.13);
}

/* ---------- Passi del wizard ---------- */

.passi {
  display: flex; gap: .4rem; margin-bottom: 1.8rem; flex-wrap: wrap;
  list-style: none; padding: 0;
}
.passi li {
  display: flex; align-items: center; gap: .45rem;
  font-size: .82rem; color: var(--tenue);
  padding: .4rem .85rem; border-radius: 20px; background: #e9eff2;
}
.passi li .n {
  width: 1.35rem; height: 1.35rem; border-radius: 50%;
  background: #cbd8de; color: #fff; display: flex;
  align-items: center; justify-content: center; font-size: .74rem; font-weight: 700;
}
.passi li.corrente { background: var(--verde); color: #fff; font-weight: 600; }
.passi li.corrente .n { background: rgba(255,255,255,.28); color: #fff; }
.passi li.fatto { background: #e4f2ef; color: #0b5a52; }
.passi li.fatto .n { background: var(--verde); }

.passo-azioni {
  display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; margin-top: 1.8rem; padding-top: 1.3rem;
  border-top: 1px solid var(--bordo);
}

.riepilogo { list-style: none; padding: 0; margin: 0; }
.riepilogo li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: .55rem 0; border-bottom: 1px solid var(--bordo); font-size: .88rem;
}
.riepilogo li:last-child { border-bottom: 0; }
.riepilogo .voce { color: var(--tenue); }
.riepilogo .val { font-weight: 600; text-align: right; word-break: break-word; }

/* Selettore obbligatorio lasciato vuoto: il bordo rosso accompagna il messaggio
   nativo del browser, che da solo punterebbe a un campo invisibile. */
.pk-campo.pk-invalido { border-color: #d9534f; box-shadow: 0 0 0 3px rgba(217,83,79,.14); }

/* ---------- Barra filtri (Connessioni, Bridge) ---------- */

.filtri {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap; padding: .75rem 1.2rem; border-bottom: 1px solid var(--bordo);
  background: #fafcfd;
}
.filtri .chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .32rem .75rem; border-radius: 999px; font-size: .84rem; font-weight: 500;
  color: var(--blu); background: var(--bianco); border: 1px solid var(--bordo-forte);
  transition: background .12s, border-color .12s;
}
.chip:hover { border-color: var(--verde); background: #f3faf9; }
.chip b {
  font-size: .72rem; font-weight: 600; padding: .05rem .42rem; border-radius: 999px;
  background: #eaf0f3; color: var(--tenue);
}
.chip.chip-on { background: var(--verde); border-color: var(--verde); color: #fff; }
.chip.chip-on b { background: rgba(255,255,255,.22); color: #fff; }
.chip.chip-vuota { opacity: .55; }
.filtri .cerca { display: flex; align-items: center; gap: .6rem; margin: 0; }
.filtri .cerca input[type=search] {
  width: 17rem; max-width: 60vw; padding: .42rem .8rem; font-size: .88rem;
  border: 1px solid var(--bordo-forte); border-radius: 999px; background: var(--bianco);
  outline: none;
}
.filtri .cerca input[type=search]:focus { border-color: var(--verde); box-shadow: 0 0 0 3px rgba(18,126,120,.15); }
.filtri .cerca [data-cerca-esito] { font-size: .8rem; white-space: nowrap; }
tr[data-riga][hidden] { display: none; }

/* Filtro tenant a selettore (quando i tenant sono troppi per i chip) */
.filtro-tenant { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.filtro-eti {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  color: var(--tenue); font-weight: 600;
}
.picker-filtro { min-width: 15rem; }
.picker-filtro .pk-campo {
  border-radius: 999px; padding: .28rem .5rem .28rem .85rem; min-height: 2.1rem;
}
.picker-filtro .pk-sel { font-size: .86rem; }
.picker-filtro .pk-id-sel { display: none; }

/* ---------- Configurazione bridge: finestra larga (15/9/2026) ---------- */
details[open] > .form.config-bridge {
  position: fixed; top: 4vh; left: 50%; transform: translateX(-50%);
  width: min(64rem, 94vw); max-height: 92vh; overflow: auto; z-index: 100;
  margin: 0; padding: 1.3rem 1.5rem; background: #fff; white-space: normal;
  box-shadow: 0 0 0 100vmax rgba(15,35,45,.45), 0 12px 40px rgba(0,0,0,.25);
  gap: 1rem;
}
.config-bridge .config-testa { display: flex; justify-content: space-between; align-items: center; font-size: 1.05rem; }
.config-bridge label { font-size: .95rem; }
.config-bridge textarea { font-size: .95rem; line-height: 1.5; min-height: 7rem; white-space: pre; overflow-wrap: normal; overflow-x: auto; tab-size: 2; }
.config-bridge .config-piede { display: flex; gap: .6rem; }

/* ---------- Picker: il menu non viene tagliato dal pannello (15/9/2026) ---------- */
.pannello:has(.picker) { overflow: visible; }
.picker .pk-lista, .picker [class*="pk-lista"] { max-height: min(28rem, 60vh); }

/* ---------- Wizard: Indietro a sinistra di Avanti; Avanti resta primo nel DOM (Invio = Avanti) ---------- */
.azioni-passo { display: flex; flex-direction: row-reverse; gap: .6rem; align-items: center; }

/* ---------- Picker: apertura verso l'alto quando sotto manca spazio (15/9/2026) ---------- */
.pk-lista.pk-su { top: auto; bottom: calc(100% + 4px); }
.pannello:has(.picker), .pannello:has(.picker) > .corpo, .form:has(.picker) { overflow: visible; }
.picker { z-index: 30; }
.picker:has(.pk-lista:not([hidden])) { z-index: 60; }

/* ---------- Consegne: elenco e dettaglio (15/9/2026) ---------- */
.nowrap { white-space: nowrap; }
.grid td.azioni { white-space: nowrap; }
.grid td.azioni .btn, .grid td.azioni form { margin: 0 .25rem .25rem 0; }
.dettaglio { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1.2rem; margin: 0 0 1rem; }
.dettaglio dt { color: var(--tenue); font-size: .85rem; }
.dettaglio dd { margin: 0; }
.dettaglio dd.errore { color: #b3261e; }
h3.sotto { font-size: .85rem; color: #3f5b68; margin: 1.1rem 0 .4rem; }
pre.blocco { background: #f4f8fa; border: 1px solid var(--bordo); border-radius: var(--raggio-s);
  padding: .8rem 1rem; font-size: .85rem; white-space: pre-wrap; word-break: break-all; margin: 0; max-height: 28rem; overflow: auto; }
.grid.compatta td { font-size: .88rem; word-break: break-word; }
.griglia-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); gap: 1.2rem; }

/* Consegne: un errore lungo senza spazi (URL) allargava la tabella e spingeva fuori le Azioni */
.grid td.col-errore { max-width: 18rem; overflow-wrap: anywhere; word-break: break-word; }
.grid td.col-bridge { min-width: 14rem; }

/* ---------- Report bridge (15/9/2026) ---------- */
.filtri-report { display: flex; flex-wrap: wrap; gap: .8rem 1rem; align-items: flex-end; max-width: none; }
.filtri-report label { min-width: 10rem; }
.filtri-report .azioni-filtri { display: flex; gap: .5rem; flex-wrap: wrap; margin-left: auto; }
.report-lead td { max-width: 16rem; overflow-wrap: anywhere; }

/* ---------- Report bridge: estetica (15/9/2026) ---------- */
.report-bridge { margin: .45rem 0 0; font-size: 1rem; color: var(--testo); display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.filtri-report {
  display: grid; grid-template-columns: repeat(4, minmax(9rem, 1fr)) auto; gap: .9rem 1rem;
  align-items: end; max-width: none;
}
.filtri-report label { display: flex; flex-direction: column; gap: .3rem; font-size: .8rem; color: #3f5b68; font-weight: 600; min-width: 0; }
.filtri-report input, .filtri-report select {
  padding: .5rem .65rem; border: 1px solid var(--bordo-forte); border-radius: var(--raggio-s);
  font: inherit; font-size: .9rem; background: #fff; color: var(--testo); width: 100%; box-sizing: border-box;
}
.filtri-report .azioni-filtri { display: flex; gap: .5rem; align-items: center; margin: 0; }
.filtri-report .separatore { width: 1px; align-self: stretch; background: var(--bordo); margin: 0 .2rem; }
@media (max-width: 1100px) {
  .filtri-report { grid-template-columns: repeat(2, minmax(9rem, 1fr)); }
  .filtri-report .azioni-filtri { grid-column: 1 / -1; }
}
.periodo-report { margin: -.4rem 0 .8rem; color: var(--tenue); font-size: .88rem; }
.cards-report { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.cards-report .card { padding: 1rem 1.1rem; }
.cards-report .nota { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid th.num, .grid td.num { text-align: right; font-variant-numeric: tabular-nums; }
.grid td.zero { color: #c3d0d6; }
.grid td.allarme { color: #b3261e; font-weight: 600; }

/* ---------- Report bridge: tabella lead leggibile (15/9/2026) ---------- */
.report-lead th { vertical-align: bottom; }
.report-lead .th-campo { display: block; max-width: 14rem; white-space: normal; line-height: 1.3; text-transform: none;
  letter-spacing: 0; font-size: .78rem; }
.report-lead td { font-size: .88rem; max-width: none; overflow-wrap: normal; word-break: normal; }
.report-lead td.cella-testo { min-width: 7rem; max-width: 16rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-lead td a { color: var(--testo); text-decoration: none; }
.report-lead td a:hover { color: var(--verde); text-decoration: underline; }
.report-lead .data { color: var(--testo); }
.report-lead .ora { color: var(--tenue); margin-left: .25rem; }
.report-lead .vuoto-cella { color: #c3d0d6; }
.report-lead tbody tr:nth-child(even) { background: #fbfdfd; }
.report-lead .status + .status { margin-left: .25rem; }

/* ---------- Rinomina bridge (15/9/2026) ---------- */
.form-rinomina { display: inline; margin: 0 0 0 .3rem; }
.btn-rinomina { border: 0; background: transparent; color: var(--tenue); cursor: pointer; font-size: .95rem; padding: 0 .2rem; line-height: 1; }
.btn-rinomina:hover { color: var(--verde); }

/* ---------- Importa Excel (17/9/2026) ---------- */
.importa-form input[type=file] { padding: .6rem; border: 1px dashed var(--bordo-forte); border-radius: var(--raggio-s); background: #fafcfd; }
.importa-form select { max-width: 100%; }
.scelta-riga { display: flex; gap: .5rem; align-items: center; margin-bottom: 1rem; font-size: .9rem; }

/* ---------- Conversioni (17/9/2026) ---------- */
.esiti-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: .2rem 1rem; }
.esiti-griglia .scelta-riga { margin: 0; }
.status-vendita { background: #fff1c7; color: #7a5200; }
.card.accento-vendite .big { color: #7a5200; }