/*
 * The document sheet: the A4 page of an invoice, quote or act.
 *
 * One stylesheet for every place the sheet is drawn — the live preview of the editor, the frozen
 * view of a final document, the public link, the server PDF and the guest's print (architecture.md
 * §3, KINV-26). The PHP view of the sheet is KINV-26's; it takes this file and does not restyle.
 *
 * Because the PDF is drawn by Dompdf over this very CSS, the layout keeps to its subset: blocks,
 * tables and `display: table` cells, no flex and no grid. The only on-screen extra is the fit to
 * the box at the bottom (`zoom` by `--sheet-zoom`, set by js/sheet-fit.js; Dompdf never has it):
 * the sheet fills the block it lies in, at any width.
 *
 * A white sheet on the warm page, no border (defaults 3.10.1): the space belongs to the document.
 *
 * Size (process.md §6, over 300 lines): one A4 page for every representation, its print block and
 * the theme blocks (KINV-137) included — the Dompdf guard and the server PDF read one file.
 */

.app-sheet {
    /* PDF parity (KINV-19): Dompdf has no box-sizing, so the sheet is content-box on both sides and
       its 794px are the content plus the padding — the same A4 width as base.css's border-box. */
    box-sizing: content-box;
    width: calc(var(--w-sheet) - 2 * var(--space-6));
    /* The bottom padding is the foot's (below): Dompdf keeps an ancestor's bottom padding free on
       every page it breaks, the browser only after the last line — a long table broke a row earlier. */
    padding: var(--space-6) var(--space-6) 0;
    background: var(--surface);
    color: var(--text);
    /* The invoices are set in the display serif, so the site speaks the document's language
       (product-kit.md §3). */
    font-family: var(--font-display);
    font-size: var(--fs-caption);
    line-height: var(--lh-text);
}

/* A row the view or sheet.js hides (`hidden`): Dompdf's own default sheet is not trusted for it. */
.app-sheet [hidden] {
    display: none;
}

/* A document in Armenian or Georgian: the script face first (typography.css, fonts/README.md). */
.app-sheet--lang-hy {
    font-family: var(--font-display-hy);
}

.app-sheet--lang-ka {
    font-family: var(--font-display-ka);
    /* Georgian has no letter case: Mkhedruli uppercased becomes Mtavruli (U+1C90+), which the PDF
       draws as boxes (the old site's lesson). A rule that uppercases resets here — SheetCssSubsetTest. */
    text-transform: none;
}

/* Typed text keeps its line breaks: an address, the notes, a description. */
.app-sheet__text {
    white-space: pre-line;
}

/* The English half of a bilingual caption, inline and quieter (spec §5, A35.1). */
.app-sheet__label-en {
    color: var(--text-4);
}

.app-sheet__row {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.app-sheet__cell {
    display: table-cell;
    vertical-align: top;
}

.app-sheet__cell--end {
    text-align: right;
}

/* Two cells side by side: the second keeps clear of the first. */
.app-sheet__cell + .app-sheet__cell {
    padding-left: var(--space-5);
}

/*
 * The owner's logo on a line of its own above the head: at the left by default (the old
 * constructor), centred or at the right where the theme's layout says so (owner A81; the themes
 * set the class, KINV-137). Sizes, not spacing.
 */
.app-sheet__brand {
    margin: 0 0 var(--space-2);
}

.app-sheet--logo-center .app-sheet__brand {
    text-align: center;
}

.app-sheet--logo-right .app-sheet__brand {
    text-align: right;
}

.app-sheet__logo {
    max-width: 240px;
    max-height: 72px;
}

/* Title and number on the left, the dates at the right edge. */
.app-sheet__title {
    margin: 0;
    /* The sheet's face, script and theme included — not the display face base.css gives every h3. */
    font-family: inherit;
    font-size: var(--fs-h2);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.app-sheet__number {
    margin: 0;
    color: var(--text-3);
}

.app-sheet__meta {
    margin: 0;
    /* Tight, as the parties below: a head stacked by its theme (Modern, Elegant) stays on A4. */
    line-height: var(--lh-tight);
}

.app-sheet__label {
    color: var(--text-3);
}

/* From and Bill to stand side by side under the head. */
.app-sheet__parties {
    margin-top: var(--space-5);
}

.app-sheet__party-title {
    margin: 0;
    color: var(--text-3);
    font-size: var(--fs-caption);
    font-weight: var(--fw-regular);
}

.app-sheet__name {
    margin: 0;
    font-size: var(--fs-body);
    font-weight: var(--fw-semibold);
}

.app-sheet__line {
    margin: 0;
    /* The chosen text colour paints the party lines too (D-147); the titles above them keep the theme's. */
    color: var(--sheet-ink, var(--text-2));
    /* Tight lines in the parties, the totals and the foot: the full invoice keeps to one A4 page in
       every theme (KINV-137; probes/sheet-a4.mjs). */
    line-height: var(--lh-tight);
}

/* PDF parity (KINV-19): a long document breaks between rows, and the totals move to the next page
   whole — the browser print and Dompdf break at the same places. */
.app-sheet__items tr,
.app-sheet__totals {
    page-break-inside: avoid;
}

/* The items: a hairline under the heading and between rows, nothing vertical. */
.app-sheet__items {
    width: 100%;
    margin-top: var(--space-5);
    border-collapse: collapse;
    font-variant-numeric: var(--numeric);
}

.app-sheet__items th {
    padding: var(--space-1) var(--space-1) var(--space-1) 0;
    border-bottom: 1px solid var(--border-2);
    color: var(--text-3);
    font-weight: var(--fw-regular);
    text-align: left;
}

.app-sheet__items td {
    padding: var(--space-1) var(--space-1) var(--space-1) 0;
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}

.app-sheet__items th.app-sheet__num,
.app-sheet__items td.app-sheet__num {
    padding-right: 0;
    text-align: right;
    white-space: nowrap;
}

/* Totals hug the right edge: caption, figure right-aligned, the currency in its own column so
   the codes stand under one another. */
.app-sheet__totals {
    margin-left: auto;
    border-collapse: collapse;
    font-variant-numeric: var(--numeric);
    line-height: var(--lh-tight);
}

.app-sheet__totals th {
    padding: var(--space-0) var(--space-3) var(--space-0) 0;
    color: var(--text-3);
    font-weight: var(--fw-regular);
    text-align: left;
}

.app-sheet__totals td {
    padding: var(--space-0) 0;
    font-weight: var(--fw-semibold);
    text-align: right;
    white-space: nowrap;
}

/* PDF parity (KINV-19): the step above the totals is their first row's, not a margin: Dompdf will
   not break a page inside a margin and took the last item row along to the next page; the browser
   truncates a margin at a break. The subtotal row is always the first. */
.app-sheet__totals tr:first-child th,
.app-sheet__totals tr:first-child td {
    padding-top: calc(var(--space-3) + var(--space-0));
}

.app-sheet__totals .app-sheet__currency {
    padding-left: var(--space-1);
    color: var(--text-3);
    font-weight: var(--fw-regular);
    text-align: left;
}

/* The final line of the totals is the one the eye looks for. */
.app-sheet__totals-main th,
.app-sheet__totals-main td {
    padding-top: var(--space-1);
    border-top: 1px solid var(--border-2);
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
}

/* The foot: notes, bank details, the signature row, the guest's credit line; the sheet's bottom edge. */
.app-sheet__foot {
    margin-top: var(--space-6);
    padding-bottom: var(--space-6);
    color: var(--text-3);
    line-height: var(--lh-tight);
}

.app-sheet__foot p {
    margin: 0;
}

/* The guest's credit line stands apart from the signature row above it (the signatory is in that row). */
.app-sheet__foot .app-sheet__sign {
    margin-top: var(--space-3);
}

/* The guest's credit line: the product wordmark (Brand::wordmark) and the address, one link (D-108). */
.app-sheet__credit {
    color: inherit;
}

.app-sheet__wordmark {
    color: var(--text-3);
    font-weight: var(--fw-bold);
}

.app-sheet__wordmark b {
    color: var(--text);
}

/* The note of a line's discount beside its description. */
.app-sheet__note {
    color: var(--text-3);
}

/*
 * The signature row ends the foot (the old renderer): the left cell balancing the signature
 * column holds the QR when there is one (.app-sheet__qr), the stamp centred on the page, the
 * signature column at the right — image, name, caption. A three-cell table, since Dompdf has no flex.
 */
.app-sheet__signs {
    width: 100%;
    margin-top: var(--space-5);
    border-collapse: collapse;
    table-layout: fixed;
}

/* PDF parity (KINV-19): a foot without notes and bank starts with the signature row, whose margin the
   browser collapses into the foot's; Dompdf does not (the white space around the hidden rows stops
   its collapse), so there the row takes none — the same 32px from the totals in both. */
.app-sheet__foot > p[hidden]:first-child + p[hidden] + p[hidden] + p[hidden] + .app-sheet__signs {
    margin-top: 0;
}

.app-sheet__signs td {
    padding: 0;
    text-align: center;
    vertical-align: bottom;
}

.app-sheet__sign-name {
    color: var(--text);
}

.app-sheet__stamp {
    max-width: 140px;
    max-height: 140px;
}

.app-sheet__signature {
    max-width: 200px;
    max-height: 72px;
}

/* The QR of the public link in the row's empty left cell (KINV-207): 20 mm, 76px at the PDF's 96 dpi — under the
   stamp's 140px, so beside a stamp it adds no height. Width and height both: Dompdf sizes an image by them. */
.app-sheet__qr {
    width: 76px;
    height: 76px;
}

/* PDF parity (KINV-19) — a look item for the owner's batch: no strut gap under an image. Dompdf
   cannot draw the gap (it does not set an image on the text baseline), so the screen drops it too:
   the head starts 7px higher under a logo. Without it the screen has the gap and the PDF does not. */
.app-sheet__logo,
.app-sheet__stamp,
.app-sheet__signature,
.app-sheet__qr {
    vertical-align: top;
}

/*
 * The VOID mark of a voided document: a line of its own above the head, added when the sheet is
 * drawn and not part of the frozen content (map А.Б3 Б12). A boxed word, not a rotated stamp:
 * Dompdf draws blocks and borders, not transforms.
 */
.app-sheet__void {
    margin: 0 0 var(--space-4);
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--negative);
    color: var(--negative);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    text-align: center;
}

/*
 * The room a sheet scales to where the page is not the editor: the card of a document, the public
 * page. The editor's column is its own container (layout.css); this is the same for the others.
 */
.app-sheet-box {
    container-type: inline-size;
    /* Never larger than the page itself: on a wide card or the public page the sheet stops at A4. */
    max-width: var(--w-sheet);
}

/*
 * On screen the sheet is a picture of the A4 page, not UI text, so it may be smaller than the 15px
 * floor: it takes the whole width of its box and everything in it (type, spacing, hairlines)
 * scales with it, 794px of box = 100 % (KINV-122, owner 23.10.2026: no empty band beside the
 * sheet). `zoom` shrinks the layout box too (a transform would leave the full-size hole behind).
 * The factor is a unitless number that js/sheet-fit.js measures (box content width / 794px) and
 * writes as `--sheet-zoom` on the box: a division of lengths in CSS is not understood by Firefox
 * (KINV-125). Where the script has not run — print, the PDF — the fallback keeps 100 %.
 */
.app-editor__sheet .app-sheet,
.app-sheet-box .app-sheet {
    zoom: var(--sheet-zoom, 1);
}

/* Themes (KINV-137) */

/*
 * The themes of the document (spec §3.1 Theme): the classes ThemeRegistry::sheetClasses() puts on
 * the root — the theme, the logo's place (above), the accent swatch and the text colour swatch.
 * SheetThemeClassesTest holds every class it can emit to a selector here, and every selector here to
 * a registered theme or swatch. The first data set draws the old constructor's levers (font, title,
 * head, items head, density, accent captions, grid); a shared lever is one selector list.
 * The screen media only — no `@media` in this block: the print and the server PDF draw what the
 * screen draws. The band stays inside the sheet padding: its bleed to the edge would need a
 * negative margin, which has no token.
 */

/* The swatches (colors.css `--swatch-*`): the accent the theme draws with, the ink of the text. */
.app-sheet--accent-1 { --sheet-accent: var(--swatch-accent-1); }
.app-sheet--accent-2 { --sheet-accent: var(--swatch-accent-2); }
.app-sheet--accent-3 { --sheet-accent: var(--swatch-accent-3); }
.app-sheet--accent-4 { --sheet-accent: var(--swatch-accent-4); }
.app-sheet--accent-5 { --sheet-accent: var(--swatch-accent-5); }
.app-sheet--accent-6 { --sheet-accent: var(--swatch-accent-6); }
.app-sheet--accent-7 { --sheet-accent: var(--swatch-accent-7); }
.app-sheet--accent-8 { --sheet-accent: var(--swatch-accent-8); }

.app-sheet--text-1 { --sheet-ink: var(--swatch-text-1); color: var(--sheet-ink); }
.app-sheet--text-2 { --sheet-ink: var(--swatch-text-2); color: var(--sheet-ink); }
.app-sheet--text-3 { --sheet-ink: var(--swatch-text-3); color: var(--sheet-ink); }
.app-sheet--text-4 { --sheet-ink: var(--swatch-text-4); color: var(--sheet-ink); }
.app-sheet--text-5 { --sheet-ink: var(--swatch-text-5); color: var(--sheet-ink); }
.app-sheet--text-6 { --sheet-ink: var(--swatch-text-6); color: var(--sheet-ink); }

/* Font: Classic and Elegant keep the document serif of the base; the others are set in Noto Sans. */
.app-sheet--theme-modern,
.app-sheet--theme-minimal,
.app-sheet--theme-bold,
.app-sheet--theme-compact,
.app-sheet--theme-corporate,
.app-sheet--theme-swiss {
    font-family: var(--font-doc-sans);
}

/* A sans theme in Armenian or Georgian: the sans script face first (after the base `--lang-*`). */
.app-sheet--theme-modern.app-sheet--lang-hy,
.app-sheet--theme-minimal.app-sheet--lang-hy,
.app-sheet--theme-bold.app-sheet--lang-hy,
.app-sheet--theme-compact.app-sheet--lang-hy,
.app-sheet--theme-corporate.app-sheet--lang-hy,
.app-sheet--theme-swiss.app-sheet--lang-hy {
    font-family: var(--font-doc-sans-hy);
}

.app-sheet--theme-modern.app-sheet--lang-ka,
.app-sheet--theme-minimal.app-sheet--lang-ka,
.app-sheet--theme-bold.app-sheet--lang-ka,
.app-sheet--theme-compact.app-sheet--lang-ka,
.app-sheet--theme-corporate.app-sheet--lang-ka,
.app-sheet--theme-swiss.app-sheet--lang-ka {
    font-family: var(--font-doc-sans-ka);
}

/* Every theme: the title and the final total in the accent (the tile pictures). */
.app-sheet--theme-classic .app-sheet__title,
.app-sheet--theme-modern .app-sheet__title,
.app-sheet--theme-minimal .app-sheet__title,
.app-sheet--theme-bold .app-sheet__title,
.app-sheet--theme-elegant .app-sheet__title,
.app-sheet--theme-compact .app-sheet__title,
.app-sheet--theme-corporate .app-sheet__title,
.app-sheet--theme-swiss .app-sheet__title {
    color: var(--sheet-accent);
}

.app-sheet--theme-classic .app-sheet__totals-main th,
.app-sheet--theme-classic .app-sheet__totals-main td,
.app-sheet--theme-modern .app-sheet__totals-main th,
.app-sheet--theme-modern .app-sheet__totals-main td,
.app-sheet--theme-minimal .app-sheet__totals-main th,
.app-sheet--theme-minimal .app-sheet__totals-main td,
.app-sheet--theme-bold .app-sheet__totals-main th,
.app-sheet--theme-bold .app-sheet__totals-main td,
.app-sheet--theme-elegant .app-sheet__totals-main th,
.app-sheet--theme-elegant .app-sheet__totals-main td,
.app-sheet--theme-compact .app-sheet__totals-main th,
.app-sheet--theme-compact .app-sheet__totals-main td,
.app-sheet--theme-corporate .app-sheet__totals-main th,
.app-sheet--theme-corporate .app-sheet__totals-main td,
.app-sheet--theme-swiss .app-sheet__totals-main th,
.app-sheet--theme-swiss .app-sheet__totals-main td {
    border-top: 2px solid var(--sheet-accent);
    color: var(--sheet-accent);
}

/* Title in capitals: Modern, Minimal, Bold, Corporate, Swiss. Never in Georgian (Mtavruli boxes). */
.app-sheet--theme-modern .app-sheet__title,
.app-sheet--theme-minimal .app-sheet__title,
.app-sheet--theme-bold .app-sheet__title,
.app-sheet--theme-corporate .app-sheet__title,
.app-sheet--theme-swiss .app-sheet__title {
    text-transform: uppercase;
}

.app-sheet--theme-modern.app-sheet--lang-ka .app-sheet__title,
.app-sheet--theme-minimal.app-sheet--lang-ka .app-sheet__title,
.app-sheet--theme-bold.app-sheet--lang-ka .app-sheet__title,
.app-sheet--theme-corporate.app-sheet--lang-ka .app-sheet__title,
.app-sheet--theme-swiss.app-sheet--lang-ka .app-sheet__title {
    text-transform: none;
}

/* A large title: Bold, Elegant. */
.app-sheet--theme-bold .app-sheet__title,
.app-sheet--theme-elegant .app-sheet__title {
    font-size: var(--fs-page);
}

/* The title block at the right (Modern) or centred (Elegant): title over the dates, one column. */
.app-sheet--theme-modern .app-sheet__head .app-sheet__row,
.app-sheet--theme-modern .app-sheet__head .app-sheet__cell,
.app-sheet--theme-elegant .app-sheet__head .app-sheet__row,
.app-sheet--theme-elegant .app-sheet__head .app-sheet__cell {
    display: block;
}

.app-sheet--theme-modern .app-sheet__head .app-sheet__cell {
    text-align: right;
}

.app-sheet--theme-elegant .app-sheet__head .app-sheet__cell {
    text-align: center;
}

.app-sheet--theme-modern .app-sheet__head .app-sheet__cell + .app-sheet__cell,
.app-sheet--theme-elegant .app-sheet__head .app-sheet__cell + .app-sheet__cell {
    margin-top: var(--space-0);
    padding-left: 0;
}

/* Head «rule»: an accent line under the head (Classic, Elegant, Corporate). */
.app-sheet--theme-classic .app-sheet__head,
.app-sheet--theme-elegant .app-sheet__head,
.app-sheet--theme-corporate .app-sheet__head {
    padding-bottom: var(--space-3);
    border-bottom: 2px solid var(--sheet-accent);
}

/* Head «plain»: a hairline (Minimal, Compact, Swiss). */
.app-sheet--theme-minimal .app-sheet__head,
.app-sheet--theme-compact .app-sheet__head,
.app-sheet--theme-swiss .app-sheet__head {
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--border);
}

/* Head «band»: the head on the accent, its words white (Modern, Bold). */
.app-sheet--theme-modern .app-sheet__head,
.app-sheet--theme-bold .app-sheet__head {
    padding: var(--space-3);
    background: var(--sheet-accent);
    color: var(--surface);
}

.app-sheet--theme-modern .app-sheet__head .app-sheet__title,
.app-sheet--theme-modern .app-sheet__head .app-sheet__number,
.app-sheet--theme-modern .app-sheet__head .app-sheet__label,
.app-sheet--theme-modern .app-sheet__head .app-sheet__label-en,
.app-sheet--theme-bold .app-sheet__head .app-sheet__title,
.app-sheet--theme-bold .app-sheet__head .app-sheet__number,
.app-sheet--theme-bold .app-sheet__head .app-sheet__label,
.app-sheet--theme-bold .app-sheet__head .app-sheet__label-en {
    color: var(--surface);
}

/* A band theme sets the logo on a paper chip, as its tile shows: an owner's logo is drawn for a white
   page, not for the accent. */
.app-sheet--theme-modern .app-sheet__logo,
.app-sheet--theme-bold .app-sheet__logo {
    padding: var(--space-0);
    background: var(--surface);
}

/* The cell grid: Corporate, Swiss. Before the items heads, so their accent edge under the heading
   wins over the grey grid line (same specificity, later rule). */
.app-sheet--theme-corporate .app-sheet__items th,
.app-sheet--theme-corporate .app-sheet__items td,
.app-sheet--theme-swiss .app-sheet__items th,
.app-sheet--theme-swiss .app-sheet__items td {
    border: 1px solid var(--border);
}

/* Items head «fill»: the heading row on the accent (Classic, Modern, Bold, Compact, Corporate). */
.app-sheet--theme-classic .app-sheet__items th,
.app-sheet--theme-modern .app-sheet__items th,
.app-sheet--theme-bold .app-sheet__items th,
.app-sheet--theme-compact .app-sheet__items th,
.app-sheet--theme-corporate .app-sheet__items th {
    /* Longhands (KINV-19): Dompdf drops the `background` shorthand with a var() on a table cell, and
       lets the grid's `border` above beat a later `border-bottom` shorthand of the same weight. */
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--sheet-accent);
    background-color: var(--sheet-accent);
    color: var(--surface);
}

/* Items head «line»: accent words over an accent rule (Minimal, Elegant, Swiss). */
.app-sheet--theme-minimal .app-sheet__items th,
.app-sheet--theme-elegant .app-sheet__items th,
.app-sheet--theme-swiss .app-sheet__items th {
    /* Longhands, as the filled head above (KINV-19). */
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: var(--sheet-accent);
    color: var(--sheet-accent);
}

/* A filled head or a grid keeps the words off the edges of the cells. */
.app-sheet--theme-classic .app-sheet__items th,
.app-sheet--theme-classic .app-sheet__items td,
.app-sheet--theme-modern .app-sheet__items th,
.app-sheet--theme-modern .app-sheet__items td,
.app-sheet--theme-bold .app-sheet__items th,
.app-sheet--theme-bold .app-sheet__items td,
.app-sheet--theme-compact .app-sheet__items th,
.app-sheet--theme-compact .app-sheet__items td,
.app-sheet--theme-corporate .app-sheet__items th,
.app-sheet--theme-corporate .app-sheet__items td,
.app-sheet--theme-swiss .app-sheet__items th,
.app-sheet--theme-swiss .app-sheet__items td {
    padding-left: var(--space-1);
}

.app-sheet--theme-classic .app-sheet__items .app-sheet__num,
.app-sheet--theme-modern .app-sheet__items .app-sheet__num,
.app-sheet--theme-bold .app-sheet__items .app-sheet__num,
.app-sheet--theme-compact .app-sheet__items .app-sheet__num,
.app-sheet--theme-corporate .app-sheet__items .app-sheet__num,
.app-sheet--theme-swiss .app-sheet__items .app-sheet__num {
    padding-right: var(--space-1);
}

/* Party titles in the accent: Classic, Modern, Bold, Compact, Corporate. */
.app-sheet--theme-classic .app-sheet__party-title,
.app-sheet--theme-modern .app-sheet__party-title,
.app-sheet--theme-bold .app-sheet__party-title,
.app-sheet--theme-compact .app-sheet__party-title,
.app-sheet--theme-corporate .app-sheet__party-title {
    color: var(--sheet-accent);
    font-weight: var(--fw-semibold);
}

/* Density «airy»: wider steps between the sections (Minimal, Elegant). */
.app-sheet--theme-minimal .app-sheet__parties,
.app-sheet--theme-minimal .app-sheet__items,
.app-sheet--theme-elegant .app-sheet__parties,
.app-sheet--theme-elegant .app-sheet__items {
    margin-top: var(--space-6);
}

/* Density «compact»: tight lines, narrow padding and steps (Compact, Swiss). The type keeps the
   15px floor of the system (typography.css; measure.mjs 17.8): --fs-dense is the items inputs' only. */
.app-sheet--theme-compact,
.app-sheet--theme-swiss {
    width: calc(var(--w-sheet) - 2 * var(--space-5));
    padding: var(--space-5) var(--space-5) 0;
    line-height: var(--lh-tight);
}

.app-sheet--theme-compact .app-sheet__foot,
.app-sheet--theme-swiss .app-sheet__foot {
    padding-bottom: var(--space-5);
}

.app-sheet--theme-compact .app-sheet__parties,
.app-sheet--theme-compact .app-sheet__items,
.app-sheet--theme-swiss .app-sheet__parties,
.app-sheet--theme-swiss .app-sheet__items {
    margin-top: var(--space-3);
}

.app-sheet--theme-compact .app-sheet__items th,
.app-sheet--theme-compact .app-sheet__items td,
.app-sheet--theme-swiss .app-sheet__items th,
.app-sheet--theme-swiss .app-sheet__items td {
    padding-top: var(--space-0);
    padding-bottom: var(--space-0);
}

/*
 * The guest's PDF is the browser's print of the sheet marked `data-print` (architecture.md §3.5,
 * D-031): A4, the first page with no margin, so the browser adds no header or footer there; nothing
 * else of the page is laid out, the boxes around the sheet lose their layout, and the sheet prints at
 * 100 % without the editor's frame (layout.css). The server PDF is drawn in the screen media: of this
 * block only the `@page` rules reach Dompdf (PdfStyles), so `:has()` is fine here (Chromium, Firefox 121+).
 */
@media print {
    /* A continuation page keeps the sheet's edge above and below; the first has the sheet's own
       padding (KINV-19). The server PDF takes these two rules from here (PdfStyles). */
    @page {
        size: A4;
        margin: var(--space-6) 0;
    }

    @page :first {
        margin: 0;
    }

    body:has(.app-sheet[data-print]) :not(:has(.app-sheet[data-print])):not(.app-sheet[data-print], .app-sheet[data-print] *) {
        display: none;
    }

    :has(.app-sheet[data-print]) {
        display: block;
        width: auto;
        max-width: none;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        background: none;
        box-shadow: none;
        container-type: normal;
    }

    /* Above the fit above. */
    body .app-sheet[data-print] {
        zoom: 1;
        margin: 0;
        print-color-adjust: exact;
    }

    /* Only the editor's screen frame goes (layout.css `.app-editor__sheet .app-sheet`): a border a
       theme gives the sheet itself prints as it shows (KINV-137). */
    body .app-editor__sheet .app-sheet[data-print] {
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
}