/* ===============================================================
   CLIENT REPORT STYLES
   ---------------------------------------------------------------
   Screen rules first, print rules at the bottom under @media print.
   The report is the only thing that prints. Everything else in the
   application is hidden by the print rules.
   =============================================================== */

/* ===============================================================
   REPORT SHELL  (screen)
   =============================================================== */
/* While the report preview is open the application chrome steps aside */
body.report-mode .topbar { display: none; }

.report-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--pine-deep);
  color: #E7EFE9;
  border-bottom: 3px solid var(--brass);
}
.report-toolbar-inner {
  max-width: 8.5in;
  margin: 0 auto;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.report-toolbar .label {
  font-family: var(--mono);
  font-size: .66rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9FB6AA;
  margin-right: auto;
}

.report {
  background: #FFFFFF;
  color: #2B3634;
  max-width: 8.5in;
  margin: 26px auto 60px;
  padding: 0.75in 0.8in;
  box-shadow: 0 4px 30px rgba(22, 33, 31, .14);
  font-family: var(--body);
  font-size: 10.5pt;
  line-height: 1.55;
}
.report h1, .report h2, .report h3 { font-family: var(--display); color: var(--ink); }

/* ---------- Cover ---------- */
.rpt-cover { min-height: 8.2in; display: flex; flex-direction: column; }
.rpt-cover-rule { height: 4px; background: var(--pine); position: relative; margin-bottom: 46px; }
.rpt-cover-rule::after {
  content: ""; position: absolute; right: 0; top: 0; bottom: 0;
  width: 22%; background: var(--brass);
}
.rpt-cover-eyebrow {
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--brass);
  margin-bottom: 18px;
}
.rpt-cover-title {
  font-family: var(--display);
  font-size: 30pt;
  line-height: 1.08;
  color: var(--ink);
  font-weight: 500;
  margin: 0 0 10px;
}
.rpt-cover-business {
  font-family: var(--display);
  font-size: 17pt;
  color: var(--pine);
  margin: 0;
}
.rpt-cover-spacer { flex: 1; min-height: 1.2in; }
.rpt-cover-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; border-top: 1px solid var(--line); padding-top: 22px; }
.rpt-meta-label {
  font-family: var(--mono);
  font-size: .64rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 6px;
}
.rpt-meta-value { color: var(--ink); font-size: 11pt; }
.rpt-meta-value .role { color: var(--ink-3); font-size: 9.5pt; }

/* ---------- Sections ---------- */
.rpt-section { margin-top: 34px; }
.rpt-section-head {
  border-bottom: 2px solid var(--ink);
  padding-bottom: 7px;
  margin-bottom: 18px;
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.rpt-section-head h2 { font-size: 15pt; margin: 0; }
.rpt-section-head .num { font-family: var(--mono); font-size: .7rem; color: var(--brass); letter-spacing: .12em; }
.rpt-lead { font-size: 10.5pt; color: var(--ink-2); }

/* ---------- Executive summary score block ---------- */
.rpt-score-block {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 30px;
  align-items: center;
  border: 1px solid var(--line);
  border-left: 4px solid var(--pine);
  border-radius: 4px;
  padding: 22px 26px;
  background: #FBFCFA;
  margin-bottom: 20px;
}
.rpt-score-figure { text-align: center; }
.rpt-score-figure .num {
  font-family: var(--display);
  font-size: 46pt;
  line-height: .9;
  color: var(--ink);
  font-weight: 500;
}
.rpt-score-figure .num sup { font-size: 15pt; color: var(--ink-3); top: -1.5em; }
.rpt-score-figure .cap {
  font-family: var(--mono);
  font-size: .6rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-top: 8px;
}
.rpt-score-rating { font-family: var(--display); font-size: 16pt; color: var(--ink); margin-bottom: 6px; }
.rpt-score-blurb { font-size: 10pt; color: var(--ink-2); margin: 0; }

/* ---------- Snapshot datum chart ---------- */
.rpt-datum-row {
  display: grid;
  grid-template-columns: 1fr 2.6in 3.2rem;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.rpt-datum-row:last-child { border-bottom: none; }
.rpt-datum-name { font-size: 10.5pt; color: var(--ink); }
.rpt-datum-name .rating-word { display: block; font-size: 8.5pt; color: var(--ink-3); }
.rpt-datum-track { height: 9px; background: #F1F3EF; border: 1px solid var(--line); border-radius: 2px; overflow: hidden; }
.rpt-datum-track span { display: block; height: 100%; background: var(--pine); }
.rpt-datum-pct { font-family: var(--mono); font-size: 11pt; color: var(--ink); text-align: right; }

/* ---------- Strengths ---------- */
.rpt-strength-list { list-style: none; margin: 0; padding: 0; }
.rpt-strength-list li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 7px;
  font-size: 10.5pt;
  color: var(--ink-2);
}
.rpt-strength-list li::before {
  content: "";
  position: absolute;
  left: 2px; top: .55em;
  width: 9px; height: 9px;
  border: 1.5px solid var(--pine);
  border-radius: 50%;
  background: var(--pine-soft);
}

/* ---------- Priority findings ---------- */
.rpt-finding {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  align-items: baseline;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}
.rpt-finding:last-child { border-bottom: none; }
.rpt-finding-text { color: var(--ink); font-size: 10.5pt; }
.rpt-finding-area { display: block; font-family: var(--mono); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-top: 3px; }
.rpt-chip {
  font-family: var(--mono);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 100px;
  border: 1px solid var(--line-strong);
  color: var(--ink-3);
  white-space: nowrap;
}
.rpt-chip.chip-none { border-color: #DFC7C2; background: #FAF2F0; color: var(--rate-attention); }
.rpt-chip.chip-progress { border-color: #E5D4B4; background: var(--brass-soft); color: #7A5F30; }

/* ---------- Action plan ---------- */
.rpt-action-group { margin-bottom: 22px; }
.rpt-action-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  background: var(--pine);
  color: #FFFFFF;
  padding: 7px 14px;
  border-radius: 3px;
}
.rpt-action-head .kicker { font-family: var(--mono); font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; color: #B9D2C6; }
.rpt-action-head h3 { color: #FFFFFF; font-size: 12pt; margin: 0; }
.rpt-action-group.tier-next .rpt-action-head { background: var(--brass); }
.rpt-action-group.tier-next .rpt-action-head .kicker { color: #F6EEE1; }
.rpt-action-group.tier-later .rpt-action-head { background: #6C7A76; }
.rpt-action-group.tier-later .rpt-action-head .kicker { color: #D6DEDB; }

.rpt-action-item {
  display: grid;
  grid-template-columns: 1.8rem 1fr;
  gap: 8px;
  padding: 10px 0 10px 14px;
  border-bottom: 1px solid var(--line);
  font-size: 10.5pt;
  color: var(--ink-2);
}
.rpt-action-item:last-child { border-bottom: none; }
.rpt-action-item .n { font-family: var(--mono); font-size: .78rem; color: var(--brass); padding-top: 1px; }

/* ---------- Services ---------- */
.rpt-service {
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}
.rpt-service:last-child { border-bottom: none; }
.rpt-service-name { color: var(--ink); font-weight: 600; font-size: 10.5pt; }
.rpt-service-blurb { color: var(--ink-2); font-size: 9.8pt; margin: 2px 0 0; }
.rpt-service-kind {
  font-family: var(--mono);
  font-size: .58rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--brass);
  margin-left: 8px;
}

/* ---------- Closing ---------- */
.rpt-closing { font-size: 10.5pt; color: var(--ink-2); }
.rpt-signature { margin-top: 26px; border-top: 1px solid var(--line); padding-top: 16px; }
.rpt-signature .name { font-family: var(--display); font-size: 12pt; color: var(--ink); }
.rpt-signature .role, .rpt-signature .firm { font-size: 9.5pt; color: var(--ink-3); }

.rpt-footnote {
  margin-top: 30px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 8.5pt;
  color: var(--ink-3);
}

/* Running footer, only visible when printing */
.rpt-print-footer { display: none; }

/* ===============================================================
   PRINT  /  PDF
   Letter size, professional margins, no interface controls.
   =============================================================== */
@page {
  size: letter portrait;
  margin: 0.7in 0.75in 0.9in;
}

@media print {

  html, body { background: #FFFFFF !important; }

  /* Nothing from the application interface prints */
  .topbar,
  .app-shell,
  .report-toolbar,
  .no-print,
  .toast,
  .modal-backdrop { display: none !important; }

  .report {
    max-width: none;
    width: auto;
    margin: 0;
    padding: 0;
    box-shadow: none;
    font-size: 10.5pt;
  }

  /* Page structure */
  .rpt-cover { min-height: 8.6in; break-after: page; page-break-after: always; }
  .rpt-section { margin-top: 26px; }
  .rpt-page-break { break-before: page; page-break-before: always; }

  /* Nothing gets cut in half and no heading is stranded */
  h1, h2, h3, .rpt-section-head, .rpt-action-head { break-after: avoid; page-break-after: avoid; }
  .rpt-section-head + *, .rpt-action-head + * { break-before: avoid; page-break-before: avoid; }
  .rpt-score-block,
  .rpt-datum-row,
  .rpt-finding,
  .rpt-action-item,
  .rpt-service,
  .rpt-strength-list li,
  .rpt-signature { break-inside: avoid; page-break-inside: avoid; }
  p { orphans: 3; widows: 3; }

  /* Repeating brand line at the bottom of every printed page */
  .rpt-print-footer {
    display: flex;
    justify-content: space-between;
    position: fixed;
    bottom: -0.5in;
    left: 0;
    right: 0;
    font-family: var(--mono);
    font-size: 7pt;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #97A19E;
    border-top: 1px solid #E2E6E1;
    padding-top: 5px;
  }

  /* Keep the printed colors true */
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}