/* packages/ui/src/documents/document.css
   The one stylesheet of the customer documents (M4-13). The portal imports it through styles.css; the PDF carries the same text inline
   (`DOCUMENT_CSS`, generated into document-css.ts by `pnpm exec tsx packages/ui/scripts/document-css.ts`; a test fails when the two differ).
   Every colour is a token with the light theme value of tokens.css as its fallback, because the PDF page has no tokens and is white paper;
   a test holds each fallback equal to the token. No url function, no import rule and no font file: the page given to the PDF engine fetches nothing. */

.zti-doc {
  --doc-text: var(--text, #18181b);
  --doc-muted: var(--text-muted, #55555c);
  --doc-line: var(--line, #e6e6e3);
  --doc-line-strong: var(--line-strong, #d2d2ce);
  --doc-surface: var(--surface-2, #f4f4f2);
  color: var(--doc-text);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 11pt;
  line-height: 1.5;
  max-width: 46rem;
  overflow-wrap: anywhere;
}
.zti-doc h1 { font-size: 1.6em; line-height: 1.2; margin: 0 0 0.4em; }
.zti-doc h2 { font-size: 1.2em; line-height: 1.3; margin: 1.6em 0 0.5em; break-after: avoid; }
.zti-doc h3 { font-size: 1em; margin: 1em 0 0.3em; break-after: avoid; }
.zti-doc p { margin: 0 0 0.7em; }
.zti-doc ol, .zti-doc ul { margin: 0 0 0.8em; padding-left: 1.3em; list-style: none; }
.zti-doc li { margin: 0 0 0.4em; position: relative; }
/* A marker drawn as a shape, never as text: a list marker the browser prints is text in the PDF, and the text of the PDF is checked against the page. */
.zti-doc li::before { content: ""; position: absolute; left: -1em; top: 0.62em; width: 0.35em; height: 0.35em; border-radius: 50%; background: currentColor; }
.zti-doc a { color: inherit; text-decoration: underline; }
.zti-doc__lead { color: var(--doc-muted); }
.zti-doc__note { color: var(--doc-muted); font-size: 0.9em; }
.zti-doc__summary { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6em 2em; margin: 1em 0; }
.zti-doc__summary dt { color: var(--doc-muted); font-size: 0.9em; }
.zti-doc__summary dd { margin: 0 0 0.3em; }
.zti-doc__example { border: 1px solid var(--doc-line-strong); border-radius: 6px; padding: 0.6em 0.9em; margin: 0 0 0.7em; break-inside: avoid; }
.zti-doc__example-id { color: var(--doc-muted); font-size: 0.85em; }
.zti-doc__checks { color: var(--doc-muted); font-size: 0.85em; }
.zti-doc__fingerprint { font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.9em; }
.zti-doc table { border-collapse: collapse; width: 100%; margin: 0 0 1em; font-size: 0.9em; }
.zti-doc th, .zti-doc td { border: 1px solid var(--doc-line); padding: 0.35em 0.5em; text-align: left; vertical-align: top; }
.zti-doc th { background: var(--doc-surface); }
.zti-doc__signature { display: block; max-height: 6em; margin: 0.5em 0; }
.zti-doc__certificate { break-before: page; }

@media (min-width: 40rem) {
  .zti-doc__summary { grid-template-columns: 14rem minmax(0, 1fr); }
  .zti-doc__summary dd { margin: 0; }
}
@media print {
  .zti-doc { font-size: 10.5pt; max-width: none; }
  .zti-doc__summary { grid-template-columns: 14rem minmax(0, 1fr); }
  .zti-doc__summary dd { margin: 0; }
}
@page { size: A4; margin: 18mm; }
