/* /barcode-generator/ page styles. Built from /assets/polyatic.css tokens only (no new colours or fonts). */
.nojs{margin:1.25rem 0 0;padding:0.875rem 1rem;border:1px solid var(--line);border-left:0.25rem solid var(--accent);border-radius:0.625rem;background:var(--surface);color:var(--ink);font-size:0.9375rem;line-height:1.6}

.bc-head .sub{margin-bottom:1rem}
@media(max-width:520px){.bc-head h1{margin-bottom:0.25rem}.bc-head .sub{font-size:0.9375rem;margin-bottom:0.75rem}}

@media(min-width:920px){.bc-duo{grid-template-columns:minmax(0,1.3fr) minmax(21rem,.9fr)}}
.bc-main{padding:1rem}
@media(max-width:520px){.bc-main{padding:0.875rem 0.75rem 1rem}}

.bc-inputs{display:grid;gap:0.75rem}
@media(min-width:560px){.bc-inputs{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.bc-datafield input{font-family:var(--mono);font-size:1.0625rem;letter-spacing:.02em}
.bc-len{font-family:var(--mono);font-size:0.75rem;color:var(--muted);font-variant-numeric:tabular-nums}

.bc-status{margin:0.625rem 0.125rem 0;min-height:1.25rem;font-size:0.875rem;line-height:1.45;color:var(--muted);overflow-wrap:anywhere}
.bc-status.ok{color:var(--ok)}
.bc-status.bad{color:var(--bad);font-weight:600}
.bc-status.busy{color:var(--muted);font-style:italic}
.bc-fix{margin:0.5rem 0 0;font-family:var(--mono)}
.bc-notes{margin:0.5rem 0.125rem 0;font-size:0.8125rem;color:var(--warn);line-height:1.45}

.bc-qr{margin:0.875rem 0 0;padding:0.875rem 1rem;border:1px solid var(--line);border-radius:0.625rem;background:var(--surface-2)}
.bc-qr p{margin:0 0 0.75rem;font-size:0.9375rem}
.bc-qr .btn{display:inline-flex;align-items:center;text-decoration:none}

/* the code sits on a cutting-mat tile so its own background colour reads in both themes */
.bc-preview{margin:0.875rem 0 0;padding:0}
.bc-canvas{display:flex;align-items:center;justify-content:center;min-height:9.5rem;padding:1rem;border-radius:0.625rem;background:var(--surface-2);border:1px solid var(--line);overflow:hidden}
.bc-canvas svg{display:block;width:100%;max-width:26rem;height:auto;max-height:15rem;outline:1px solid var(--line)}
@media(max-width:520px){.bc-canvas{min-height:8rem;padding:0.75rem}.bc-canvas svg{max-height:11rem}}
.bc-meta{margin:0.375rem 0.125rem 0;font-family:var(--mono);font-size:0.75rem;color:var(--muted);font-variant-numeric:tabular-nums}

.bc-dl{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.875rem}
.bc-dl .btn{flex:1 1 auto;min-width:6.5rem}
.bc-dl .btn:disabled{opacity:.5;cursor:default;filter:none}
.bc-help{margin:0.5rem 0.125rem 0;font-size:0.8125rem;color:var(--muted);line-height:1.5}

/* side panel */
.bc-side{padding:1rem 1rem 1.125rem}
.bc-h{font-family:var(--mono);font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 0.75rem}
.bc-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem 0.875rem}
.bc-checkfield{display:flex;align-items:flex-end;padding-bottom:0.6875rem}
.bc-colour input[type=color]{width:100%;height:2.75rem;padding:0.1875rem;border:1px solid var(--line-2);border-radius:0.5rem;background:var(--surface);cursor:pointer}
.bc-colour input[type=color]:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.bc-warn{margin:0.75rem 0 0;padding:0.625rem 0.875rem;border:1px solid var(--line);border-left:0.25rem solid var(--warn);border-radius:0.5rem;background:var(--surface-2);font-size:0.8125rem;line-height:1.5}
.bc-warn p{margin:0}
.bc-warn p+p{margin-top:0.375rem}

.bc-batch{margin-top:1.125rem;border-top:1px solid var(--line);padding-top:0.875rem}
.bc-batch>summary{cursor:pointer;font-weight:600;font-size:0.9375rem;padding:0.25rem 0}
.bc-batch>summary:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:0.25rem}
.bc-batch[open]>summary{margin-bottom:0.75rem}
.bc-batch .field{margin-top:0.75rem}
.bc-batch textarea{font-family:var(--mono);font-size:0.875rem;resize:vertical}
.bc-custom{margin-top:0.25rem}
.bc-custom .field{margin-top:0.5rem}
.bc-sheetinfo{margin:0.875rem 0 0;padding:0.625rem 0.875rem;border-radius:0.5rem;background:var(--surface-2);box-shadow:inset 0.1875rem 0 0 var(--signal);font-size:0.875rem;line-height:1.5;min-height:1.25rem}
.bc-sheetinfo.bad{box-shadow:inset 0.1875rem 0 0 var(--bad);color:var(--bad)}
.bc-errors{margin:0.5rem 0 0;padding:0 0 0 1.125rem;font-size:0.8125rem;color:var(--bad);max-height:8rem;overflow-y:auto}

/* page-1 picture of the label sheet */
.bc-sheetfig{margin:0.75rem 0 0}
.bc-sheetprev{max-width:16rem;margin:0 auto}
.bc-sheetprev svg{display:block;width:100%;height:auto;border-radius:0.25rem;box-shadow:var(--shadow)}
.bc-sheetprev .pg{fill:var(--surface);stroke:var(--line-2);stroke-width:0.6}
.bc-sheetprev .lb{fill:none;stroke:var(--line-2);stroke-width:0.4;stroke-dasharray:1.5 1}
.bc-sheetfig .bc-meta{text-align:center}

/* the printable sheet: invisible on screen, the only thing on paper */
.bc-sheet{display:none}
@media print{
  body.bc-printing>*:not(.bc-sheet){display:none !important}
  body.bc-printing{margin:0}
  body.bc-printing .bc-sheet{display:block}
  .bc-page{position:relative;overflow:hidden;break-after:page;page-break-after:always}
  .bc-page:last-child{break-after:auto;page-break-after:auto}
  .bc-label{position:absolute}
  .bc-label svg{display:block;width:100%;height:100%}
}
