/* Generated by tools/vo-css.py — do not edit by hand.
   Sheet primitives; the geometry blocks below are copied from
   henara-vo-preview/forms/*/form.css, each scoped to its own Vordruck. */

.vo-stage {
  display: flex;
  justify-content: center;
  padding: 20px 0 28px;
  overflow-x: auto;
}

.vo-page {
  position: relative;
  width: var(--vo-page-width);
  height: var(--vo-page-height);
  flex-shrink: 0;
  background: var(--vo-paper);
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(0, 0, 0, .35);
  --vo-entry: #14161d;
  --vo-surface: #ffffff;
  --vo-focus: #e7a93c;
}

.bg-tint { position: absolute; inset: 0; background: var(--vo-paper); }

.vo-chk {
  position: absolute;
  border: 1px solid var(--vo-line);
  background: var(--vo-surface);
  cursor: pointer;
  user-select: none;
  z-index: 1;
}

.vo-chk.ticked::after {
  content: '\2715';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vo-entry);
  font-weight: 700;
  font-size: 17px;
  line-height: 1;
}

.vo-in {
  position: absolute;
  border: none;
  background: transparent;
  color: var(--vo-entry);
  caret-color: var(--vo-entry);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  outline: none;
  padding: 0;
  text-align: left;
  z-index: 1;
}

input.vo-in { line-height: 1; }
textarea.vo-in { resize: none; line-height: 1.2; }

.vo-cell {
  position: absolute;
  background: transparent;
  color: var(--vo-entry);
  caret-color: var(--vo-entry);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
  border: none;
  outline: none;
  padding: 0;
  z-index: 1;
}

.vo-in:focus, .vo-cell:focus { background: #fff6df; }
.vo-chk:focus-visible, .vo-in:focus-visible, .vo-cell:focus-visible { outline: 2px solid var(--vo-focus); outline-offset: 2px; }

.vo-img { position: absolute; object-fit: fill; z-index: 2; pointer-events: none; mix-blend-mode: multiply; }

/* ---- shell tokens ------------------------------------------------ */
.vo-page {
    --font-ui: Arial, Helvetica, sans-serif;
    --font-mono: 'Courier New', Courier, monospace;

    --fs-3xs: 10px;
    --fs-2xs: 11px;
    --fs-xs: 12px;
    --fs-sm: 13px;
    --fs-md: 14px;
    --fs-base: 15px;
    --fs-lg: 16px;
    --fs-xl: 18px;
    --fs-2xl: 20px;
    --fs-3xl: 22px;
    --fs-4xl: 24px;

    --fw-normal: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    --lh-none: 1;
    --lh-tight: 1.2;
    --lh-snug: 1.3;
    --lh-normal: 1.45;
    --lh-loose: 1.5;

    --ls-snug: 0.01em;
    --ls-caps: 0.06em;

    --sp-1: 2px;
    --sp-2: 4px;
    --sp-3: 6px;
    --sp-4: 8px;
    --sp-5: 10px;
    --sp-6: 12px;
    --sp-7: 16px;
    --sp-8: 18px;
    --sp-9: 24px;
    --sp-10: 32px;
    --sp-11: 48px;

    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-xl: 16px;
    --r-pill: 999px;

    --bw: 1px;
    --bw-thick: 2px;
    --bw-stripe: 3px;

    --focus-w: 2px;
    /* A cell is a printed box a few pixels tall; the full ring would cover the
       character being typed into it. */
    --focus-w-fine: 1px;
    --focus-offset: 1px;
    --focus-inset: -2px;

    --shadow-raise: 0 1px 1px rgba(16, 20, 28, 0.05);
    --shadow-chip: 0 1px 2px rgba(2, 74, 85, 0.18);
    --shadow-card: 0 1px 2px rgba(16, 20, 28, 0.04), 0 8px 24px rgba(16, 20, 28, 0.06);
    --shadow-sheet: 0 8px 40px rgba(0, 0, 0, 0.2);
    --shadow-dialog: 0 16px 48px rgba(0, 0, 0, 0.35);
    --shadow-overlay: 0 24px 64px rgba(0, 0, 0, 0.35);
    --shadow-bottomsheet: 0 -8px 32px rgba(0, 0, 0, 0.28);
    --shadow-help: 0 10px 30px rgba(0, 0, 0, 0.22);
    --shadow-invalid: 0 0 0 2px rgba(220, 38, 38, 0.45);

    --scrim: rgba(0, 0, 0, 0.45);
    --scrim-strong: rgba(0, 0, 0, 0.55);

    --t-fast: 120ms;
    --t-base: 160ms;
    --t-slow: 200ms;
    --ease: ease-out;
    --press-shift: 1px;
    --o-disabled: 0.5;
    --dim-hover: 0.97;

    --control-h: 30px;
    --control-h-sm: 32px;
    --touch-h: 44px;
    --icon-btn: 36px;
    --icon-btn-sm: 28px;
    --bar-btn-w: 40px;
    --check-size: 20px;
    --badge-min-w: 20px;
    --thumb: 180px;
    /* As tall as a list may stand in a dialog before it scrolls itself. */
    --picklist-h: 420px;

    /* A tabular field: the row number's gutter, and the narrowest a cell may
       be before the table scrolls instead. */
    --col-num: 40px;
    --col-cell: 110px;

    /* The widths a column of prose or controls is allowed to be. */
    --measure-xs: 340px;
    --measure-sm: 420px;
    --measure-md: 520px;
    --measure: 640px;

    --z-raise-1: 1;
    --z-raise-2: 2;
    --z-raise-3: 3;
    --z-raise-4: 4;
    --z-rail: 100;
    --z-card: 200;
    --z-overlay: 1000;
    --z-backdrop: 1050;
    --z-sheet: 1100;
    --z-intro: 2000;

    /* Surfaces */
    --bg-page: #e5e7eb;
    --bg-surface: #ffffff;
    --bg-section: #f3f4f6;
    --bg-row: #f9fafb;
    --bg-input-focus: #f2f8f9;

    /* Text */
    --text: #1a1a1a;
    --text-soft: #4b5563;
    --text-muted: #6b7280;
    --text-faint: #9ca3af;
    --text-on-dark: #ffffff;
    --text-th: #374151;
    --text-control: #1e293b;

    --ok-bg: #d1fae5;
    --ok-fg: #065f46;
    --ok-border: #047857;
    --ok-accent: #10b981;

    --warn-bg: #fffbeb;
    --warn-fg: #92400e;
    --warn-border: #b45309;
    --warn-tag-bg: #fef3c7;

    --err-bg: #fef2f2;
    --err-fg: #991b1b;
    --err-border: #b91c1c;
    --err-tag-bg: #fee2e2;
    --err-strong: #dc2626;
    --err-wash: rgba(254, 226, 226, 0.65);

    --border-soft: #e5e7eb;
    --border-row: #f1f5f9;
    --border-control: #cbd5e1;

    --brand-teal: #067b83;
    --brand-teal-dark: #024a55;
    --brand-teal-tint: #eaf0f1;
    --brand-magenta: #c1348b;
    --brand-magenta-dark: #a92d7a;
    /* henara.eu's own button hover. Only 3.9:1 on white, so it may carry no
       text — the CTA hover darkens instead. */
    --brand-magenta-bright: #fc006d;

    --focus-ring: var(--brand-teal);

    /* The app's own surface, deliberately not the Vordruck's: red is left to
       mean the printed form and a genuine failure. */
    --chrome-ink: #1b1e24;
    --chrome-ink-soft: #3f4652;
    /* Dark enough for 4.5:1 on --chrome-sunken, not only on white. */
    --chrome-muted: #5b6270;
    --chrome-line: #dfe2e7;
    --chrome-line-strong: #c9cdd4;
    --chrome-hover: #f2f4f7;
    --chrome-sunken: var(--brand-teal-tint);
    --chrome-accent: var(--brand-teal);
    --chrome-accent-dark: var(--brand-teal-dark);
    --chrome-cta: var(--brand-magenta);
    --chrome-cta-hover: var(--brand-magenta-dark);
    --chrome-danger: #b42318;
    --chrome-danger-bg: #fef3f2;

    /* Wide enough for the longest action label without wrapping, and no
       wider: below the width at which the help card is dropped, the rail is
       what the Vordruck is scaled against. */
    --rail-width: 192px;
    --rail-inset: 16px;
    --rail-gap: 24px;
    --bar-height: 48px;

    --form-scale: 1;
    /* Vo.Fit overrides this so a printed line always covers a whole number of
       device pixels; at a fractional zoom it otherwise rounds up in one place
       and down in another and the rules come out uneven. */
    --vo-hairline: 1px;

    --ink1: #101418;
    --ink2: #101418;
    --ink-alpha: 1;
    --var-color: 0;
    --entry-font: var(--font-ui);
    --entry-size: 16px;
    --cell-size: 16px;
    --tick-size: 17px;
}

/* ---- m13: 707 x 1000 ------------------------------------------ */
/**
 * Muster 13 — Heilmittelverordnung: the printed sheet only.
 *
 * A number in this file is a measurement of the scan, in the same category as
 * the inline left/top/width on every printed element — not a design decision,
 * and deliberately not a token. Everything that is chrome rather than paper
 * uses the shell's tokens and controls.
 *
 * The sheet is DIN A, so the canvas is the closest whole-pixel A ratio that
 * only ever *adds* paper: 704 x 1000 was 0.44 % too narrow, and the three
 * pixels are added at the right edge, where the Vordruck prints nothing. No
 * coordinate moves.
 */

/* Exactly one form stylesheet is loaded per page, so this Vordruck's ink,
   paper and page size can simply be the document's. */
.vo-page--m13 {
    --vo-ink: rgb(189, 72, 91);
    --vo-line: rgb(189, 72, 91);
    --vo-paper: rgb(212, 230, 242);
    --vo-print-font: Arial, Helvetica, sans-serif;
    /* The shell keeps this on whole device pixels, so every printed rule and
       tick has the same weight. */
    --line-width: var(--vo-hairline);
    --vo-page-width: 707px;
    --vo-page-height: 1000px;
}

/* The front's IK row is the one place on this Vordruck where the boxes are not
   printed, so those cells draw their own. Every other cell row sits inside a
   printed box already, and a border here would double every line. */
.vo-page--m13 .vo-cell[data-field="ik"] {
    border: var(--line-width) solid var(--vo-line);
    border-top: none;
}

/* The four header tick boxes are large enough for a bigger cross. */
.vo-page--m13 .vo-chk[data-group="left"].ticked::after {
    font-size: 31px;
}

.bg-tint {
    position: absolute;
    left: 0;
    top: 0;
    width: 707px;
    height: 1000px;
    background: var(--vo-paper);
}

.box,
.cell {
    position: absolute;
    border: var(--line-width) solid var(--vo-line);
    background: var(--bg-surface);
}

.label,
.section-h,
.muster-footer {
    position: absolute;
    color: var(--vo-ink);
    font-family: var(--vo-print-font);
    line-height: 1;
}

.label {
    white-space: nowrap;
}

.section-h {
    font-weight: 700;
    white-space: nowrap;
}

.muster-footer {
    font-size: 8px;
}

/* Sits inside the four header tick boxes, which are controls and therefore
   raised — the caption has to be raised further or the box paints over it. */
.small-label {
    position: absolute;
    z-index: var(--z-raise-2);
    color: var(--vo-ink);
    font-family: var(--vo-print-font);
    font-size: 8px;
    line-height: 1.08;
    text-align: center;
    font-weight: 400;
    pointer-events: none;
}

.rule {
    position: absolute;
    background: var(--vo-ink);
    height: var(--line-width);
}

.vtick {
    position: absolute;
    background: var(--vo-ink);
    width: var(--line-width);
}

.fill {
    position: absolute;
    background: var(--bg-surface);
}

.title {
    position: absolute;
    font-family: var(--vo-print-font);
    font-weight: 700;
    color: var(--vo-ink);
    font-size: 22px;
    /* The only fractional value in the stylesheets. Rendering it as an em
       equivalent moves the glyphs, so it stays as authored — the printed
       title must not change. */
    letter-spacing: -0.3px;
    line-height: 1;
}

.ital {
    font-style: italic;
}

/**
 * The receipt table on the reverse is signed by the practice that carried out
 * each treatment, so it is the one thing on either sheet that is written
 * rather than printed: a second ink, a written face and its own noise.
 *
 * Each entry's deviation (`--js`, `--jx`, `--jy` …) is baked into its inline
 * style. The panel scales those deviations; it does not generate them, or the
 * form would look freshly rewritten on every reload.
 */
.vo-page--m13 {
    --hink1: #16276b;
    --hink2: #3b57b5;
    --hink-alpha: 1;
    --hvar-color: 45;
    --var-offset: 22;
    --hand-scale: 1;
    --var-size: 40;
    --hand-font: 'Homemade Apple', cursive;
    --hand-size: 15px;
}

body[data-handface="architect"] { --hand-font: 'Architects Daughter', cursive; --hand-size: 17px; }
body[data-handface="caveat"] { --hand-font: 'Caveat', cursive; --hand-size: 22px; }
body[data-handface="kalam"] { --hand-font: 'Kalam', cursive; --hand-size: 16px; }
body[data-handface="gloria"] { --hand-font: 'Gloria Hallelujah', cursive; --hand-size: 15px; }
body[data-handface="homemade"] { --hand-font: 'Homemade Apple', cursive; --hand-size: 15px; }
body[data-handface="cedarville"] { --hand-font: 'Cedarville Cursive', cursive; --hand-size: 19px; }

/* A name is signed in one connected stroke whichever hand fills in the rest of
   the table. Set on the entry itself, so it overrides the inherited value
   whatever the body carries. */
.vo-in.hand[data-field="leistung-unterschrift"] {
    --hand-font: 'Homemade Apple', cursive;
    --hand-size: 15px;
}

body[data-hand="on"] .vo-in.hand {
    --i1: var(--hink1);
    --i2: var(--hink2);
    --ia: var(--hink-alpha);
    --vc: var(--hvar-color);
    filter: url(#vo-penhand);
    font-family: var(--hand-font);
    /* The deviations are centred on zero, so an entry is as likely to run over
       its ruling as to sit inside it. */
    font-size: calc(var(--hand-size) * var(--hand-scale, 1) *
                    (1 + var(--js, 0) * var(--var-size) * .0055));
    transform: translate(calc(var(--jx, 0) * var(--var-offset) * .14px),
                         calc(var(--jy, 0) * var(--var-offset) * .09px));
}

body.rendering-pdf[data-hand="on"] .vo-in.hand {
    color: var(--hink1);
    -webkit-text-fill-color: var(--hink1);
    opacity: var(--hink-alpha);
}

.hint {
    color: rgba(189, 72, 91, 0.42);
}

.hint[hidden] {
    display: none;
}

.b {
    font-weight: 700;
}

.c {
    text-align: center;
}

/* The Referenz-ID sits at the foot of the Therapieziele box, positioned by an
   inline style like every other printed element. It is entered content, not
   paper, so it is set in the entry face at the entry size and follows the
   Darstellung panel like every filled value — and it overlaps the Therapieziele
   entry, so it is raised above it, masks it, and takes no pointer: a click
   there still lands in the free-text field. */
.refid {
    position: absolute;
    z-index: var(--z-raise-2);
    background: var(--bg-surface);
    color: var(--ink1);
    opacity: var(--ink-alpha);
    font-family: var(--entry-font);
    font-size: var(--entry-size);
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
}

/* ---- m56: 917 x 1297 ------------------------------------------ */
/**
 * Muster 56 — Antrag auf Kostenübernahme für Rehabilitationssport /
 * Funktionstraining: the printed sheet only.
 *
 * A number in this file is a measurement of the scan, in the same category as
 * the inline left/top/width on every printed element — not a design decision,
 * and deliberately not a token. Both sides are drawn on one canvas, 917 x 1297.
 *
 * The sheet is DIN A, so the canvas is the closest whole-pixel A ratio that
 * only ever *adds* paper: the scan's 917 x 1296 was 0.06 % too wide, and the
 * row is added at the bottom edge, below everything the Vordruck prints. No
 * coordinate moves.
 */

/* Exactly one form stylesheet is loaded per page, so this Vordruck's ink,
   paper and page size can simply be the document's. */
.vo-page--m56 {
    --vo-ink: #cb1824;
    /* Every printed line is the same red as the print itself. The scan shades
       them differently, but that is JPEG artefacts and paper, not the form:
       reading a colour per line out of it made the sheet look mottled. */
    --vo-line: #cb1824;
    --vo-paper: #f1f7ed;
    --vo-print-font: Arial, Helvetica, sans-serif;
    --rf-hint: #f6e4d9;
    --rf-salmon: #fbdbcc;
    --rf-green: #ddeace;
    /* One sheet of paper, so one canvas for both sides. The scans differ —
       the reverse was cropped 5 px into its left margin — and the reverse's
       generator shifts its geometry back onto this canvas. */
    --vo-page-width: 917px;
    --vo-page-height: 1297px;
}

/* Every cell of a date or count row sits inside a grid the form already
   draws. */
.vo-page--m56 .vo-cell {
    font-size: 18px;
}

.rf-fill,
.rf-box,
.rf-rule,
.rf-vrule,
.rf-chk,
.rf-t {
    position: absolute;
}

/* Carrying no field of their own, these are inert: a click passes through to
   whatever control is underneath. Labels do carry `data-field` and stay
   hoverable, which is what feeds the context card. */
.rf-fill,
.rf-box,
.rf-rule,
.rf-vrule {
    pointer-events: none;
}

/* A label is only a pointer to its field, never a text selection target. */
.rf-t {
    user-select: none;
}

.rf-fill {
    background: var(--bg-surface);
}

.rf-fill.salmon {
    background: var(--rf-salmon);
}

.rf-fill.green {
    background: var(--rf-green);
}

.rf-box {
    background: var(--bg-surface);
    border: var(--vo-hairline) solid var(--vo-line);
}

.rf-box.clear {
    background: transparent;
}

.rf-rule {
    height: var(--vo-hairline);
    background: var(--vo-line);
}

.rf-vrule {
    width: var(--vo-hairline);
    background: var(--vo-line);
}

/* ---- printed text ---- */

.rf-t {
    color: var(--vo-ink);
    font-family: var(--vo-print-font);
    font-size: 14px;
    line-height: 14px;
    white-space: nowrap;
}

.rf-t.s10 {
    font-size: 10px;
    line-height: 10px;
}

.rf-t.s11 {
    font-size: 11px;
    line-height: 11px;
}

.rf-t.s19 {
    font-size: 19px;
    line-height: 19px;
}

.rf-t.s22 {
    font-size: 22px;
    line-height: 22px;
}

.rf-t.s24 {
    font-size: 24px;
    line-height: 24px;
}

.rf-t.b {
    font-weight: bold;
}

.rf-t.i {
    font-style: italic;
}

/* Two lines inside a 28 px table row need their own tighter leading. */
.rf-t.tight {
    line-height: 11px;
}

/* Same for the two-line note under step 15 on the reverse. */
.rf-t.tight12 {
    line-height: 12px;
}

.rf-t.hint {
    color: var(--rf-hint);
}

.rf-t.r {
    text-align: right;
}

.rf-t.c {
    text-align: center;
}