@page {
  size: 80mm auto;
  margin: 4mm;
}

html {
  background: #eef0f2;
  color: #111;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 10pt;
  line-height: 1.35;
}

body {
  margin: 0;
}

.invoice-receipt {
  box-sizing: border-box;
  inline-size: 72mm;
  margin: 1rem auto;
  padding: 4mm;
  background: #fff;
  overflow-wrap: anywhere;
}

.invoice-receipt__header,
.invoice-receipt__document,
.invoice-receipt__qr {
  text-align: center;
}

.invoice-receipt__issuer,
.invoice-receipt__title,
.invoice-receipt__note-title,
.invoice-receipt__line,
.invoice-receipt__facts {
  margin-block: 0;
}

.invoice-receipt__issuer {
  font-size: 14pt;
  line-height: 1.2;
}

.invoice-receipt__title {
  font-size: 12pt;
  line-height: 1.25;
}

.invoice-receipt__note-title {
  margin-block-end: 1mm;
  font-size: 10pt;
  text-transform: uppercase;
}

.invoice-receipt__section {
  padding-block: 3mm;
  border-block-start: 0.25mm dashed #555;
  break-inside: avoid;
}

.invoice-receipt__header {
  padding-block-end: 3mm;
}

.invoice-receipt__facts {
  margin-block-start: 2mm;
}

.invoice-receipt__fact {
  display: flex;
  justify-content: space-between;
  gap: 3mm;
}

.invoice-receipt__fact dt,
.invoice-receipt__fact dd {
  margin: 0;
}

.invoice-receipt__fact dd {
  text-align: end;
  white-space: nowrap;
}

.invoice-receipt__table {
  inline-size: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.invoice-receipt__table th,
.invoice-receipt__table td {
  padding-block: 1.5mm;
  vertical-align: top;
}

.invoice-receipt__table th {
  border-block-end: 0.25mm solid #111;
  text-align: start;
}

.invoice-receipt__table tbody tr + tr td {
  border-block-start: 0.2mm dotted #999;
}

.invoice-receipt__items th:last-child,
.invoice-receipt__items td:last-child {
  inline-size: 21mm;
}

.invoice-receipt__amount {
  text-align: end !important;
  white-space: nowrap;
}

.invoice-receipt__item-detail {
  display: block;
}

.invoice-receipt__grand-total {
  margin-block-start: 2mm;
  padding-block-start: 2mm;
  border-block-start: 0.5mm solid #111;
  font-size: 12pt;
  font-weight: 700;
}

.invoice-receipt__preformatted {
  white-space: pre-wrap;
}

.invoice-receipt__qr-image {
  display: block;
  inline-size: 32mm;
  block-size: 32mm;
  margin: 2mm auto;
}

@media print {
  html {
    background: #fff;
  }

  .invoice-receipt {
    margin: 0;
    padding: 0;
  }
}
