/* Foglio di stile dell'amministrazione: solo quello che Django non fa da se'.
   Lo carica templates/admin/base_site.html, nel blocco `extrastyle`, dopo i
   fogli di Django: a parita' di selettore vince questo.

   --- tabelle lunghe e larghe (richieste dell'1/10, Impaginazione 2 e 3) ---
   L'elenco di ogni sezione, e i riquadri a tabella dentro una scheda (le
   righe e le ore della commessa, i listini dell'articolo), stanno in un
   riquadro alto al massimo quanto lo schermo, che scorre per conto suo.
   Cosi':
   - i nomi delle colonne restano in cima al riquadro mentre si scende;
   - la barra per scorrere a destra sta in fondo al riquadro, quindi sullo
     schermo, e non in fondo a tutta la tabella.
   Le frecce della tastiera invece no: un clic dentro il riquadro da' il
   fuoco a tutta la pagina (`<main tabindex="-1">` di Django), e le frecce
   fanno scorrere quella. Provato l'1/10.

   L'altezza dell'elenco lascia fuori quello che gli sta sopra
   (intestazione, percorso, ricerca, azioni), cosi' all'apertura il
   riquadro sta intero sullo schermo, barra compresa: un riquadro piu' alto
   dello schermo farebbe scorrere le sue righe sotto la rotellina con la
   barra ancora fuori vista, in basso. Misurato l'1/10 su tutti gli elenchi:
   sopra il riquadro ci sono fra 158 e 264 pixel a 1390 di larghezza, 321
   negli articoli a 1100; i 21rem (336 pixel) lasciano posto anche al
   messaggio verde che compare dopo un salvataggio. I riquadri dentro una
   scheda stanno piu' in giu' nella pagina: ci si arriva scendendo, e quando
   ci si e' arrivati devono starci interi.

   `position: relative` fa del riquadro il riferimento di quello che dentro
   e' posizionato da Django: l'etichetta sopra ogni riga di una scheda
   («1 pz - Filtro olio motore») e il calendario che si apre accanto a una
   data. Senza, misurato l'1/10 sulle righe di una commessa: scorrendo il
   riquadro le righe salivano e le etichette restavano ferme, cosi' ogni
   riga leggeva il nome di un'altra, e il calendario si apriva spostato in
   giu' di quanto il riquadro era stato fatto scorrere. */
#changelist-form .results {
    position: relative;
    max-height: max(18rem, calc(100vh - 21rem));
    overflow: auto;
}

.inline-group .tabular fieldset.module {
    position: relative;
    max-height: max(18rem, calc(100vh - 3rem));
    overflow: auto;
}

/* `top: -1px` e non 0: le tabelle di Django hanno i bordi uniti
   (`border-collapse`), e la prima riga di pixel dell'intestazione - il suo
   bordo - non la segue quando resta ferma. Con 0, le righe che le scorrono
   sotto si vedevano da quella fessura, una riga di pixel colorati in cima. */
#changelist-form .results thead th,
.inline-group .tabular thead th {
    position: sticky;
    top: -1px;
    z-index: 2;
}

/* Il titolo del riquadro (es. «Righe») resta fermo scorrendo a destra. */
.inline-group .tabular fieldset.module > h2 {
    position: sticky;
    left: 0;
}

/* --- i pulsantini per ordinare ---
   Django disegna la freccetta solo sulla colonna che sta gia' mettendo in
   ordine: le altre si ordinano con un clic sul nome, ma non lo dicono. Qui
   ogni colonna che si puo' ordinare porta le due frecce. Quelle che non si
   ordinano (i collegamenti ai PDF, i prezzi e gli importi che si calcolano)
   restano senza. */
#changelist table thead th.sortable:not(.sorted) .text a::after {
    content: "\21C5";
    margin-left: .375rem;
    opacity: .5;
}