/* ============================================================================
   Typographie des documents juridiques (/politique-de-confidentialite,
   /conditions-utilisation, /mentions-legales).

   Chargée uniquement par les pages produites par scripts/legal-build.js.
   Ce fichier ne contient aucun texte : il ne fait que mettre en forme le
   Markdown rendu depuis hygipack-mobile/legal/.
   ============================================================================ */

.legal {
  max-width: 74ch;
}

.legal h1 {
  padding-bottom: var(--hp-space-22);
  border-bottom: 1px solid var(--hp-line);
}

.legal h2 {
  margin-top: var(--hp-space-48);
  font-size: var(--hp-text-h2);
  line-height: var(--hp-leading-h2);
  letter-spacing: var(--hp-tracking-h2);
  padding-top: var(--hp-space-8);
}

.legal h3 {
  margin-top: var(--hp-space-32);
  font-size: var(--hp-text-h3);
  line-height: var(--hp-leading-h3);
}

.legal h4,
.legal h5,
.legal h6 {
  margin-top: var(--hp-space-26);
  font-size: var(--hp-text-body);
  color: var(--hp-ink-title);
  font-weight: 600;
}

.legal p {
  margin-top: var(--hp-space-16);
  color: var(--hp-ink-strong);
}

.legal ul,
.legal ol {
  margin-top: var(--hp-space-16);
  padding-left: var(--hp-space-26);
  color: var(--hp-ink-strong);
}

.legal li + li { margin-top: var(--hp-space-8); }

.legal ol > li::marker { font-weight: 600; color: var(--hp-ink-title); }

.legal strong { color: var(--hp-ink-title); font-weight: 600; }

.legal code {
  font-family: 'IBM Plex Mono', ui-monospace, Consolas, monospace;
  font-size: 0.9em;
  background: var(--hp-surface-page);
  border: 1px solid var(--hp-line-control);
  border-radius: 4px;
  padding: 1px 5px;
}

.legal blockquote {
  margin: var(--hp-space-22) 0 0;
  padding: var(--hp-space-16) var(--hp-space-22);
  background: var(--hp-blue-veil);
  border-left: 3px solid var(--hp-blue);
  border-radius: 0 var(--hp-radius-control) var(--hp-radius-control) 0;
}

.legal blockquote p {
  margin-top: 0;
  color: var(--hp-ink);
}

/* Les tableaux défilent dans leur propre conteneur : la page ne défile
   jamais horizontalement, y compris sur un téléphone. */
.legal .table-scroll {
  margin-top: var(--hp-space-22);
  overflow-x: auto;
  border: 1px solid var(--hp-line);
  border-radius: var(--hp-radius-card);
}

.legal table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--hp-text-label);
}

.legal th,
.legal td {
  text-align: left;
  vertical-align: top;
  padding: var(--hp-space-12) var(--hp-space-16);
  border-bottom: 1px solid var(--hp-line);
}

.legal th {
  background: var(--hp-surface-page);
  color: var(--hp-ink-title);
  font-weight: 600;
  white-space: nowrap;
}

.legal tbody tr:last-child td { border-bottom: none; }