body { font-family: Arial, sans-serif; max-width: 920px; margin: auto; padding: 20px; background: #fff; }
    h1, h2, h3, h4, p { margin: 0; padding: 0; }
    .header { display: flex; justify-content: space-between; font-size: 15px; margin: 10px; border-bottom: 2px solid #000; padding-bottom: 10px; }
    .company-info { text-align: left; margin-bottom: 15px; font-size: 15px; }
    .info-table, .items-table, .summary-table { width: 100%; border-collapse: collapse; margin-bottom: 15px; }
    table { width: 100%; border-collapse: collapse; }
    .info-table td, .items-table th, .items-table td, .summary-table td { border: 1px solid #000; padding: 6px; font-size: 18px; }
    th, td { border: 1px solid #000; padding: 8px; text-align:center; }
    th { background-color: lightgrey; }
    .items-section { border: 1px solid #000; min-height: 550px; max-height: 600px; overflow-y: auto; display: flex; flex-direction: column; justify-content: flex-start; }
    .note, .signature { font-size: 12px; margin-top: 10px; }
    textarea { padding: 5px; margin: 10px; width:250px; font-size: 15px; height: 60px; font-family: Arial, Helvetica, sans-serif; }
    .btn { margin: 10px 5px; padding: 8px 14px; font-size: 14px; cursor: pointer; }
    input[type="text"], input[type="number"] { width: 95%;}
    .invoice { width: 40%; border: none; }
    .State {width: 25%;}
    .Date {width: 45%;}
    .fixed-sr { width: 50px; }
    .fixed-gst { width: 40px; }
    .fixed-box { width: 60px; }
    .fixed-rate, .fixed-sqft { width: 80px; }
    .fixed-amount { width: 100px; }
    .row-flex { display:flex; gap: 10px; }
    .row-flex > div { flex: 1; }
    .row-flex > div p { padding-left: 10px; }
    .freight-row { display: flex; justify-content: space-between; align-items: center; margin: 10px 0; }
    .freight-row input { width: 100%; padding: 5px; }
    .totals-table { float: right; width: 300px; border-collapse: collapse; }
    .totals-table td { border: 1px solid #000; padding: 6px; font-size: 14px; }
    @media print 
    { .btn, .freight-row, .gen { display: none !important; } @page { size: A4; margin: 20mm; } }


    .inline-field, .inline-date, .inline-state { border: none; padding: 2px 6px; font-size: 15px; background: transparent; outline: none; font-style:initial; }
    .info-table input{ width: 50%; margin-left: 5px; }
    select {padding: 5px;}  body { font-family: Arial, sans-serif; max-width: 920px; margin: auto; padding: 20px; background: #fff; }
    h1, h2, h3, h4, p { margin: 0; padding: 0; }
    .preview-box { margin-top: 20px; display: none; border: 1px solid #ccc; padding: 10px; }
    
    .offline-notice { color: red; display: none; margin-top: 10px; }

.invoice-a4 {
  width: 794px;   /* A4 width in pixels at 96dpi */
  height: 1123px; /* A4 height in pixels at 96dpi */
  background: #fff;
  margin: 0 auto;
  padding: 40px 30px;
  box-sizing: border-box;
  /* Optional: add border for visual debugging */
  /* border: 1px solid #ccc; */
}
@media print {
  .invoice-a4 {
    width: auto;
    height: auto;
    box-shadow: none;
    border: none;
  }
}

.pdf-export .btn,
.pdf-export .freight-row {
  display: none !important;
}