/* ==========================================================================
   print.css — Pro Se Step Navigator
   Renders a clean, professional printed checklist.
   ========================================================================== */

@media print {
  /* ---------- Page setup ---------- */
  @page {
    margin: 1.5cm 2cm;
    size: letter portrait;
  }

  /* ---------- Base reset ---------- */
  *,
  *::before,
  *::after { box-sizing: border-box; }

  html, body {
    background: #fff !important;
    color: #000 !important;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 10pt;
    line-height: 1.5;
  }

  a { color: #000 !important; text-decoration: underline; word-break: break-word; }

  /* ---------- Hide non-print elements ---------- */
  .top-bar,
  .site-footer,
  .skip-link,
  .toast-host,
  .btn-save-fav,
  .steps-toolbar,
  .step-actions-row,
  .step-note-wrap,
  .step-deadline-wrap,
  .wizard-nav,
  .panel-section,   /* help directory & mistakes panels */
  .modal-backdrop,
  .back-to-home,
  #btn-mark-all,
  #btn-clear-steps,
  #btn-clear-deadlines,
  #btn-print,
  .generic-warning,
  [id="back-to-home"],
  .fav-list { display: none !important; }

  /* ---------- Print header ---------- */
  .print-header {
    display: block !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14pt;
    font-weight: bold;
    border-bottom: 2pt solid #000;
    padding-bottom: 4pt;
    margin-bottom: 8pt;
  }

  /* ---------- Page header (court + action title) ---------- */
  .page-header {
    margin-bottom: 8pt;
    border-bottom: 0.5pt solid #ccc;
    padding-bottom: 6pt;
  }

  .page-header h1 {
    font-size: 13pt;
    margin: 0 0 2pt;
  }

  .steps-subtitle {
    font-size: 9pt;
    color: #555;
    margin: 0;
  }

  /* ---------- Disclaimer ---------- */
  .disclaimer-banner {
    display: block !important;
    border: 1pt solid #000;
    padding: 4pt 6pt;
    margin-bottom: 8pt;
    font-size: 8pt;
    font-style: italic;
    background: #fff !important;
    color: #000 !important;
  }

  /* ---------- Progress wrap — hide the visual bar, keep the text ---------- */
  .progress-wrap { margin-bottom: 8pt; }
  .progress-track { display: none !important; }
  #step-progress-fill { display: none !important; }
  .progress-header {
    font-size: 9pt;
    color: #555;
    display: flex;
    justify-content: space-between;
  }

  /* ---------- Steps list ---------- */
  .steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .step-item {
    display: flex;
    gap: 8pt;
    margin-bottom: 10pt;
    padding-bottom: 10pt;
    border-bottom: 0.5pt solid #ddd;
    page-break-inside: avoid;
    align-items: flex-start;
  }

  .step-item:last-child { border-bottom: none; }

  /* Checkbox square drawn with CSS */
  .step-item::before {
    content: '';
    flex-shrink: 0;
    width: 13pt;
    height: 13pt;
    border: 1.5pt solid #000;
    border-radius: 2pt;
    margin-top: 1pt;
    background: #fff;
    display: block;
  }

  /* Check mark for completed steps */
  .step-item.completed::before {
    content: '✓';
    font-size: 9pt;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
  }

  /* Overdue step — draw a small "!" marker */
  .step-item.deadline-overdue::before {
    border-color: #c0392b;
  }

  .step-number {
    flex-shrink: 0;
    width: 16pt;
    height: 16pt;
    background: #000;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 7pt;
    font-weight: bold;
    font-family: Arial, sans-serif;
  }

  .step-body { flex: 1; min-width: 0; }

  .step-text {
    font-size: 10pt;
    margin: 0 0 3pt;
    color: #000;
  }

  .step-source {
    display: block;
    font-size: 8pt;
    color: #444;
    margin-top: 2pt;
  }

  /* Print the href after source links */
  .step-source::after {
    content: ' (' attr(href) ')';
    font-size: 7.5pt;
    color: #666;
  }

  /* Deadline badge — keep visible on print */
  .deadline-badge {
    display: inline-block !important;
    font-size: 7.5pt;
    border: 0.5pt solid #666;
    padding: 0 3pt;
    border-radius: 2pt;
    color: #555;
    margin-bottom: 2pt;
  }

  .deadline-badge--overdue {
    border-color: #c0392b;
    color: #c0392b;
    font-weight: bold;
  }

  /* Hide step actions that don't print well */
  .step-actions-row,
  .step-note-wrap,
  .step-deadline-wrap { display: none !important; }

  /* ---------- Footer disclaimer (always prints) ---------- */
  .footer-disclaimer {
    display: block !important;
    font-size: 7.5pt;
    color: #555;
    margin-top: 12pt;
    padding-top: 6pt;
    border-top: 0.5pt solid #ccc;
    font-style: italic;
  }

  /* ---------- Page numbers ---------- */
  @page { @bottom-right { content: counter(page) " of " counter(pages); font-size: 8pt; } }
}