/* QR code print checker (tools.d/qr-print-checker.cjs). Every rule under #visu-tools.vt-qr-print-checker: the root
 * element carries the id and the class together (render.cjs). Hairline borders only. */
#visu-tools.vt-qr-print-checker .vt-out { position: static; }
#visu-tools.vt-qr-print-checker .vt-in { display: grid; gap: 12px; align-content: start; }
#visu-tools.vt-qr-print-checker .vt-drop { border-width: 1px; }
#visu-tools.vt-qr-print-checker .vt-status:empty { display: none; }

#visu-tools.vt-qr-print-checker .vt-qc-preview { margin: 0; display: grid; gap: 8px; justify-items: start; }
#visu-tools.vt-qr-print-checker .vt-qc-preview canvas { display: block; max-width: 100%; max-height: 380px; width: auto; height: auto; border: 1px solid var(--vt-line); border-radius: 12px; background: #fff; }
#visu-tools.vt-qr-print-checker .vt-qc-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--vt-muted); }
#visu-tools.vt-qr-print-checker .vt-qc-legend span { display: inline-flex; align-items: center; gap: 6px; }
#visu-tools.vt-qr-print-checker .vt-qc-key { display: inline-block; width: 18px; height: 2px; flex: none; background: #19b4ef; }
#visu-tools.vt-qr-print-checker .vt-qc-key-quiet { background: repeating-linear-gradient(90deg, #d9480f 0 5px, transparent 5px 8px); }
#visu-tools.vt-qr-print-checker .vt-qc-dist { margin-top: 6px; padding-top: 16px; border-top: 1px solid var(--vt-line); }

#visu-tools.vt-qr-print-checker .vt-qc-found { display: grid; gap: 8px; }
#visu-tools.vt-qr-print-checker .vt-qc-found-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#visu-tools.vt-qr-print-checker .vt-qc-found .vt-raw { max-height: 132px; margin: 0; font-size: 13.5px; }
#visu-tools.vt-qr-print-checker .vt-error strong { display: block; margin-bottom: 2px; }

#visu-tools.vt-qr-print-checker .vt-qc-rows { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; gap: 10px; }
#visu-tools.vt-qr-print-checker .vt-qc-row { display: grid; gap: 8px; margin: 0; padding: 14px; border: 1px solid var(--vt-line); border-radius: 14px; background: var(--vt-surface); min-width: 0; }
#visu-tools.vt-qr-print-checker .vt-qc-row-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
#visu-tools.vt-qr-print-checker .vt-qc-row h4 { font-size: 15px !important; font-weight: 650 !important; line-height: 1.35 !important; letter-spacing: 0; }
#visu-tools.vt-qr-print-checker .vt-qc-status { flex: none; padding: 2px 9px; border-radius: 999px; background: var(--vt-bg); color: var(--vt-muted); font-size: 12px; font-weight: 650; line-height: 1.5; white-space: nowrap; }
#visu-tools.vt-qr-print-checker .vt-qc-status:empty { display: none; }
#visu-tools.vt-qr-print-checker .vt-qc-row[data-status="ok"] .vt-qc-status { background: #e7f7ef; color: var(--vt-ok); }
#visu-tools.vt-qr-print-checker .vt-qc-row:is([data-status="tight"], [data-status="inverted"]) .vt-qc-status { background: #fff7e8; color: #6b3d04; }
#visu-tools.vt-qr-print-checker .vt-qc-row[data-status="below"] .vt-qc-status { background: #fef1f0; color: var(--vt-err); }
#visu-tools.vt-qr-print-checker .vt-qc-val { margin: 0; font-size: 22px; font-weight: 720; line-height: 1.2; color: var(--vt-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#visu-tools.vt-qr-print-checker .vt-qc-sides { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; }
#visu-tools.vt-qr-print-checker .vt-qc-sides > div { display: grid; gap: 2px; align-content: start; min-width: 0; padding: 8px 10px; border-radius: 10px; background: var(--vt-bg); }
#visu-tools.vt-qr-print-checker .vt-qc-sides dt { font-size: 12.5px; color: var(--vt-muted); }
#visu-tools.vt-qr-print-checker .vt-qc-sides dd { margin: 0; font-size: 18px; font-weight: 720; line-height: 1.25; color: var(--vt-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#visu-tools.vt-qr-print-checker .vt-qc-sides :is([data-limit="edge"], [data-limit="cap"]) dd, #visu-tools.vt-qr-print-checker .vt-qc-sides div:not([data-status]) dd { font-size: 14px; font-weight: 620; }
#visu-tools.vt-qr-print-checker .vt-qc-sides [data-status="tight"] dd { color: #8a5207; }
#visu-tools.vt-qr-print-checker .vt-qc-sides [data-status="below"] dd { color: var(--vt-err); }
#visu-tools.vt-qr-print-checker :is(.vt-qc-ref, .vt-qc-src) { margin: 0; font-size: 13px; line-height: 1.5; color: var(--vt-muted); }
#visu-tools.vt-qr-print-checker :is(.vt-qc-ref, .vt-qc-src) span { font-weight: 650; color: var(--vt-text); }
#visu-tools.vt-qr-print-checker :is(.vt-qc-ref, .vt-qc-src) span::after { content: ":"; }

#visu-tools.vt-qr-print-checker .vt-qc-print { display: grid; gap: 10px; padding-top: 16px; border-top: 1px solid var(--vt-line); }
#visu-tools.vt-qr-print-checker .vt-qc-print .vt-big-num { font-size: clamp(34px, 4vw, 46px); }
#visu-tools.vt-qr-print-checker .vt-qc-disclaimer { margin: 0; padding: 12px 14px; border: 1px solid var(--vt-line-2); border-radius: 12px; background: var(--vt-bg); font-size: 14px; line-height: 1.5; color: var(--vt-ink); }
#visu-tools.vt-qr-print-checker .vt-qc-dyn .vt-btn { justify-self: start; }
#visu-tools.vt-qr-print-checker #vt-qc-dyn-short { font-weight: 600; color: var(--vt-ink); }

#visu-tools.vt-qr-print-checker .vt-qc-explain { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; align-items: start; }
#visu-tools.vt-qr-print-checker .vt-qc-explain h2 { font-size: 22px !important; margin-bottom: 12px !important; }
#visu-tools.vt-qr-print-checker .vt-qc-how { margin: 0 !important; padding-left: 22px !important; display: grid; gap: 8px; font-size: 15px; line-height: 1.55; }
#visu-tools.vt-qr-print-checker .vt-qc-size-box h3 { font-size: 18px !important; font-weight: 700 !important; }
@media (max-width: 1024px) {
  #visu-tools.vt-qr-print-checker .vt-qc-explain { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  #visu-tools.vt-qr-print-checker .vt-qc-sides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #visu-tools.vt-qr-print-checker .vt-qc-row { padding: 12px; }
  #visu-tools.vt-qr-print-checker .vt-qc-row-head { flex-wrap: wrap; }
  #visu-tools.vt-qr-print-checker .vt-qc-dyn .vt-btn { justify-self: stretch; }
}
