@media print {
  @page {
    margin: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
  }

  body > *:not(#qr-print-root) {
    display: none !important;
  }

  #qr-print-root {
    position: fixed !important;
    inset: 0 !important;
    display: grid !important;
    place-items: center !important;
    padding: var(--print-pad, 1vmin) !important;
    box-sizing: border-box !important;
  }

  /* keep QR square and centered */
  #qr-print-root .qr-wrap {
    width: calc(100vmin - (2 * var(--print-pad, 1vmin)));
    height: calc(100vmin - (2 * var(--print-pad, 1vmin)));
    display: grid;
    place-items: center;


  }

  #qr-print-root img.qr {
    width: 100%;
    height: 100%;
    display: block;
  }

  #qr-print-root .qr-text {
    /* optional: show text under QR */
    margin-top: 2vh;
    font-size: 12pt;
    text-align: center;
  }


}
