/* One letter stylesheet for the browser preview AND the PDF (WeasyPrint): what you see is what is printed. */

.letter { font-family: "Source Sans 3", "Segoe UI", Arial, sans-serif; color: #050914; font-size: 10.5pt; line-height: 1.5; }
.letter p { margin: 0 0 .75em; }
.letter ul { margin: 0 0 .75em; padding-left: 1.2em; }
.letter li { margin: 0 0 .2em; }
.letter__head { display: flex; justify-content: space-between; align-items: flex-start; height: 30mm; }
.letter__wordmark { display: flex; gap: 3mm; align-items: flex-start; }
.letter__bar { width: 2.2mm; height: 15mm; background: #42145f; }
.letter__org { font-weight: 700; color: #42145f; font-size: 12.5pt; line-height: 1.15; }
.letter__org small { display: block; white-space: nowrap; font-weight: 400; color: #475569; font-size: 8.5pt; margin-top: 1mm; }
.letter__demo { font-size: 7.5pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #5c4207; background: #fee9b7; padding: 1mm 2.2mm; border-radius: 1mm; }
.letter__address-row { display: flex; justify-content: space-between; gap: 10mm; margin-bottom: 12mm; }
.letter__address { width: 85mm; }
.letter__return { font-size: 7.5pt; color: #64748b; border-bottom: .3mm solid #cbd5e1; padding-bottom: 1mm; margin-bottom: 2.5mm; }
.letter__recipient { font-size: 10.5pt; line-height: 1.4; }
.letter__meta { width: 62mm; font-size: 8.5pt; line-height: 1.35; }
.letter__meta dt { color: #64748b; font-weight: 600; margin: 0; }
.letter__meta dd { margin: 0 0 1.8mm; color: #050914; }
.letter__subject { font-weight: 700; font-size: 11pt; margin: 0 0 6mm; color: #050914; }
.letter__subject span { color: #64748b; font-weight: 400; }
.letter__block { position: relative; }
.letter__table { border-collapse: collapse; width: 100%; margin: 0 0 .9em; font-size: 10pt; }
.letter__table td { padding: 1.3mm 0; border-bottom: .3mm solid #e2e8f0; }
.letter__table td:last-child { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.letter__table tr:last-child td { font-weight: 700; border-bottom: .5mm solid #42145f; }
.letter__foot { margin-top: 10mm; padding-top: 2.5mm; border-top: .3mm solid #e2e8f0; font-size: 7.5pt; color: #64748b; display: flex; justify-content: space-between; }

/* ---- browser preview only ---- */
.paper { width: 794px; max-width: 100%; min-height: 1123px; margin: 0 auto; background: #fff; box-shadow: 0 1px 2px rgba(16,23,41,.06), 0 8px 28px rgba(16,23,41,.08); padding: 64px 70px 56px 96px; border-radius: 2px; position: relative; }
.paper .letter__block { border-radius: 4px; transition: background .2s, box-shadow .2s; margin: 0 -10px; padding: 2px 10px; }
.paper .letter__block:hover { background: #f8fafc; }
.paper .letter__block.is-editable:hover { box-shadow: inset 0 0 0 1px #e2e8f0; cursor: text; }
.paper .letter__block.is-locked:hover { background: transparent; }
.paper .block-tag { position: absolute; left: -88px; top: 5px; width: 74px; max-height: 4em; overflow: hidden; text-align: right; font-size: 9.5px; font-weight: 600; color: #94a3b8; line-height: 1.25; opacity: 0; transition: opacity .15s; font-family: "Source Sans 3", sans-serif; }
.paper .letter__block:hover .block-tag, .paper .letter__block.is-live .block-tag, .paper .letter__block.has-change .block-tag { opacity: 1; }
.paper .block-tag svg { width: 11px; height: 11px; display: inline-block; vertical-align: -1px; }
.paper .letter__block.is-locked .block-tag { color: #996d0b; }
.paper .letter__block.is-live { background: #f3eff5; box-shadow: inset 3px 0 0 #42145f; }
.paper .letter__block.is-live .block-tag { color: #42145f; }
.paper .letter__block.is-live .live-text::after { content: "▍"; color: #42145f; animation: caret 1s steps(1) infinite; margin-left: 1px; }
.paper .letter__block.has-change { box-shadow: inset 3px 0 0 #39870c; }
.paper .letter__block.is-omitted { display: none; }
.paper .letter__block.is-reverted { box-shadow: inset 3px 0 0 #e17000; background: #fbead9; }
.paper del { background: #f9dfdd; color: #a02016; text-decoration-color: #d52b1e; }
.paper ins { background: #e1edda; color: #1a3d05; text-decoration: none; border-bottom: 1.5px solid #39870c; }
.paper .tc { cursor: help; }
.paper .tc-insert { background: #e1edda; border-left: 3px solid #39870c; padding: 4px 8px; margin: 0 -8px; border-radius: 2px; }
.paper .veld { background: #f3eff5; border-bottom: 1.5px dotted #a995b7; border-radius: 2px; padding: 0 1px; cursor: help; }
.paper .veld.is-hot { background: #c6b8ce; }
.paper.no-marks .veld { background: none; border: 0; padding: 0; }
.paper .stamp { position: absolute; top: 112px; right: 74px; transform: rotate(-8deg); border: 3px solid #39870c; color: #39870c; font-weight: 800; font-size: 15px; letter-spacing: .1em; padding: 6px 12px; border-radius: 6px; text-transform: uppercase; opacity: .85; font-family: "Source Sans 3", sans-serif; }
.paper .stamp small { display: block; font-size: 9px; letter-spacing: .02em; font-weight: 600; text-transform: none; }
.block-editor { width: 100%; font: inherit; font-size: 10.5pt; line-height: 1.5; border: 1px solid #42145f; border-radius: 4px; padding: 6px 8px; min-height: 120px; resize: vertical; box-shadow: 0 0 0 3px #e3dce7; }
.block-editor-actions { display: flex; gap: 6px; margin: 6px 0 10px; }
.paper .tc-rewrite { background: #f4f9f1; box-shadow: inset 3px 0 0 #39870c; padding: 8px 10px 2px; margin: 0 -10px; border-radius: 2px; position: relative; }
.paper .tc-rewrite__tag { position: absolute; right: 8px; top: -9px; font-size: 9px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; background: #39870c; color: #fff; padding: 1px 6px; border-radius: 3px; font-family: "Source Sans 3", sans-serif; }
.paper .tc-old { margin: 4px 0 10px; font-size: 9.5pt; color: #64748b; }
.paper .tc-old summary { cursor: pointer; font-size: 8.5pt; font-weight: 600; color: #a02016; list-style: none; }
.paper .tc-old summary::before { content: "▸ "; }
.paper .tc-old[open] summary::before { content: "▾ "; }
.paper .tc-old p, .paper .tc-old li { text-decoration: line-through; text-decoration-color: #d52b1e88; }