/* Label sheets at their real size. Used by the editor's preview and by the print page / PDF. */
.lp-sheet {
  position: relative;
  background: #fff;
  overflow: hidden;
  flex: 0 0 auto;
  color: #1f2937;
  font-family: "Inter", Arial, sans-serif;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.lp-slot, .lp-label { position: absolute; box-sizing: border-box; }

/* Dashed outline of each label spot (preview, and the test page). */
.lp-slot { border: 0.25mm dashed #c4c9d2; pointer-events: auto; }
.lp-slot-skipped { background: repeating-linear-gradient(135deg, #f1f3f5 0 2mm, #fff 2mm 4mm); border-style: solid; border-color: #dee2e6; }
.lp-slot-number { position: absolute; left: 1mm; top: 0.6mm; font: 600 7pt/1 Arial, sans-serif; color: #868e96; }

.lp-label { overflow: hidden; }
.lp-label.lp-clickable { cursor: pointer; }
.lp-label.lp-highlight { outline: 0.6mm solid #f76707; outline-offset: -0.3mm; z-index: 2; }
.lp-label.lp-clickable .lp-line { cursor: text; border-radius: 0.6mm; }
.lp-label.lp-clickable .lp-line:hover { background: rgba(247, 103, 7, .10); }
.lp-label .lp-line.lp-line-selected { background: rgba(247, 103, 7, .18); box-shadow: 0 0 0 0.35mm #f76707; }
.lp-label .lp-line.lp-line-editing { background: #fff; box-shadow: 0 0 0 0.35mm #f76707, 0 0 0 1.2mm rgba(247, 103, 7, .2); outline: none; cursor: text; caret-color: #f76707; }
.lp-frame { position: absolute; inset: 1mm; pointer-events: none; box-sizing: border-box; }
.lp-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }

.lp-content { position: absolute; inset: 0; display: flex; box-sizing: border-box; min-width: 0; min-height: 0; }
.lp-content > * { flex: 1 1 auto; min-width: 0; min-height: 0; }
.lp-wrap { display: flex; flex: 1 1 auto; min-width: 0; min-height: 0; gap: 1.5mm; align-items: center; }
.lp-wrap > .lp-text, .lp-wrap > .lp-wrap { flex: 1 1 auto; align-self: stretch; }

.lp-text { display: flex; flex-direction: column; overflow: hidden; min-width: 0; min-height: 0; }
.lp-line { white-space: pre; overflow: visible; }
.lp-wrap-text .lp-line { white-space: pre-wrap; overflow-wrap: anywhere; }

.lp-media, .lp-code { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 0; align-self: stretch; overflow: hidden; }
.lp-media img { max-width: 100%; max-height: 100%; object-fit: contain; }
.lp-code svg { display: block; max-width: 100%; max-height: 100%; }
.lp-barcode { flex-direction: column; background: #fff; padding: 0.6mm 0; max-height: 22mm; }
.lp-bars { flex: 1 1 auto; width: 100%; min-height: 0; }
.lp-bars svg { width: 100%; height: 100%; }
.lp-code-text { flex: 0 0 auto; font: 500 6pt/1.1 "Courier Prime", ui-monospace, monospace; color: #000; text-align: center; letter-spacing: .04em; white-space: nowrap; overflow: hidden; max-width: 100%; padding-top: .3mm; }
.lp-code-bad { font: 600 6pt/1.2 Arial, sans-serif; color: #c92a2a; text-align: center; border: 0.2mm dashed #ffa8a8; border-radius: 1mm; padding: 1mm; }
.lp-icon { display: flex; align-items: center; justify-content: center; line-height: 1; }

.lp-badge { position: absolute; font: 700 6.5pt/1 "Inter", Arial, sans-serif; padding: 0.7mm 1.6mm; border-radius: 99mm; z-index: 1; }
.lp-badge-top-right { top: 1.2mm; right: 1.2mm; }
.lp-badge-top-left { top: 1.2mm; left: 1.2mm; }
.lp-badge-bottom-right { bottom: 1.2mm; right: 1.2mm; }
.lp-badge-bottom-left { bottom: 1.2mm; left: 1.2mm; }

.lp-test-note { position: absolute; left: 0; right: 0; bottom: 3mm; text-align: center; font: 8pt/1.3 Arial, sans-serif; color: #495057; }
