/* The Pathway report on the HR and admin consoles (public/js/report.js).
   Built on console.css: numbers and lists on the page, hairlines, soft gray,
   and the square plum bar as the only data mark. "Print this report" adds
   .print-report to the body, and the print rules below print it alone. */

.rp-who { font-size: 13.5px; color: var(--ink-3); margin-top: 6px; }
.rp-none { font-size: 13.5px; color: var(--ink-2); padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); max-width: 80ch; }
.rp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Everyone: one line per step, its bar out of everyone invited. */
.rp-steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.rp-step {
  display: grid; grid-template-columns: minmax(120px, 180px) minmax(120px, 1fr) 56px minmax(150px, 230px);
  align-items: center; gap: 8px 20px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13.5px;
}
.rp-step-label { font-weight: 500; color: var(--ink); }
.rp-step .bar { height: 10px; }
.rp-step-n { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.rp-step-days { font-size: 12.5px; color: var(--ink-3); }

/* By group: a count, and under it the median days from the step before. */
.rp-table { min-width: 900px; }
.rp-table th[scope="row"] { font-weight: 600; text-align: left; color: var(--ink); background: transparent; border-bottom: 1px solid var(--line); padding: 14px 14px 14px 0; font-size: 13.5px; white-space: nowrap; }
.rp-table tr.everyone th[scope="row"] { background: var(--soft-2); }
table.data.rp-table td, table.data.rp-table th[scope="row"], table.data.rp-trend td, table.data.rp-trend th[scope="row"] { vertical-align: top; }
.rp-table td:nth-child(2) { white-space: nowrap; }
.rp-n { display: block; font-weight: 600; }
.rp-d { display: block; font-size: 12px; color: var(--ink-3); font-weight: 400; margin-top: 2px; white-space: nowrap; }

/* Week by week: one small column per week, the numbers in the table beside. */
.rp-trend th[scope="row"] { font-weight: 500; text-align: left; color: var(--ink); background: transparent; border-bottom: 1px solid var(--line); padding: 12px 14px 12px 0; font-size: 13.5px; white-space: nowrap; }
.rp-strip-cell { width: 140px; }
.rp-strip { display: flex; align-items: flex-end; gap: 2px; height: 26px; width: 120px; }
.rp-strip span { flex: 1 1 0; min-width: 4px; background: var(--primary-500); }
.rp-strip span.none, .rp-strip span.zero { height: 2px; background: var(--line-2); }

.rp-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); max-width: 88ch; }
.rp-list li { font-size: 13.5px; line-height: 1.55; color: var(--ink-2); padding: 11px 0; border-bottom: 1px solid var(--line); }
.rp-notes { list-style: none; margin-top: 32px; padding: 0; font-size: 12.5px; color: var(--ink-3); max-width: 80ch; line-height: 1.5; }
.rp-notes li + li { margin-top: 4px; }

@media (max-width: 720px) {
  .rp-step { grid-template-columns: 1fr 48px; }
  .rp-step .bar { grid-column: 1 / -1; grid-row: 2; }
  .rp-step-days { grid-column: 1 / -1; }
}

@media print {
  body.print-report .sidebar, body.print-report .top-header, body.print-report .toast,
  body.print-report .dashboard > :not(#sec-report), body.print-report .rp-screen { display: none !important; }
  body.print-report .app-container, body.print-report .main-content { display: block; margin: 0; min-height: 0; }
  body.print-report .dashboard { padding: 0; max-width: none; }
  body.print-report .rp .sec-head h2::before, body.print-report .rp .bar > span, body.print-report .rp .bar,
  body.print-report .rp-strip span, body.print-report .rp tr.everyone td, body.print-report .rp tr.everyone th {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  body.print-report .rp table.data { min-width: 0; font-size: 9.5pt; }
  body.print-report .rp table.data tbody tr:hover { background: transparent; }
  body.print-report .rp .table-wrap { overflow: visible; }
  body.print-report .rp tr, body.print-report .rp-step, body.print-report .rp .sec-head { break-inside: avoid; }
  body.print-report .rp table.data td, body.print-report .rp table.data th { padding: 6px 6px; }
}