/* Northeast Texas Psychiatry — patient agreement forms, shared print styles.
   Rendered to Letter PDF via Chromium/puppeteer (see ../build-forms.mjs).
   Palette mirrors the website editorial brand: deep navy ink + pine green,
   serif display. Body is a clean serif for a formal, legal register that
   sits alongside the Psychiatric History Record PDF. */

:root {
  --ink: #14283a;
  --ink-soft: #3a4a5a;
  --pine: #2f6b4f;
  --pine-strong: #265741;
  --pine-tint: #eef4ee;
  --hairline: rgba(20, 40, 58, 0.16);
  --hairline-strong: rgba(20, 40, 58, 0.34);
  --accent-blue: #0b63b6;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --body: Georgia, "Times New Roman", Cambria, serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

@page { size: letter; margin: 0.65in 0.375in 0.375in; } /* tall top = punch-hole clearance */

body {
  font-family: var(--body);
  color: var(--ink);
  font-size: 11pt;
  line-height: 1.15;
}

/* On-screen preview gets a page-like frame on a gray backdrop. Both the gray
   backdrop and the frame are SCREEN-ONLY: in print/PDF the html background must
   stay unset (white), or with printBackground the gray bleeds in below any
   form whose content is shorter than the page.
   The body's WHITE is screen-only for the same family of reasons: paper is
   already white, and with printBackground that fill became an opaque rectangle
   over the whole content area -- which silently swallowed the copyright
   watermark, since a watermark is drawn UNDER the ink and there was suddenly
   something under the ink. */
@media screen {
  html { background: #c9ccce; }
  body {
    background: #fff;
    width: 8.5in;
    min-height: 11in;
    margin: 18px auto;
    padding: 0.375in;
    box-shadow: 0 2px 18px rgba(0, 0, 0, 0.25);
  }
}

@media print {
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}

/* ── Letterhead ─────────────────────────────────────────────── */
.lh {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 6px;
  border-bottom: 2.2px solid var(--pine);
}
.lh__logo { width: 40px; height: 40px; flex-shrink: 0; object-fit: contain; }
.lh__id { flex: 1; }
/* Mailing-label box (print blanks): staff affix the patient's label here, or
   write the name/DOB on the lines. Sized for a standard label (~2.6in x ~0.9in). */
.lh__label {
  flex-shrink: 0;
  width: 2.6in;
  min-height: 0.8in;
  border: 1.2px dotted var(--hairline-strong);
  border-radius: 3px;
  padding: 7px 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 13px;
}
.lh__label-row { border-bottom: 1px solid var(--hairline-strong); padding-bottom: 1px; min-height: 1.05em; }
.lh__label-key { font-family: var(--body); font-size: 9.5pt; font-weight: 700; color: var(--ink); }
.lh__name {
  font-family: var(--serif);
  font-size: 15pt;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: 0.2px;
  line-height: 1.1;
}
.lh__contact {
  font-family: var(--body);
  font-size: 7.8pt;
  line-height: 1.3;
  color: var(--ink-soft);
  margin-top: 2px;
}
.lh__contact a { color: var(--ink-soft); text-decoration: none; }

/* ── Title block ────────────────────────────────────────────── */
.title { margin: 4px 0 3px; }
.eyebrow {
  font-family: var(--body);
  font-size: 7.6pt;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--pine);
  margin-bottom: 3px;
}
.title h1 {
  font-family: var(--serif);
  font-size: 16pt;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.1;
}
/* A per-medication consent names its subject BESIDE its title rather than on a
   line of its own (physician-set 2026-07-30): one row instead of two on a sheet
   that is fighting for every line. The signed PDF draws the same pair on one
   row (sign.js buildFormPdf) and the printed blank turns the medication into a
   write-on rule, so all three renderings read the same way. */
.title--med {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}
.title--med .medline {
  font-family: var(--body);
  font-size: 11.5pt;
  font-weight: 700;
  color: var(--pine-strong);
  white-space: nowrap;
}
.title--med .medline__k {
  font-weight: 400;
  color: var(--ink-soft);
  font-size: 10pt;
}

/* ── Party / identity box ───────────────────────────────────── */
.party {
  border: 1px solid var(--hairline-strong);
  border-left: 3px solid var(--pine);
  background: #fafbfa;
  padding: 5px 10px;
  margin-bottom: 4px;
  font-size: 10pt;
  line-height: 1.4;
}
.fill {
  display: inline-block;
  min-width: 2.2in;
  border-bottom: 1px solid var(--ink);
  height: 1.05em;
  vertical-align: bottom;
}
.fill--sm { min-width: 1.35in; }
.defn { font-style: italic; color: var(--ink-soft); font-size: 9pt; margin-bottom: 3px; }

/* ── Body prose / preamble ──────────────────────────────────── */
.lead { font-style: italic; color: var(--ink-soft); font-size: 10pt; margin-bottom: 4px; }

/* ── Section headings ───────────────────────────────────────── */
h2.sec {
  font-family: var(--serif);
  font-size: 12.5pt;
  font-weight: 700;
  color: var(--ink);
  margin: 6px 0 3px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--hairline);
}
h2.sec:first-of-type { margin-top: 4px; }

/* ── Clause lists ───────────────────────────────────────────── */
ol.clauses { list-style: none; counter-reset: clause; }
ol.clauses > li {
  counter-increment: clause;
  position: relative;
  padding-left: 26px;
  margin-bottom: 1px;
}
ol.clauses > li::before {
  content: counter(clause);
  position: absolute;
  left: 0;
  top: 0.05em;
  font-family: var(--body);
  font-size: 8pt;
  font-weight: 700;
  color: #fff;
  background: var(--pine);
  width: 17px;
  height: 17px;
  border-radius: 3px;
  text-align: center;
  line-height: 17px;
}
ol.clauses strong { color: var(--pine-strong); }
.clause-note {
  display: inline-block;
  font-style: italic;
  color: var(--pine-strong);
  font-size: 8.6pt;
}

/* ── Acknowledgment band ────────────────────────────────────── */
.ack {
  margin: 7px 0;
  padding: 6px 12px;
  background: var(--pine-tint);
  border: 1px solid rgba(47, 107, 79, 0.3);
  border-radius: 4px;
  font-weight: 700;
  color: var(--pine-strong);
  font-size: 10pt;
}

/* ── Signature block ────────────────────────────────────────── */
.sig {
  margin-top: 6px;
  border-top: 1.5px solid var(--ink);
  padding-top: 5px;
  break-inside: avoid;
}
.sig__intro { font-size: 9pt; color: var(--ink-soft); margin-bottom: 4px; }
.sig__grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 6px 22px; }
/* Roomy variant (e.g. Medicare form, which has fewer signature rows): taller
   lines and more spacing so there is generous room to sign and write. */
.sig__grid--roomy { gap: 12px 22px; }
/* Patient lines get the most head space (signature + printed name); the
   office co-signature line is deliberately shorter. (Trimmed slightly
   2026-07-07 to absorb the punch-clearance top margin.) */
.sig__grid--roomy .sig__field { min-height: 2.6em; }
.sig__grid--roomy .sig__field--office { min-height: 1.6em; }
/* A signature cell that spans the full grid width (e.g. printed name once the
   date-of-birth field is dropped, since DOB is captured in the header label). */
.sig__grid > .sig__cell--full { grid-column: 1 / -1; }
.sig__field { position: relative; border-bottom: 1px solid var(--ink); padding: 0 0 2px 14px; min-height: 1.2em; }
/* Blue fill-in cue: a small arrow at the left of every line the patient (or
   signer) is meant to complete, to guide them through the paper form. It sits
   in a small left gutter so it never overlaps what they write. */
.sig__field::before {
  content: "\25B8";
  position: absolute;
  left: 0;
  bottom: 1px;
  font-size: 8.5pt;
  line-height: 1;
  color: var(--accent-blue);
}
/* Office-completed lines (e.g. physician co-signature) get no patient cue. */
.sig__field--office { padding-left: 0; }
.sig__field--office::before { content: none; }
.sig__label {
  font-size: 7.6pt;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-top: 2px;
}

/* The page footer (practice name, form version, title, page number) is added
   at print time in the margin by build-forms.mjs / the signing wizard, so it
   repeats on every page and is not part of the in-content flow. */

/* Voluntary-authorization affirmations (controlled-substance form) */
.affirm {
  margin: 7px 0 3px;
  padding: 6px 10px;
  border: 1px solid var(--hairline-strong);
  border-left: 3px solid var(--pine);
  background: #fafbfa;
}
.affirm p { font-weight: 700; color: var(--ink); margin-bottom: 3px; }
.affirm p:last-child { margin-bottom: 0; }

/* Nested sub-bullets inside a clause (e.g. Legal Proceedings billing terms) */
ol.clauses ul { list-style: disc; }
ol.clauses ul li { margin-bottom: 0; padding-left: 0; }

/* Emergency-contact entry rows (form 5). Wrap on narrow widths (the wizard at
   high zoom) so columns never run off the edge; stay a single row on the wide
   printed page. */
.ec-row { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-bottom: 10px; }
.ec-row > .ec-cell { flex: 1 1 150px; min-width: 130px; }
.ec-row > .ec-cell--name { flex: 2 1 200px; }

.audience-note {
  font-size: 8.6pt;
  color: var(--ink-soft);
  font-style: italic;
  margin-bottom: 4px;
}