/**
 * Flight Sim Checklist - Print Styles
 *
 * Optimized for printing checklists on paper:
 * - High contrast black and white
 * - Hidden interactive elements
 * - Proper page breaks
 * - Checkbox squares for manual checking
 */

@media print {
  /* ===========================================
     Reset for Print
     =========================================== */
  * {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  body {
    font-family: 'B612', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    font-size: 10pt;
    line-height: 1.4;
    margin: 0;
    padding: 0;
  }

  /* ===========================================
     Hide Interactive Elements
     =========================================== */
  .btn,
  .btn-primary,
  .btn-secondary,
  .btn-danger,
  .btn-icon,
  .back-link,
  .header-actions,
  .overall-progress,
  .phase-progress,
  .phase-progress-bar,
  .progress-bar,
  .progress-fill,
  .phase-nav,
  .site-footer,
  .card-link,
  .info-box,
  .tip-box {
    display: none !important;
  }

  /* ===========================================
     Page Setup
     =========================================== */
  @page {
    size: letter;
    margin: 0.75in 0.5in;
  }

  /* First page can have smaller top margin */
  @page :first {
    margin-top: 0.5in;
  }

  /* ===========================================
     Header Styles
     =========================================== */
  .site-header,
  .checklist-header {
    background: none !important;
    border: none !important;
    padding: 0 0 12pt 0 !important;
    margin-bottom: 12pt;
    border-bottom: 2pt solid #000 !important;
    position: static !important;
    text-align: left !important;
  }

  .site-header h1,
  .checklist-header h1,
  .checklist-title h1 {
    font-size: 18pt !important;
    font-weight: bold !important;
    margin: 0 !important;
  }

  .site-header p {
    font-size: 10pt;
    color: #333 !important;
    margin-top: 4pt;
  }

  .checklist-header-inner {
    display: block !important;
    padding: 0 !important;
  }

  .checklist-title {
    display: block !important;
  }

  /* ===========================================
     Phase Sections
     =========================================== */
  .main-content {
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .phase {
    margin: 0 0 16pt 0 !important;
    padding: 0 !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .phase-header {
    border-bottom: 1pt solid #000 !important;
    padding-bottom: 4pt !important;
    margin-bottom: 8pt !important;
  }

  .phase h2 {
    font-size: 14pt !important;
    font-weight: bold !important;
    color: #000 !important;
    margin: 0 !important;
    page-break-after: avoid;
    break-after: avoid;
  }

  .phase h2 .phase-icon {
    display: none !important;
  }

  /* ===========================================
     Subsections
     =========================================== */
  .subsection {
    margin: 8pt 0 !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .subsection h3 {
    font-size: 11pt !important;
    font-weight: bold !important;
    color: #333 !important;
    margin: 0 0 4pt 0 !important;
    padding-left: 0 !important;
    border-left: 2pt solid #000 !important;
    padding-left: 6pt !important;
    page-break-after: avoid;
    break-after: avoid;
  }

  /* ===========================================
     Checklist Items
     =========================================== */
  .items {
    display: block !important;
  }

  .item {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    padding: 3pt 0 !important;
    border: none !important;
    border-bottom: 0.5pt dotted #999 !important;
    border-radius: 0 !important;
    cursor: default !important;
    page-break-inside: avoid;
    break-inside: avoid;
    position: relative !important;
  }

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

  /* Print checkbox square */
  .item::before {
    content: '' !important;
    position: static !important;
    flex-shrink: 0;
    display: inline-block !important;
    width: 10pt !important;
    height: 10pt !important;
    border: 1pt solid #000 !important;
    border-radius: 1pt !important;
    margin-right: 8pt !important;
    margin-top: 2pt !important;
    background: #fff !important;
  }

  /* Checked items show filled checkbox */
  .item.checked::before {
    background: #000 !important;
    background-image: none !important;
  }

  .item .action {
    flex: 1 !important;
    padding-left: 0 !important;
    font-size: 10pt !important;
    color: #000 !important;
    text-decoration: none !important;
  }

  .item.checked .action {
    text-decoration: none !important;
    color: #000 !important;
  }

  .item .expected {
    flex-shrink: 0;
    font-size: 10pt !important;
    font-weight: bold !important;
    color: #000 !important;
    text-align: right !important;
    margin-left: 12pt !important;
    white-space: nowrap !important;
  }

  /* ===========================================
     Landing Page - Checklist Grid
     =========================================== */
  .checklist-grid {
    display: block !important;
    padding: 0 !important;
  }

  .checklist-card {
    border: 1pt solid #000 !important;
    padding: 8pt !important;
    margin-bottom: 8pt !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .checklist-card h2 {
    font-size: 12pt !important;
    margin-bottom: 4pt !important;
  }

  .checklist-card p {
    font-size: 10pt !important;
    color: #333 !important;
  }

  /* ===========================================
     Links
     =========================================== */
  a {
    text-decoration: none !important;
  }

  /* Show URL for external links */
  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #666 !important;
  }

  /* ===========================================
     Page Break Utilities
     =========================================== */
  .page-break-before {
    page-break-before: always;
    break-before: page;
  }

  .page-break-after {
    page-break-after: always;
    break-after: page;
  }

  .no-print {
    display: none !important;
  }

  /* ===========================================
     Print Header/Footer (where supported)
     =========================================== */
  @page {
    @top-center {
      content: "Flight Sim Checklist";
      font-size: 8pt;
      color: #666;
    }

    @bottom-center {
      content: "Page " counter(page) " of " counter(pages);
      font-size: 8pt;
      color: #666;
    }
  }
}
