/* Testata comune di Centro comando e Console chat: sempre due righe, così
   non si sfalsa con la larghezza dello schermo (tablet, portatile, sala).

     1ª riga  [simbolo · titolo]  [stato della pagina ……]   [utente · ◐ · esci · ●]
     2ª riga  [le altre pagine ……………………]                  [strumenti di questa pagina]

   Ogni gruppo va a capo per conto suo se non ci sta: nessun pulsante esce
   dallo schermo e i menù a destra si aprono verso l'interno. */
header.testata{display:flex; flex-direction:column; align-items:stretch; gap:8px;
  flex-wrap:nowrap; padding:10px 20px 9px}
.testata .t-riga{display:flex; align-items:center; gap:8px 16px; min-width:0}
.testata .t-id{display:flex; align-items:center; gap:12px; flex:0 0 auto}
.testata .t-id h1{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.testata .t-stato{display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; flex:1 1 auto; min-width:0}
.testata .t-utente{display:flex; align-items:center; gap:10px; flex:0 0 auto; margin-left:auto}
.testata .t-nav{display:flex; align-items:center; flex-wrap:wrap; gap:8px; flex:1 1 auto; min-width:0}
.testata .t-strumenti{display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end;
  gap:8px; flex:0 1 auto; margin-left:auto}
.testata .t-strumenti .sep{width:1px; height:22px; background:var(--line); margin:0 2px}
.testata .btn{white-space:nowrap}
/* nome e «esci» li mette accesso.js dentro .t-utente: niente spinta a destra */
.testata #acc-chi{margin-left:0 !important; padding-left:0 !important}
/* i menù a tendina stanno a destra e si aprono verso sinistra, dentro lo schermo */
.testata .menu-pan{right:0; left:auto; max-width:calc(100vw - 24px)}
/* tablet e portatili: la scritta RESILNET accanto al simbolo e' un doppione, fa posto allo stato */
@media (max-width:1365px){ .testata .t-id .badge{display:none} }
/* telefono: tutto in colonna */
@media (max-width:720px){
  .testata .t-riga{flex-wrap:wrap}
  .testata .t-id{flex:0 1 auto; min-width:0}
  .testata .t-strumenti{justify-content:flex-start; margin-left:0}
}
/* titolo e sottotitolo uno sotto l'altro (la console chat ha il sottotitolo) */
.testata .tit{align-self:center; min-width:0}
.testata .tit > .sub{position:static; max-width:none}
