/* Keep the outer dialog steady; only the review area scrolls. */
.oa-scan-modal .modal-dialog { max-width: 640px; margin: 3vh auto; min-height: 0; }
.oa-scan-modal .modal-content { height: 460px; max-height: calc(100svh - 40px); border-radius: 16px; overflow: hidden; border: 1px solid #79d1ff; box-shadow: 0 0 0 1px #57b8e855, 0 0 26px #57b8e84d, 0 18px 55px #0008; }
.oa-scan-modal .modal-header, .oa-scan-modal .modal-footer { flex: 0 0 auto; padding: 16px 20px; }
.oa-scan-modal .modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 20px; scrollbar-gutter: stable; }
.oa-scan-modal [id$="StatusText"] { min-height: 0; margin: 0 0 8px !important; font-size: .92rem; }
.oa-scan-modal .scan-review { min-height: 0; font: inherit; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.oa-scan-modal .scan-review:empty::before { content: 'Ready for your scan.\A Scan the barcode on the back of the card. Results will appear here for review.'; color: #adb5bd; white-space: pre-line; }
.oa-scan-modal .scan-review[hidden] { display: none !important; }
.oa-scan-modal textarea { height: 110px; resize: none; }
.oa-scan-modal .scan-capture-input { position: absolute; opacity: 0; width: 1px; height: 1px; padding: 0; border: 0; top: 0; left: 0; }
.oa-scan-modal .scan-edit-notice { color: #ffd479; font-size: .9rem; }
.oa-scan-modal .modal-footer { gap: 6px; }
.oa-scan-modal .scan-progress { margin-bottom: 14px; }
.oa-scan-modal .scan-progress-track { height: 12px; overflow: hidden; border-radius: 8px; background: #ffffff18; }
.oa-scan-modal .scan-progress-fill { height: 100%; width: 0; background: #57b8e8; transition: width .18s ease; }
.oa-scan-modal .scan-progress-caption { min-height: 2.5em; padding-top: 7px; font-size: .85rem; color: #b8d9e7; }
.oa-scan-modal .is-receiving .scan-progress-fill { background-image: linear-gradient(45deg,#ffffff28 25%,transparent 25%,transparent 50%,#ffffff28 50%,#ffffff28 75%,transparent 75%); background-size: 24px 24px; animation: scan-activity 1s linear infinite; }
.oa-scan-modal .is-complete .scan-progress-fill { background: #66c797; }
.oa-scan-modal .is-error .scan-progress-fill { background: #edb95f; }
.oa-scan-modal .scan-edit-notice:empty { display: none; }
@keyframes scan-activity { to { background-position: 24px 0; } }
.oa-scan-modal .scan-report-button { margin-right: auto; border: 1px solid #ed7b82; border-radius: 6px; background: #b52d3a22; color: #ff9ca3; font-size: .75rem; font-weight: 600; padding: 7px 10px; }
.scan-report-dialog { width: min(620px, 94vw); max-height: 85svh; overflow: auto; background: #1b252d; color: #f1f4f6; border: 1px solid #73828c; border-radius: 12px; padding: 22px; }
.scan-report-dialog::backdrop { background: #0009; }
.scan-report-dialog pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 230px; overflow: auto; font-size: 12px; }
.scan-report-dialog textarea { width: 100%; color: #f1f4f6; background: #111b23; padding: 8px; }
.scan-report-dialog button { margin-right: 8px; }
@media (prefers-reduced-motion: reduce) { .oa-scan-modal .scan-progress-fill { animation: none !important; transition: none; } }
@media (max-width: 600px) {
  .oa-scan-modal .modal-dialog { margin: 10px; }
  .oa-scan-modal .modal-content { height: 500px; max-height: calc(100svh - 20px); }
  .oa-scan-modal .modal-body { padding: 14px; }
  .oa-scan-modal .modal-footer .btn { flex: 1 1 40%; margin: 0; }
}

.oa-scan-modal .scan-report-button:hover, .oa-scan-modal .scan-report-button:focus-visible { background: #b52d3a55; color: #fff; outline: 2px solid #ed7b82; outline-offset: 2px; }
.oa-scan-modal .scan-barcode-guide { display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0; }
.oa-scan-modal .scan-barcode-guide[hidden] { display: none; }
.oa-scan-modal .scan-barcode-example { margin: 0; padding: 8px; border: 1px solid #78cda4; border-radius: 8px; background: #ffffff08; }
.oa-scan-modal .scan-barcode-example.linear { border-color: #ed7b82; }
.oa-scan-modal .scan-barcode-example img { display: block; width: 140px; height: 56px; }
.oa-scan-modal .scan-barcode-example figcaption { margin-top: 6px; font-size: .8rem; color: #b1efd0; font-weight: 600; }
.oa-scan-modal .scan-barcode-example.linear figcaption { color: #ffadb3; }