/* ==========================================================================
   DS-G4RGO Environment Inspection — Print Styles
   White background, hide sidebar/nav, show only content.
   Page breaks between sections. Headers and footers for each page.
   ========================================================================== */

@media print {

  /* --------------------------------------------------------------------------
     Page setup
     -------------------------------------------------------------------------- */
  @page {
    size: A4 portrait;
    margin: 18mm 15mm 22mm 15mm;
  }

  @page :first {
    margin-top: 25mm;
  }

  /* --------------------------------------------------------------------------
     Running page headers and footers (@top-center / @bottom-center)
     Note: Only supported in some print engines (e.g., Prince, WeasyPrint).
     Browsers that do not support @page margin boxes will ignore these.
     -------------------------------------------------------------------------- */
  @page {
    @top-center {
      content: "DS-G4RGO Environment Inspection Report";
      font-family: 'Roboto', 'Helvetica Neue', Lato, sans-serif;
      font-size: 8pt;
      color: #718096;
    }

    @bottom-left {
      content: "Confidential";
      font-family: 'Roboto', 'Helvetica Neue', Lato, sans-serif;
      font-size: 7pt;
      color: #a0aec0;
    }

    @bottom-right {
      content: "Page " counter(page) " of " counter(pages);
      font-family: 'Roboto', 'Helvetica Neue', Lato, sans-serif;
      font-size: 7pt;
      color: #a0aec0;
    }
  }

  /* --------------------------------------------------------------------------
     Global print reset
     -------------------------------------------------------------------------- */
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #000000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html,
  body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 10pt;
    line-height: 1.45;
    font-family: 'Roboto', 'Helvetica Neue', Lato, sans-serif;
    background: #ffffff !important;
    color: #000000 !important;
  }

  /* --------------------------------------------------------------------------
     Hide non-content elements
     -------------------------------------------------------------------------- */
  .sidebar,
  .sidebar-overlay,
  .header,
  .header__hamburger,
  .footer,
  nav,
  .no-print,
  .btn,
  .form-actions,
  .toggle,
  [role="navigation"] {
    display: none !important;
  }

  /* --------------------------------------------------------------------------
     Layout override — single column, no grid
     -------------------------------------------------------------------------- */
  .app {
    display: block !important;
    grid-template-columns: none !important;
  }

  .main {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .main__content {
    max-width: 100% !important;
  }

  /* --------------------------------------------------------------------------
     Print header (visible only in print, insert via .print-header element)
     -------------------------------------------------------------------------- */
  .print-header {
    display: block !important;
    margin-bottom: 8mm;
    padding-bottom: 4mm;
    border-bottom: 0.5pt solid #cccccc !important;
  }

  .print-header__title {
    font-size: 16pt;
    font-weight: 600;
    margin-bottom: 2mm;
  }

  .print-header__meta {
    font-size: 8pt;
    color: #555555 !important;
  }

  /* Hide print-header on screen */
  @media screen {
    .print-header {
      display: none !important;
    }
  }

  /* --------------------------------------------------------------------------
     Print footer (visible only in print, insert via .print-footer element)
     -------------------------------------------------------------------------- */
  .print-footer {
    display: block !important;
    margin-top: 8mm;
    padding-top: 4mm;
    border-top: 0.5pt solid #cccccc !important;
    font-size: 7pt;
    color: #999999 !important;
    text-align: center;
  }

  /* Hide print-footer on screen */
  @media screen {
    .print-footer {
      display: none !important;
    }
  }

  /* --------------------------------------------------------------------------
     Typography adjustments
     -------------------------------------------------------------------------- */
  h1 {
    font-size: 16pt;
    margin-bottom: 4mm;
  }

  h2 {
    font-size: 13pt;
    margin-bottom: 3mm;
  }

  h3 {
    font-size: 11pt;
    margin-bottom: 2mm;
  }

  h4, h5, h6 {
    font-size: 10pt;
    margin-bottom: 2mm;
  }

  p {
    orphans: 3;
    widows: 3;
  }

  /* --------------------------------------------------------------------------
     Links — show URL after link text
     -------------------------------------------------------------------------- */
  a,
  a:visited {
    text-decoration: underline !important;
    color: #000000 !important;
  }

  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #555555 !important;
    font-weight: 400;
  }

  /* Do not print URLs for internal/anchor links */
  a[href^="#"]::after,
  a[href^="javascript"]::after {
    content: "";
  }

  /* --------------------------------------------------------------------------
     Panels / Cards
     -------------------------------------------------------------------------- */
  .panel {
    border: 0.5pt solid #cccccc !important;
    margin-bottom: 5mm;
    page-break-inside: avoid;
  }

  .panel__header {
    border-bottom: 0.5pt solid #cccccc !important;
    padding: 2mm 3mm;
  }

  .panel__body {
    padding: 3mm;
  }

  .panel__footer {
    border-top: 0.5pt solid #cccccc !important;
    padding: 2mm 3mm;
  }

  /* --------------------------------------------------------------------------
     Tables
     -------------------------------------------------------------------------- */
  .table {
    font-size: 8pt;
  }

  .table th,
  .table td {
    border: 0.5pt solid #cccccc !important;
    padding: 1.5mm 2mm;
  }

  .table th {
    font-weight: 600;
    background: #f0f0f0 !important;
  }

  .table thead {
    display: table-header-group;
  }

  .table tr {
    page-break-inside: avoid;
  }

  /* --------------------------------------------------------------------------
     Form elements — read-only print view
     -------------------------------------------------------------------------- */
  .input,
  .select,
  .textarea {
    border: 0.5pt solid #cccccc !important;
    padding: 1mm 2mm;
    min-height: auto;
    height: auto;
  }

  .field__label {
    font-weight: 600;
    margin-bottom: 1mm;
  }

  .checkbox__box,
  .radio__circle {
    border: 0.5pt solid #000000 !important;
    width: 3mm;
    height: 3mm;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .checkbox__input:checked + .checkbox__box {
    background: #000000 !important;
  }

  .radio__input:checked + .radio__circle::after {
    background: #000000 !important;
  }

  /* --------------------------------------------------------------------------
     Page break controls
     -------------------------------------------------------------------------- */
  .form-section {
    page-break-before: auto;
    page-break-after: auto;
    page-break-inside: avoid;
  }

  /* Force page break before specific sections */
  .page-break-before {
    page-break-before: always;
  }

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

  .no-page-break {
    page-break-inside: avoid;
  }

  /* Avoid breaking inside these elements */
  .field,
  .field-pair,
  blockquote,
  pre,
  figure,
  img {
    page-break-inside: avoid;
  }

  /* Section titles should not be orphaned at bottom of page */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
  }

  /* --------------------------------------------------------------------------
     Images
     -------------------------------------------------------------------------- */
  img {
    max-width: 100% !important;
    page-break-inside: avoid;
  }

  /* --------------------------------------------------------------------------
     Code blocks
     -------------------------------------------------------------------------- */
  pre,
  code {
    font-size: 8pt;
    border: 0.5pt solid #cccccc !important;
    white-space: pre-wrap;
    word-wrap: break-word;
  }

  pre {
    padding: 2mm 3mm;
  }

  code {
    padding: 0 1mm;
  }

  /* --------------------------------------------------------------------------
     Grid layouts — linearize for print
     -------------------------------------------------------------------------- */
  .grid,
  .grid--2,
  .grid--3,
  .grid--4,
  .grid--30-70 {
    display: block !important;
  }

  .grid > * {
    margin-bottom: 4mm;
  }

  /* --------------------------------------------------------------------------
     Status indicators — ensure visibility in B&W print
     -------------------------------------------------------------------------- */
  .text-success::before {
    content: "[OK] ";
  }

  .text-warning::before {
    content: "[WARN] ";
  }

  .text-error::before {
    content: "[ERR] ";
  }

  /* --------------------------------------------------------------------------
     Page header visible in print only
     (alternative to @page margin boxes for standard browsers)
     -------------------------------------------------------------------------- */
  .print-page-header {
    display: block !important;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 7pt;
    color: #999999 !important;
    padding: 2mm 0;
    border-bottom: 0.25pt solid #dddddd !important;
  }

  .print-page-footer {
    display: block !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 7pt;
    color: #999999 !important;
    padding: 2mm 0;
    border-top: 0.25pt solid #dddddd !important;
  }

  /* Hide fixed-position print header/footer on screen */
  @media screen {
    .print-page-header,
    .print-page-footer {
      display: none !important;
    }
  }

  /* --------------------------------------------------------------------------
     Utility: force show/hide elements in print
     -------------------------------------------------------------------------- */
  .print-only {
    display: block !important;
  }

  .screen-only {
    display: none !important;
  }
}

/* --------------------------------------------------------------------------
   Screen-only defaults for print-only elements
   -------------------------------------------------------------------------- */
.print-only {
  display: none;
}