/* =========================================================
   LogGraf — estilos próprios (o resto vem do Tailwind CDN)
   ========================================================= */

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-track { background: #f1f5f9; }

/* ---------- Navegação lateral ---------- */
.nav-link {
  display: flex; align-items: center; gap: .65rem;
  padding: .6rem .8rem; border-radius: .6rem;
  font-size: .9rem; font-weight: 500; color: #475569; white-space: nowrap;
}
.nav-link:hover { background: #f1f5f9; color: #0f172a; }
.nav-link.nav-active { background: #dcfce7; color: #15803d; }

/* ---------- Utilidades ---------- */
.clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* =========================================================
   ETIQUETA A6 (105 x 148 mm)
   Monocromática, alto contraste, sem blocos pretos grandes
   (não "queima" a cabeça da impressora térmica).
   ========================================================= */
.label-a6 {
  width: 105mm;
  height: 148mm;
  box-sizing: border-box;
  background: #fff;
  color: #000;
  border: 2px solid #000;
  overflow: hidden;
  font-family: "Inter", sans-serif;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* 1 cliente = etiqueta cheia */
.label-full {
  padding: 5mm;
  display: flex;
  flex-direction: column;
  gap: 2mm;
}

/* 2 clientes = uma A6 dividida ao meio, com linha para cortar */
.label-duo { display: flex; flex-direction: column; }
.duo-half {
  flex: 1 1 50%;
  padding: 4mm;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 1.5mm;
  overflow: hidden;
}
.cut-line { position: relative; height: 0; border-top: 2px dashed #000; }
.cut-line::before {
  content: "\2702";            /* tesoura */
  position: absolute; left: 5mm; top: -9px;
  background: #fff; padding: 0 4px; font-size: 12px;
}

/* Códigos dentro da etiqueta */
.label-a6 svg[data-barcode] { width: 100%; height: auto; display: block; }
.label-a6 [data-qr] img,
.label-a6 [data-qr] canvas { display: block; margin: 0 auto; max-width: 100%; max-height: 100%; }
.label-a6 img.arte { object-fit: contain; display: block; margin: 0 auto; background: #fff; }

/* =========================================================
   IMPRESSÃO
   ========================================================= */
#print-root { display: none; }
body.printing #print-root { display: block; }
body.printing > *:not(#print-root) { display: none !important; }

@media print {
  @page { size: A6; margin: 0; }
  html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }
  .no-print { display: none !important; }
  #print-root { display: block !important; }
  .label-a6 { page-break-after: always; break-after: page; }
  .label-a6:last-child { page-break-after: auto; break-after: auto; }
}