.a4-page-wrapper {
  width: 210mm;
  min-height: 297mm;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  margin: 0 auto;
  position: relative;
  box-sizing: border-box;
  padding: 12mm 18mm 12mm 18mm;
  font-family: 'Arial', 'Helvetica Neue', Helvetica, sans-serif;
  color: #1e293b;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: width 0.25s ease, min-height 0.25s ease;
}

/* Khổ A5 */
.a4-page-wrapper.paper-a5 {
  width: 148mm;
  min-height: 210mm;
  padding: 7mm 9mm;
  font-size: 10px;
}
.a4-page-wrapper.paper-a5 .bill-logo-img {
  max-width: 125px;
}
.a4-page-wrapper.paper-a5 .bill-title-text {
  font-size: 15px;
}
.a4-page-wrapper.paper-a5 .bill-items-table {
  font-size: 9.5px;
}
.a4-page-wrapper.paper-a5 .signature-box {
  height: 48px;
}
.a4-page-wrapper.paper-a5 .signature-svg {
  max-height: 40px;
}

/* Khổ Bill K80 (80mm) */
.a4-page-wrapper.paper-k80 {
  width: 80mm;
  min-height: auto;
  padding: 4mm 3mm;
  font-size: 9px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}
.a4-page-wrapper.paper-k80 .bill-header-row {
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.a4-page-wrapper.paper-k80 .bill-brand-left,
.a4-page-wrapper.paper-k80 .bill-company-right {
  width: 100%;
  text-align: center;
}
.a4-page-wrapper.paper-k80 .bill-customer-section {
  flex-direction: column;
}
.a4-page-wrapper.paper-k80 .bill-customer-left,
.a4-page-wrapper.paper-k80 .bill-customer-right {
  width: 100%;
}
.a4-page-wrapper.paper-k80 .signatures-row {
  grid-template-columns: 1fr 1fr;
}
.a4-page-wrapper.paper-k80 .signature-col:first-child {
  display: none;
}

.invoice-body-flow {
  display: flex;
  flex-direction: column;
}

/* 1. Header Topmost Meta */
.bill-top-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  color: #334155;
  margin-bottom: 8px;
}

/* 2. Brand & Company Header */
.bill-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.bill-brand-left {
  width: 44%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.bill-logo-img {
  max-width: 175px;
  height: auto;
  object-fit: contain;
  display: block;
}

.bill-company-right {
  width: 54%;
  text-align: left;
  font-size: 11.5px;
  line-height: 1.45;
  color: #1e293b;
}

.bill-company-name {
  font-size: 12.5px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 2px;
}

.bill-company-info-item {
  font-style: italic;
}

/* 3. Invoice Title */
.bill-title-section {
  text-align: center;
  margin: 8px 0 14px 0;
}

.bill-title-text {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.bill-code-line {
  font-size: 12.5px;
  margin-bottom: 2px;
}

.bill-date-line {
  font-size: 12.5px;
}

/* 4. Customer Info (2 Columns) */
.bill-customer-section {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  line-height: 1.45;
  margin-bottom: 14px;
}

.bill-customer-left {
  width: 55%;
}

.bill-customer-right {
  width: 42%;
}

.bill-info-row {
  margin-bottom: 2px;
}

/* 5. Invoice Table */
.bill-table-container {
  width: 100%;
  margin-bottom: 8px;
}

.bill-items-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11.5px;
}

.bill-items-table th, 
.bill-items-table td {
  border: 1px solid #475569;
  padding: 5px 6px;
}

.bill-items-table th {
  font-weight: 700;
  text-align: center;
  background-color: transparent;
}

.col-stt { width: 5%; text-align: center; }
.col-code { width: 14%; text-align: left; }
.col-name { width: 33%; text-align: left; }
.col-unit { width: 12%; text-align: center; }
.col-qty { width: 10%; text-align: right; }
.col-price { width: 12%; text-align: right; }
.col-total { width: 14%; text-align: right; }

.bill-items-table td.col-stt { text-align: center; }
.bill-items-table td.col-code { text-align: left; }
.bill-items-table td.col-name { text-align: left; }
.bill-items-table td.col-unit { text-align: center; }
.bill-items-table td.col-qty { text-align: right; }
.bill-items-table td.col-price { text-align: right; }
.bill-items-table td.col-total { text-align: right; font-weight: 500; }

/* 6. Summary Totals Section */
.bill-summary-section {
  width: 100%;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 10px;
}

.bill-summary-table {
  width: 100%;
  border-collapse: collapse;
}

.bill-summary-table td {
  padding: 2px 6px;
}

.summary-label-col {
  width: 58%;
  text-align: left;
}

.summary-qty-col {
  width: 22%;
  text-align: right;
  padding-right: 28px !important;
}

.summary-val-col {
  width: 20%;
  text-align: right;
}

.bill-words-line {
  text-align: right;
  font-style: italic;
  font-size: 11.5px;
  margin-top: 6px;
  padding-right: 6px;
}

/* 7. Signatures Section */
.bill-signatures-section {
  margin-top: 18px;
  width: 100%;
}

.signatures-date-top {
  text-align: right;
  font-style: italic;
  font-size: 12px;
  margin-bottom: 6px;
  padding-right: 25px;
}

.signatures-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  text-align: center;
  font-size: 12.5px;
}

.signature-col-title {
  font-weight: 400;
  margin-bottom: 4px;
}

.signature-box {
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.signature-svg {
  max-height: 58px;
  width: auto;
}

.signature-signer-name {
  font-weight: 700;
  font-size: 12px;
}

/* 8. Footer Section */
.bill-footer-row {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  color: #333;
  margin-top: 30px;
  padding-top: 6px;
}