/* ══════════════════════════════════════════════════════════════════════════
   Paper forms — one look for every printable blank form.   (owner, 11 Oct 2026)
   A4 portrait unless a page says otherwise. Big boxes for handwriting, the
   same fields in the same order as the digital form, so it can be typed in
   once the Hub is back. Used by staff/paper-*.html.
   ══════════════════════════════════════════════════════════════════════════ */
.paper-tools { max-width: 900px; margin: 16px auto 10px; padding: 0 16px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-family: 'Nunito', system-ui, sans-serif; }
.paper-tools button, .paper-tools a { font: inherit; font-weight: 800; font-size: 14px; border-radius: 12px; padding: 9px 15px; cursor: pointer; border: 1.5px solid #2D5A3D; background: #2D5A3D; color: #fff; text-decoration: none; }
.paper-tools a.alt, .paper-tools button.alt { background: #fff; color: #2D5A3D; }
.paper-tools .hint { font-size: 13px; color: #5A5A52; }

.paper { max-width: 900px; margin: 0 auto 30px; padding: 0 16px; font-family: Arial, Helvetica, sans-serif; color: #111; }
.paper-sheet { background: #fff; border: 1px solid #DDD; border-radius: 10px; padding: 18px 22px; margin-bottom: 18px; }
.paper-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; border-bottom: 2px solid #111; padding-bottom: 6px; margin-bottom: 10px; }
.paper-head h1 { font-size: 20px; margin: 0; line-height: 1.2; }
.paper-head .sub { font-size: 11px; color: #444; margin-top: 2px; }
.paper-head img { height: 34px; }
.paper-note { font-size: 10.5px; color: #333; background: #F3F3F3; border-radius: 6px; padding: 5px 8px; margin: 0 0 8px; line-height: 1.4; }
.paper h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; margin: 10px 0 4px; border-bottom: 1px solid #999; padding-bottom: 2px; }

/* A labelled write-in line; .w2 .w3 make it wider in a .paper-row */
.paper-row { display: flex; gap: 10px; flex-wrap: wrap; }
.paper-f { flex: 1 1 160px; margin: 5px 0; font-size: 11.5px; }
.paper-f.w2 { flex-basis: 330px; } .paper-f.w3 { flex-basis: 100%; }
.paper-f label { display: block; font-weight: bold; font-size: 10.5px; margin-bottom: 1px; }
.paper-f .line { border-bottom: 1px solid #111; height: 20px; }
.paper-f .box { border: 1px solid #111; border-radius: 3px; }
.paper-f .box.h2 { height: 44px; } .paper-f .box.h3 { height: 66px; } .paper-f .box.h4 { height: 90px; } .paper-f .box.h6 { height: 132px; }
.paper-f .hint { font-weight: normal; color: #555; font-size: 9.5px; }

/* Tick options: ☐ Yes ☐ No */
.paper-ticks { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; margin-top: 2px; }
.paper-ticks span::before { content: '☐ '; font-size: 13px; }

/* Grids for logs (sign-in sheet, register, sleep chart, visitors) */
table.paper-grid { width: 100%; border-collapse: collapse; font-size: 10.5px; }
table.paper-grid th, table.paper-grid td { border: 1px solid #111; padding: 3px 4px; text-align: left; vertical-align: top; }
table.paper-grid th { background: #EEE; font-size: 9.5px; }
table.paper-grid td { height: 24px; }
table.paper-grid.tall td { height: 34px; }

.paper-sign { display: flex; gap: 16px; margin-top: 12px; }
.paper-sign .paper-f { flex: 1 1 0; }
.paper-foot { font-size: 9.5px; color: #555; margin-top: 8px; border-top: 1px solid #CCC; padding-top: 4px; }

@media print {
  @page { size: A4; margin: 10mm; }
  .site-header, .portal-nav, .paper-tools, .jlk-related, footer, #jlkUtilsBtn, #jlkScrollTop { display: none !important; }
  body { background: #fff !important; }
  .paper { max-width: none; padding: 0; margin: 0; }
  .paper-sheet { border: none; border-radius: 0; padding: 0; margin: 0; break-after: page; }
  .paper-sheet:last-child { break-after: auto; }
  .paper-sheet.landscape { page: landscape; }
  @page landscape { size: A4 landscape; margin: 9mm; }
}
