/* =============================================================================
   KILOLA - pages de document : conditions, confidentialité, suppression.

   Ces pages se lisent, parfois longuement, souvent sur un téléphone. Elles ne
   sont pas l'application : elles n'ont ni barre du bas, ni navigation, ni
   rien qui bouge. Une colonne, une échelle de titres, et du blanc.

   Elles suivent la charte comme le reste : deux couleurs, zéro bordure,
   Instrument Sans. Aucun des vingt tics interdits n'a sa place ici non plus.
   ============================================================================= */

.doc {
  max-width: 72ch;
  margin: 0 auto;
  padding: var(--e7) var(--e5) var(--e10);
}

/* L'en-tête : la marque ramène à l'accueil, et la date de version est dite.
   Un document sans date laisse croire qu'il n'a jamais changé. */
.doc-tete { margin-bottom: var(--e8); }
.doc-tete .wm { font-size: 26px; display: inline-block; }
.doc-tete h1 { margin-top: var(--e6); }
.doc-date { margin-top: var(--e3); }

/* Le sommaire. Sur un document long, savoir où l'on va évite de tout lire
   pour trouver une ligne. */
.doc-sommaire {
  background: var(--aub-04);
  border-radius: var(--r-sheet);
  padding: var(--e5);
  margin-bottom: var(--e8);
}
.doc-sommaire ol { margin: var(--e3) 0 0; padding-left: 1.2em; }
.doc-sommaire li { margin-bottom: var(--e2); }
.doc-sommaire a { color: var(--aub); }

.doc h2 {
  font-size: 21px;
  line-height: 1.2;
  font-weight: 650;
  color: var(--aub);
  margin: var(--e8) 0 var(--e4);
  scroll-margin-top: var(--e5);
}
.doc h3 {
  font-size: 17px;
  line-height: 1.3;
  font-weight: 650;
  margin: var(--e6) 0 var(--e3);
}
.doc p, .doc li { font-size: 16px; line-height: 1.6; }
.doc p { margin: 0 0 var(--e4); }
.doc ul, .doc ol { margin: 0 0 var(--e4); padding-left: 1.3em; }
.doc li { margin-bottom: var(--e2); }
.doc a { color: var(--aub); text-decoration: underline;
         text-decoration-color: var(--man); text-decoration-thickness: 2px;
         text-underline-offset: 3px; }
.doc strong { font-weight: 650; }

/* Un encadré qui porte une phrase importante. Pas de bordure : un aplat. */
.doc-note {
  background: var(--aub-04);
  border-radius: var(--r-sheet);
  padding: var(--e5);
  margin: 0 0 var(--e5);
}
.doc-note p:last-child { margin-bottom: 0; }

/* Les tableaux de durées de conservation. Ils se lisent sur un téléphone :
   ils défilent horizontalement plutôt que de comprimer les colonnes. */
.doc-tab { overflow-x: auto; margin: 0 0 var(--e5); }
.doc-tab table { width: 100%; border-collapse: collapse; min-width: 30rem; }
.doc-tab th, .doc-tab td {
  text-align: left;
  padding: var(--e3) var(--e4);
  font-size: 14px;
  line-height: 1.4;
  vertical-align: top;
}
.doc-tab th { font-weight: 650; color: var(--aub); }
.doc-tab tbody tr:nth-child(odd) { background: var(--aub-04); }

.doc-pied {
  margin-top: var(--e10);
  padding-top: var(--e6);
}
.doc-pied a { margin-right: var(--e4); }