/* Made by the components tool from receipt 1.2. Change it in shared/components/receipt instead. */
/* The shared receipt's paper on web pages, as php/receipt.php's paperHtml() makes it: a receipt shown exactly as it
   printed, the name bold and twice as big, and the total bold. Link it after brand's theme.css.

   The paper stays white with dark letters in both looks, as printed receipts stay light. Its width follows the paper,
   --nsys-receipt-columns letters a line, 32 for 58 mm and 48 for 80 mm, at 14 px letters. On a narrower screen its
   letters get smaller to fit, so it never scrolls sideways. Sizes from the approved plan, measured against the POS
   owner page's drawing: 14 px letters on 21 px lines, 20 by 18 px inside, and a 1 px edge in the look's line colour.
   0.61 is a monospace letter's width, rounded up, and 38 px the paper's own space and edges. */
.nsys-receipt {
  container-type: inline-size; box-sizing: border-box; max-width: 100%;
  width: calc(var(--nsys-receipt-columns) * 14px * 0.61 + 40px);
}
.nsys-receipt__paper {
  box-sizing: border-box; width: max-content; max-width: 100%; padding: 20px 18px;
  border: 1px solid var(--line); background: #ffffff; color: #1b1d1f;
  font: 14px/1.5 Menlo, Consolas, "Courier New", monospace;
  font-size: min(14px, calc((100cqi - 38px) / (var(--nsys-receipt-columns) * 0.61)));
}
.nsys-receipt__line { width: calc(var(--nsys-receipt-columns) * 1ch); min-height: 1.5em; white-space: pre; }
.nsys-receipt__line--center { text-align: center; }
.nsys-receipt__line--bold { font-weight: 700; }
/* Printers print a big line bold, twice as wide and twice as tall, so it holds half the letters. */
.nsys-receipt__line--big { width: calc(var(--nsys-receipt-columns) * 0.5ch); font-size: 2em; font-weight: 700; }