/* ---------- default (screen) ---------- */
.print-letterhead,
.print-spacer { display: none; }

/* ---------- print rules ---------- */
@media print {

  /* Make the browser treat this like a full page doc */
  @page {
	size: A4;                       /* or 'letter' if US Letter 8.5x11" */
	margin: 15mm 12mm 15mm 12mm;    /* adjust to taste */
  }

  /* Hide site chrome & anything marked no-print */
  header, nav, footer, .site-header, .site-footer, .no-print, .hide_print {
	display: none !important;
  }

  /* Print only the report wrapper:
	 – Hide other top-level siblings of body
	 – This keeps layout stable without the "visibility hack" side-effects */
  body > *:not(#content) {
	display: none !important;
  }

  /* Ensure the printable area uses the full page width and never shrinks */
  #content {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
  }

  /* Reset common "responsive" constraints that cause tiny print */
  html { font-size: 11pt; }                 /* use physical units for print */
  .container, .wrap, .report, [class*="col"] {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
  }
  img, svg, canvas, video { max-width: 100% !important; height: auto !important; }
  * { box-shadow: none !important; }
  h2, h3, p {
      orphans: 3;
      widows: 3;
      margin: 0;
      padding: 0;
  }
  .info-section.print-letterhead .e-con-inner, .print-letterhead {
    padding: 0 !important; margin-top: 0 !important;margin-bottom: 0 !important
  }
  .print-letterhead  .box  {border: none !important}
  .state-icon svg {
      width: 20px;
  }.line-item { padding: 9px 0}
  /* Print-only letterhead */
  .print-letterhead {
	display: block !important;
	grid-template-columns: 1fr 1fr;
	gap: 8pt;
	align-items: center;
	
	padding: 8pt 0 10pt;
	border-bottom: 1pt solid #ddd;
  }
  .info-section.print-letterhead h2 {font-weight: 900}
  .info-section.print-letterhead h2, .info-section.print-letterhead p {
      text-align: center !important;
  }
 .info-section.print-letterhead {
     text-align: center !important;
     margin-bottom: 20px !important;
 }
  
  .lh-left { display: grid; grid-template-columns: auto 1fr; gap: 8pt; align-items: center; }
  .lh-logo { width: 36pt; height: auto; }
  .lh-biz { line-height: 1.35; }

  .lh-right {
	text-align: right;
	line-height: 1.35;
  }
	.info-section .elementor-element {
    border: none !important;
    gap: 0;
    margin: 0 !important;
    padding: 7px 0 0 !important;
}
	.info-section {
    padding: 0 !important;
    gap: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
table td, table th {
    border: 1px solid hsla(0, 0%, 50%, .502);
    line-height: 1.5;
    padding: 10px;
    vertical-align: top;
}
.responsive {max-width: 100%}
  /* Push content below the fixed letterhead */
  .print-spacer { display: block !important; height: 56pt; }

  /* Page-break helpers (use .page-break on elements where you want a new page) */
  .page-break   { break-before: page; page-break-before: always; }
  .avoid-break  { break-inside: avoid; page-break-inside: avoid; }
  .e-con.e-flex {
	  --width: 100%;
	  --flex-wrap: no-wrap !important;
  }
 #content .elementor-widget-icon-box.elementor-mobile-position-top .elementor-icon-box-wrapper {
	  align-items: center !important;
	  flex-direction: row !important;
	  gap: var(--icon-box-icon-margin, 15px);
	  text-align: left!important;
  }
 #content   .grid-4 {
	  --e-con-grid-template-columns: repeat(4, 1fr) !important
  }
  #content   .grid-3 {
		--e-con-grid-template-columns: repeat(3, 1fr) !important
	}
	#content   .grid-2 {
		--e-con-grid-template-columns: repeat(2, 1fr) !important
	}
}

/* ========= PRINT FIXES: overflow-proof tables + linear layout ========= */
@media print {

  /* Make all layout boxes measure width sanely */
  *, *::before, *::after { box-sizing: border-box !important; }

 
 .add-break {
   page-break-before: always;
 }
 
 /* Modern syntax (preferred) */
 .add-break {
   break-before: page;
 }
  /* --- TABLES: keep inside the page --- */
  .responsive {               /* your wrapper around tables */
    display: block !important;
    width: 95% !important;
    max-width: 95% !important;
    overflow: visible !important; /* scrolling is ignored in print anyway */
    page-break-inside: avoid;
  }

  table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse !important;
    table-layout: fixed !important; /* no intrinsic over-expansion */
    page-break-inside: auto;
    margin: 0 0 10pt 0 !important;
  }

  thead { display: table-header-group; }  /* repeat headers on new pages */
  tfoot { display: table-footer-group; }

  th, td {
    padding: 8pt !important;
    vertical-align: top !important;
    border: 1pt solid #efefef !important;

    /* aggressive wrapping so long strings/values never push width */
    overflow-wrap: anywhere;   /* modern browsers */
    word-break: break-word;    /* fallback */
    hyphens: auto;
  }

  /* Some rows are hidden on mobile; show them for print */
  .hide-mobile { display: table-row !important; }

  /* Headings spanning full width should not blow up layout */
  th[colspan] { text-align: left; }

  /* Prevent images/icons inside TH from forcing column width */
  th svg, th img { max-width: 18pt !important; height: auto !important; }

  /* Avoid mid-row breaks on critical chunks like signatures/images */
  tr, img { page-break-inside: avoid; break-inside: avoid; }

  /* Reset any transform/translate Elementor might add */
  [style*="transform"] { transform: none !important; }

  /* Typography for print (slightly tighter leading to fit more per page) */
  html { font-size: 11pt; line-height: 1.35; }

}

/* Optional: tighten the on-screen .responsive so it mirrors print safely */
@media screen {
  .responsive { max-width: 100%; overflow-x: auto; }
}