/* Print kit (client/print-kit.js, views/_print-kit.cjs). Owner: the print kit. Two parts:
 * 1. Screen: the shared controls (paper, copies, cut marks, accent, logo) and the preview stage of a printable tool.
 * 2. Print: while html.vt-pk-printing is set, the print surface (a direct child of <body>) is the only thing on paper.
 *    Pages are sized in mm by the kit and @page is set to the paper with no margin, so 1 mm on screen maths = 1 mm on paper.
 *    The class is not .vt-printing on purpose: that one belongs to the WiFi card rules in tools.css. Borders: 1px hairline. */
#visu-tools .vt-pk-sheet { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: end; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--vt-line); }
#visu-tools .vt-pk-sheet .vt-field { width: 150px; }
#visu-tools .vt-pk-sheet .vt-seg > legend { margin-bottom: 6px; }
#visu-tools .vt-pk-colors { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#visu-tools .vt-pk-colors input[type=color] { width: 46px; height: 46px; padding: 3px; border-radius: 12px; border: 1px solid var(--vt-line-2); background: #fff; flex: none; cursor: pointer; }
#visu-tools .vt-pk-swatch { width: 30px; height: 30px; padding: 0; border-radius: 50%; border: 1px solid var(--vt-line-2); cursor: pointer; flex: none; }
#visu-tools .vt-pk-swatch:hover { box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--vt-ink); }
#visu-tools .vt-pk-logo-row { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
#visu-tools .vt-pk-logo input[type=file] { font-size: 14px; max-width: 100%; min-width: 0; }
#visu-tools .vt-pk-stage { display: grid; place-items: center; min-height: 240px; padding: 18px; border-radius: 16px; background: #edf0f4; border: 1px solid var(--vt-line); }
#visu-tools .vt-pk-paper { width: 100%; background: #fff; box-shadow: 0 1px 2px rgba(10, 19, 36, .14), 0 10px 28px rgba(10, 19, 36, .12); }
#visu-tools .vt-pk-paper svg, #visu-tools .vt-pk-thumb svg { display: block; width: 100%; height: 100%; }
#visu-tools .vt-pk-empty { max-width: 34ch; text-align: center; color: var(--vt-muted); font-size: 15px; }
#visu-tools .vt-pk-facts { display: flex; gap: 14px; align-items: center; }
#visu-tools .vt-pk-thumb { flex: none; width: 62px; background: #fff; border: 1px solid var(--vt-line-2); }
#visu-tools .vt-pk-meta { list-style: none; display: grid; gap: 3px; font-size: 14px; color: var(--vt-text); min-width: 0; }
@media (max-width: 600px) {
  #visu-tools .vt-pk-stage { padding: 12px; min-height: 200px; }
  #visu-tools .vt-pk-sheet .vt-field { width: 130px; }
  #visu-tools .vt-seg-items:has(input[name="vt-pk-paper"]) { flex-wrap: wrap; overflow-x: visible; margin: 0; padding: 0; }
}

@media screen { .vt-pk-surface { display: none !important; } }
@media print {
  html.vt-pk-printing, html.vt-pk-printing body { margin: 0 !important; padding: 0 !important; background: #fff !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
  html.vt-pk-printing body > *:not(.vt-pk-surface) { display: none !important; }
  html.vt-pk-printing .vt-pk-surface { display: block !important; margin: 0; padding: 0; }
  .vt-pk-page { overflow: hidden; margin: 0; padding: 0; background: #fff; break-inside: avoid; page-break-inside: avoid; break-after: page; page-break-after: always;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .vt-pk-page:last-child { break-after: auto; page-break-after: auto; }
  .vt-pk-page svg { display: block; }
}