/* Reports: builder form, the report document, and printing it as a clean PDF. */
.reports-page { display: flex; flex-direction: column; gap: 16px; }
.report-form { padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.report-form .btn-group { flex-wrap: wrap; }
.report-fields { display: flex; gap: 10px; flex-wrap: wrap; }
.report-fields .field { min-width: 150px; }
.report-fields .field.grow { flex: 1 1 200px; }
.report-form textarea { resize: vertical; }
.report-result { display: flex; flex-direction: column; gap: 10px; }
.report-actions { gap: 8px; }
.report-doc { padding: 28px 32px; }
.report-doc h1 { font-size: 24px; line-height: 1.25; margin: 0 0 4px; color: var(--accent-text); }
.report-sub { color: var(--text-2); font-size: 13px; margin: 0 0 12px; }
.report-stats { gap: 6px; margin-bottom: 18px; }
.report-doc .md h2 { font-size: 18px; color: var(--accent-text); }
.report-doc .md h3 { font-size: 15px; }
@media (max-width: 640px) {
  .report-doc { padding: 18px 16px; }
}

#print-root { display: none; }
@media print {
  body.print-report > :not(#print-root) { display: none !important; }
  body.print-report #print-root { display: block; }
  body.print-report { background: #fff; }
  #print-root .report-doc { border: 0; box-shadow: none; padding: 0; color: #1b1c21; background: #fff; }
  #print-root .report-doc h1, #print-root .md h2 { color: #3441b8; }
  #print-root .report-sub, #print-root .chip { color: #585b66; }
  #print-root .chip { border: 1px solid #d0d0d6; background: #fff; }
  #print-root .md h2, #print-root .md h3 { break-after: avoid; }
  #print-root .md li, #print-root .md tr { break-inside: avoid; }
  #print-root .md a { color: inherit; }
  @page { margin: 18mm 16mm; }
}