/* POC A — barcode demo overrides on top of brand.css / style.css */

.partner-text {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.65;
  padding: 2px 8px;
  border: 1px solid var(--border, #d5d5d5);
  border-radius: 6px;
}

/* image stage shows an <img> instead of a canvas */
.img-stage img { max-width: 100%; max-height: 100%; border-radius: 8px; display: block; }

/* pipeline stage chips */
.stages { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 6px; }
.stage-step {
  border: 1px solid var(--border, #ddd);
  border-radius: 8px;
  padding: 10px 8px;
  text-align: center;
  transition: all 0.25s ease;
  opacity: 0.5;
}
.stage-step b { display: block; font-size: 0.82rem; }
.stage-step em { font-style: normal; font-size: 0.66rem; opacity: 0.7; }
.stage-step.on { opacity: 1; border-color: #3ecb84; box-shadow: 0 0 0 1px #3ecb84 inset; }
.stage-step.skip { opacity: 0.28; }

.crop-wrap { margin-top: 14px; }
.crop-wrap img {
  width: 100%; max-height: 120px; object-fit: contain;
  background: #fff; border: 1px solid var(--border, #ddd); border-radius: 8px; padding: 6px;
}

/* value display */
.tin-display .val-ok { font-family: "JetBrains Mono", monospace; font-size: 1.7rem; font-weight: 500; letter-spacing: 0.04em; }
.tin-display .val-miss { color: #d0553f; font-weight: 500; }

/* sample grid + tiles (tyre.css isn't loaded here) */
.sample-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
@media (max-width: 900px) { .sample-grid { grid-template-columns: repeat(4, 1fr); } }
.sample-cell {
  position: relative; display: block; padding: 0; aspect-ratio: 1;
  overflow: hidden; cursor: pointer; border: 1px solid var(--border, #ddd);
  border-radius: 8px; background: var(--field, #f3f3f3);
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.sample-cell:hover { border-color: #3ecb84; transform: translateY(-2px); }
.sample-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sample-cell .cond-tag {
  position: absolute; left: 4px; bottom: 4px;
  font-family: "JetBrains Mono", monospace; font-size: 0.58rem;
  background: rgba(0,0,0,0.62); color: #fff; padding: 1px 5px; border-radius: 4px;
  text-transform: uppercase; letter-spacing: 0.04em;
}

/* benchmark bars */
.bench li { align-items: center; }
.bench li .bar { flex: 1; height: 6px; background: var(--border, #e3e3e3); border-radius: 4px; margin: 0 10px; overflow: hidden; }
.bench li .bar span { display: block; height: 100%; background: #3ecb84; border-radius: 4px; }
.bench li.low .bar span { background: #e0a23c; }
.bench li.bad .bar span { background: #d0553f; }
.bench-total { margin-top: 10px; font-family: "JetBrains Mono", monospace; font-size: 0.8rem; opacity: 0.85; }

.live-status.is-run .ls-dot { background: #e0a23c; }
.live-status.is-ok .ls-dot { background: #3ecb84; }
.live-status.is-miss .ls-dot { background: #d0553f; }

.deblur-tag { display: block; margin-top: 6px; font-family: "JetBrains Mono", monospace;
  font-size: 0.7rem; color: #2e9e63; letter-spacing: 0.02em; }

.src-tag { display: inline-block; margin-top: 6px; font-family: "JetBrains Mono", monospace;
  font-size: 0.66rem; letter-spacing: 0.03em; text-transform: uppercase;
  padding: 2px 8px; border-radius: 5px; }
.src-bar { background: rgba(62,203,132,0.15); color: #2e9e63; border: 1px solid rgba(62,203,132,0.4); }
.src-ocr { background: rgba(224,162,60,0.15); color: #b8791f; border: 1px solid rgba(224,162,60,0.4); }

.src-stitch { background: rgba(110,110,240,0.13); color: #5a5ad0; border: 1px solid rgba(110,110,240,0.4); }

.val-partial { font-family: "JetBrains Mono", monospace; font-size: 1.7rem; font-weight: 500;
  letter-spacing: 0.08em; color: #7a7a86; }
.db-note { display: block; margin-top: 8px; font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem; color: #5a5ad0; line-height: 1.5; }
.db-note b { color: #4a4ac8; letter-spacing: 0.04em; }

.bench-note { font-family: "JetBrains Mono", monospace; font-size: 0.6rem; color: #5a5ad0;
  font-style: normal; white-space: nowrap; }

.diag-note { display: block; margin-top: 8px; font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem; color: #b8791f; line-height: 1.5; }