/* Fire door inspection report: A4 pages in the Building 2286 (job 2370) style.
   Inter Display headings, Inter text, warm greys, hairlines, one blue accent. */
.report { --r-ink: #0B1A40; --r-text: #1C1C1A; --r-grey: #6D6A64; --r-grey2: #8A867E; --r-hair: #D9D6CF; --r-accent: #036DE3;
  --r-amber: #B26B00; --r-red: #B3261E; --r-green: #17784A; font-family: "Inter", -apple-system, sans-serif; color: var(--r-text);
  font-feature-settings: "tnum" 1; }
.rp { position: relative; width: 210mm; height: 297mm; margin: 0 auto 24px; background: #fff; box-shadow: 0 2px 18px rgba(0,0,0,.14); overflow: hidden; }
.rp-in { padding: 18mm 20mm 0; }
.rp-top { display: flex; justify-content: space-between; align-items: flex-end; border-bottom: .6pt solid var(--r-ink); padding-bottom: 3mm;
  font-size: 7.6pt; letter-spacing: .14em; text-transform: uppercase; color: var(--r-grey); font-weight: 500; }
.rp-foot { position: absolute; left: 20mm; right: 20mm; bottom: 11mm; display: flex; justify-content: space-between; font-size: 7pt; color: var(--r-grey2); }
.rp-foot.center { justify-content: center; }
.report h1, .report h2 { font-optical-sizing: auto; font-variation-settings: "opsz" 32; color: var(--r-ink); letter-spacing: -.02em; margin: 0; }
.report h2 { font-size: 21pt; font-weight: 600; margin: 9mm 0 2.5mm; }
.report .intro { font-size: 9.3pt; color: #55524C; line-height: 1.5; margin: 0 0 3mm; max-width: 150mm; }
.report .intro.wide { max-width: none; }
.report .grp { font-size: 7.4pt; letter-spacing: .13em; text-transform: uppercase; color: var(--r-accent); font-weight: 600; margin: 5.5mm 0 1mm; }
.report .body { font-size: 9pt; line-height: 1.55; margin: 0 0 1mm; color: #33312D; }
/* Page borders: navy line on the white pages, white line on the navy cover. */
.rp::before { content: ""; position: absolute; inset: 7mm; border: 1.2pt solid var(--r-ink); pointer-events: none; z-index: 1;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.rp.cover::before { border-color: #fff; }
.rp.cover .rp-in { padding-top: 16mm; }
/* Cover: full navy page, big centred logo, white type. */
.rp.cover { background: var(--r-ink); color: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.rp.cover .rp-top { border-bottom-color: rgba(255,255,255,.35); color: #AEB9D6; }
.cv-logo { text-align: center; margin-top: 46mm; }
.cv-logo img { height: 21mm; width: auto; display: inline-block; }
.cv-title { text-align: center; margin-top: 30mm; }
.rp.cover .cv-title h1 { font-size: 40pt; font-weight: 600; line-height: 1.02; color: #fff; }
.cv-sub { font-size: 17pt; color: #AEB9D6; margin: 4mm 0 0; letter-spacing: -.01em; }
.cv-lede { font-size: 12pt; font-weight: 500; margin: 9mm 0 0; color: #fff; text-align: center; }
.cv-lede b { display: inline-block; font-weight: 600; color: #fff; background: var(--r-accent); padding: .7mm 2.4mm .9mm; margin-right: 3mm; font-size: 10pt; letter-spacing: .04em; border-radius: 1.2mm; vertical-align: 1pt; }
.cv-practice { margin-top: 8mm; font-size: 9pt; font-weight: 700; letter-spacing: .12em; color: #FF9B93; }
.cv-meta { position: absolute; left: 20mm; right: 20mm; bottom: 24mm; display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 6mm 8mm; border-top: .6pt solid rgba(255,255,255,.35); padding-top: 4mm; font-size: 9pt; line-height: 1.5; color: #fff; }
.cv-meta .wide { grid-column: 1 / -1; }
.cv-meta label { display: block; font-size: 7pt; letter-spacing: .12em; text-transform: uppercase; color: #AEB9D6; margin-bottom: 1.2mm; font-weight: 500; }
.sign label { display: block; font-size: 7pt; letter-spacing: .12em; text-transform: uppercase; color: var(--r-grey); margin-bottom: 1.2mm; font-weight: 500; }
.draft-word { color: var(--r-red); font-weight: 600; }
.rp.cover .draft-word { color: #FF9B93; }
.rp.cover .rp-foot { color: #8C99BC; }

/* contents and rows */
.ct-row, .res-row { display: grid; grid-template-columns: 10mm 1fr auto; align-items: baseline; gap: 2mm; padding: 2.1mm 0; border-bottom: .4pt solid var(--r-hair); }
.ct-row .n, .res-row .n, .rem .n { font-size: 8.3pt; color: var(--r-grey2); }
.ct-row .t, .res-row .t { font-size: 10pt; font-weight: 500; line-height: 1.3; color: var(--r-ink); }
.ct-row .t em, .res-row .t em { display: block; font-style: normal; font-weight: 400; font-size: 8.2pt; color: var(--r-grey); margin-top: .5mm; }
.ct-row .p { font-size: 9.5pt; font-weight: 500; }
.res-row .r { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 1mm; }
.nc { font-size: 6.8pt; font-weight: 700; letter-spacing: .08em; color: var(--r-red); }
.line-row { font-size: 9pt; padding: 1.8mm 0; border-bottom: .4pt solid var(--r-hair); line-height: 1.45; }
.line-row.strong { font-weight: 500; color: var(--r-ink); }
.callout { border-left: 2.2pt solid var(--r-accent); background: #EEF4FD; padding: 3mm 4mm; font-size: 9pt; line-height: 1.5; margin: 3mm 0 2mm; color: #2A2925; }

/* outcome badges */
.ro { display: inline-block; font-size: 7.6pt; font-weight: 600; padding: 1mm 2.4mm; border-radius: 1.2mm; border: .8pt solid currentColor; white-space: nowrap; }
.ro-pass, .rt-pass { color: var(--r-green); }
.ro-adjust, .rt-adjust { color: var(--r-accent); }
.ro-repair, .rt-repair { color: var(--r-amber); }
.ro-replace, .rt-replace { color: var(--r-red); }
.rt { font-weight: 600; }

/* remedial */
.rem { display: grid; grid-template-columns: 10mm 1fr; padding: 2.2mm 0; border-bottom: .4pt solid var(--r-hair); }
.rem .t { font-size: 9.6pt; font-weight: 600; color: var(--r-ink); }
.rem ul { margin: 1mm 0 0; padding-left: 4.5mm; font-size: 8.8pt; line-height: 1.5; }
.muted-p { font-size: 8.8pt; color: var(--r-grey); margin: 1mm 0 0; }

/* basis sign-off */
.sign { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6mm; margin-top: 8mm; border-top: .6pt solid var(--r-ink); padding-top: 4mm; font-size: 9.2pt; line-height: 1.45; }
.sign span { color: var(--r-grey); font-size: 8.4pt; }

/* door page */
.dp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 6mm; margin-top: 6mm; }
.dp-t { font-size: 20pt !important; margin: 1mm 0 0 !important; line-height: 1.1; max-width: 120mm; }
.dp-head .ro { font-size: 8.6pt; padding: 1.4mm 3mm; }
.dp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 9mm; }
table.kv { width: 100%; border-collapse: collapse; font-size: 8.8pt; }
table.kv th, table.kv td { text-align: left; padding: 1.7mm 0; border-bottom: .4pt solid var(--r-hair); vertical-align: top; }
table.kv th { font-weight: 400; color: var(--r-grey); width: 46%; padding-right: 3mm; }
table.kv td { font-weight: 500; color: var(--r-ink); }
.report .bad { color: var(--r-red) !important; }

/* photos */
.pgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5mm 4mm; margin-top: 4mm; }
.pgrid figure { margin: 0; }
.pgrid img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; background: #EEE; }
.pgrid figcaption { font-size: 6.8pt; letter-spacing: .12em; text-transform: uppercase; color: var(--r-grey); margin-top: 1.6mm; }
.nophotos { margin-top: 8mm; padding: 14mm; border: .6pt dashed var(--r-hair); text-align: center; color: var(--r-grey); font-size: 9pt; }

/* Shrink the A4 pages to fit the screen: iPad portrait, small tablets, iPhone. */
@media screen and (max-width: 860px) { .report { zoom: .88; } }
@media screen and (max-width: 740px) { .report { zoom: .6; } }
@media screen and (max-width: 520px) { .report { zoom: .46; } }
@media screen and (max-width: 420px) { .report { zoom: .41; } }
@media screen and (max-width: 360px) { .report { zoom: .36; } }
@media print {
  .rp { margin: 0; box-shadow: none; break-after: page; }
  .report { zoom: 1 !important; }
}
.callout.stop { border-left-color: var(--r-red); background: #FBECEA; }
table.kv td.hd { font-size: 7pt; letter-spacing: .1em; text-transform: uppercase; color: var(--r-grey); font-weight: 500; }
table.kv .sm { font-size: 7.8pt; color: var(--r-grey); font-weight: 400; }
.dp-cols table.kv tr:has(td.hd) th, .dp-cols table.kv tr:has(td.hd) td { border-bottom: 0; padding-bottom: 0; }
.dp-cols table.kv th, .dp-cols table.kv td { padding: 1.35mm 0; }
.dp-cols .line-row { padding: 1.4mm 0; }
.dp-cols.dbl { grid-template-columns: 1.15fr 1fr; gap: 7mm; }
.dp-cols.dbl table.kv th { width: 34%; }
table.kv.gaps td { text-align: left; }
.layout { display: flex; gap: 6mm; align-items: flex-end; margin: 2mm 0 1mm; flex-wrap: wrap; }
.layout figure { margin: 0; width: 26mm; }
.layout figure.w { width: 48mm; }
.layout svg { width: 100%; height: auto; display: block; }
.layout figcaption { font-size: 6.8pt; letter-spacing: .06em; text-transform: uppercase; color: var(--r-grey); margin-top: 1.5mm; line-height: 1.3; }
table.kv.gaps th { width: 30%; white-space: nowrap; padding-right: 4mm; }
.dp-cols.dbl table.kv { font-size: 8.3pt; }
.dp-cols.dbl table.kv th, .dp-cols.dbl table.kv td { padding: 1.1mm 0; }
.dp-cols.dbl .line-row { font-size: 8.5pt; padding: 1.2mm 0; }

/* ---------- handover pack ---------- */
.pack .f-scheme-sm { margin-top: 7mm; font-size: 7.4pt; letter-spacing: .14em; color: var(--r-accent); font-weight: 600; }
.pack table.f2 { width: 100%; border-collapse: collapse; margin: 3mm 0 4mm; font-size: 8.4pt; }
.pack table.f2 th, .pack table.f2 td { border: .5pt solid #B9BDC7; padding: 1.6mm 2mm; text-align: left; vertical-align: top; }
.pack table.f2 th { background: #F1F3F7; font-weight: 600; color: var(--r-ink); width: 24%; }
.pack table.f2 thead th { width: auto; font-size: 7.4pt; }
.pack table.f2 td.area { font-weight: 600; width: 18%; }
.pack table.f2.ria { font-size: 7.2pt; }
.pack table.f2.ria th, .pack table.f2.ria td { padding: 1.3mm 1.4mm; }
.pack table.f2 .decl { font-size: 7.8pt; line-height: 1.45; }
.pack .sm { font-size: 7.6pt; color: var(--r-grey); }
.pack .f-note { font-size: 7.6pt; color: var(--r-grey); }
.pack table.sched { width: 100%; border-collapse: collapse; margin: 3mm 0 4mm; font-size: 8pt; }
.pack table.sched th { text-align: left; font-size: 6.8pt; letter-spacing: .1em; text-transform: uppercase; color: var(--r-grey); font-weight: 500; padding: 1.5mm 1.5mm 1.5mm 0; border-bottom: .6pt solid var(--r-ink); }
.pack table.sched td { padding: 2mm 1.5mm 2mm 0; border-bottom: .4pt solid var(--r-hair); vertical-align: top; }
.pack .st { display: inline-block; font-size: 7pt; font-weight: 600; padding: .6mm 2mm; border-radius: 1mm; border: .7pt solid currentColor; white-space: nowrap; }
.pack .st.ok { color: var(--r-green); } .pack .st.out { color: var(--r-amber); }
.pack .pg-of { font-size: 11pt; color: var(--r-grey2); font-weight: 400; }
.pack .doc-h { display: flex; justify-content: space-between; gap: 6mm; margin: 5mm 0 3mm; font-size: 7.6pt; color: var(--r-grey); letter-spacing: .04em; }
.pack .doc-h span:first-child { color: var(--r-ink); font-weight: 600; }
.pack .docpage { height: 238mm; display: flex; align-items: flex-start; justify-content: center; }
.pack .docpage img { max-width: 100%; max-height: 100%; object-fit: contain; border: .5pt solid var(--r-hair); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.pack .demodoc { margin: 6mm auto 0; width: 150mm; min-height: 200mm; border: .8pt dashed #9AA4BD; border-radius: 2mm; padding: 14mm 14mm; background: #FAFBFD; }
.pack .demodoc h3 { font-size: 16pt; color: var(--r-ink); margin: 4mm 0 2mm; }
.pack .demodoc p { font-size: 9.5pt; color: #55524C; line-height: 1.5; }
.pack .dd-flag { display: inline-block; font-size: 7.4pt; font-weight: 700; letter-spacing: .12em; color: #B3261E; border: .8pt solid currentColor; padding: 1mm 2.4mm; border-radius: 1mm; }
.pack .dd-lines i { display: block; height: 2.4mm; margin: 4.5mm 0; background: #E3E7EF; border-radius: 1mm; }
.pack .dd-lines i:nth-child(3n) { width: 70%; } .pack .dd-lines i:nth-child(4n) { width: 85%; }
.pack .dd-foot { margin-top: 10mm; font-style: italic; }
.pk-draft { position: absolute; top: 9mm; left: 50%; transform: translateX(-50%); z-index: 2; font-size: 7pt; font-weight: 700; letter-spacing: .14em; color: #B3261E; background: #fff; border: .7pt solid #B3261E; padding: .6mm 3mm; border-radius: 1mm; white-space: nowrap; }
.rp.cover .pk-draft { background: transparent; color: #FF9B93; border-color: #FF9B93; }
.cv-meta.pk { grid-template-columns: 1fr 1fr 1.2fr; }
.cv-meta .pk-cert { display: flex; justify-content: space-between; align-items: center; gap: 8mm; }
.cv-meta .qmark { height: 18mm; width: auto; background: #fff; padding: 0; border-radius: 1mm; flex: none; }
