/* Scoped extension of the existing accounting workstation. */
.bill-review { color: var(--text-main, #0F172A); display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.bill-review, .bill-review * { font-family: 'Kanit', sans-serif !important; }
.bill-review *, .bill-review *::before, .bill-review *::after { box-sizing: border-box; }
.bill-review h2 { font-size: 20px; font-weight: 600; margin: 2px 0 5px; }
.bill-review h3 { font-size: 14px; font-weight: 600; margin: 0; }
.br-heading, .br-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.br-heading p, .br-muted { color: #64748B; font-size: 12px; line-height: 1.65; }
.br-eyebrow { color: #0284C7; font-size: 10px; letter-spacing: .12em; font-weight: 600; }
.br-human-note { display: inline-flex; gap: 7px; align-items: center; font-size: 11px; color: #0369A1; background: #F0F9FF; padding: 8px 12px; border: 1px solid #BAE6FD; border-radius: 20px; }
.br-overview { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; }
.br-stat { text-align: left; background: white; border: 1px solid #E2E8F0; border-radius: 12px; padding: 12px 15px; cursor: pointer; min-height: 85px; display: flex; flex-direction: column; gap: 3px; }
.br-stat span { font-size: 11px; color: #64748B; }
.br-stat strong { font-size: 23px; font-weight: 500; line-height: 1.2; }
.br-stat small { font-size: 10px; color: #64748B; }
.br-stat-active { border-color: #0284C7; background: #F0F9FF; box-shadow: 0 0 0 1px #0284C7; }
.br-upload { border: 1px dashed #93C5FD; background: #F5FAFF; border-radius: 14px; padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.br-upload > div:first-child { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 3px 8px; }
.br-upload strong { font-size: 13px; font-weight: 500; }
.br-upload span { grid-column: 2; font-size: 11px; color: #64748B; }
.br-upload svg { color: #0284C7; }
.br-dragover { background: #E0F2FE; border-color: #0284C7; }
.br-actions { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.br-actions span { font-size: 11px; color: #64748B; }
.br-queue-card, .br-original-card, .br-review-card { background: white; border: 1px solid #E2E8F0; border-radius: 16px; box-shadow: 0 2px 8px rgba(15,23,42,.025); min-width: 0; }
.br-queue-card .br-section-heading, .br-original-card .br-section-heading { padding: 14px 18px; }
.br-table-scroll { width: 100%; overflow-x: auto; }
.br-queue-card > .br-table-scroll { max-height: 250px; overflow-y: auto; }
.br-queue-table { width: 100%; min-width: 500px; }
.br-queue-table td { padding: 9px 16px; }
.br-queue-table strong { font-size: 12px; font-weight: 500; }
.br-queue-table small { display: block; color: #64748B; font-size: 10px; margin-top: 3px; }
.br-selected td { background: #F0F9FF; }
.br-number { text-align: right; font-family: var(--font-num, 'Kanit', monospace); font-variant-numeric: tabular-nums; }
.br-status { display: inline-flex; gap: 5px; align-items: center; padding: 4px 8px; font-size: 10px; border-radius: 6px; white-space: nowrap; }
.br-status svg { width: 14px; height: 14px; }
.br-verified, .br-posted { color: #047857; background: #ECFDF5; }
.br-needs_review { color: #92400E; background: #FFFBEB; }
.br-error { color: #B91C1C; background: #FEF2F2; }
.br-rejected { color: #475569; background: #F1F5F9; }
.br-original-meta label { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.br-original-meta [data-page] { max-width: 120px; }
.br-workspace { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.12fr); align-items: start; gap: 16px; }
.br-original-card { position: sticky; top: 16px; overflow: hidden; }
.br-original-meta { padding: 0 18px 12px; color: #64748B; font-size: 11px; overflow-wrap: anywhere; }
.br-viewer { height: 580px; background: #F1F5F9; overflow: auto; padding: 22px; display: flex; align-items: flex-start; justify-content: center; }
.br-image-stage { position: relative; width: 100%; flex: 0 0 100%; transform-origin: center top; }
.br-image-stage img { width: 100%; height: auto; display: block; box-shadow: 0 3px 15px #0F172A20; }
.br-highlight { position: absolute; border: 2px solid #0284C7; background: #38BDF833; pointer-events: none; box-shadow: 0 0 0 3px #FFFFFF70; }
.br-highlight[hidden] { display: none; }
.br-pdf { width: 100%; height: 100%; border: 0; background: white; }
.br-evidence-note { padding: 12px 18px; font-size: 11px; color: #64748B; background: #FAFCFE; }
.br-review-card { padding: 18px; }
.br-review-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0; font-size: 11px; color: #64748B; }
.br-empty { display: flex; flex-direction: column; gap: 12px; align-items: center; justify-content: center; text-align: center; padding: 45px 24px; min-height: 280px; color: #64748B; margin: auto; }
.br-empty > svg { width: 36px; height: 36px; color: #94A3B8; }
.br-empty strong { font-size: 14px; color: #475569; }
.br-empty p { font-size: 12px; line-height: 1.8; max-width: 300px; }
.br-queue-empty { text-align: center; padding: 22px; font-size: 12px; color: #64748B; }
.br-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 14px 0; }
.br-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; font-size: 11px; }
.br-field-title { display: flex; justify-content: space-between; gap: 5px; align-items: baseline; }
.br-field-title small { font-size: 9px; color: #64748B; white-space: nowrap; }
.bill-review input:not([type="checkbox"]):not([type="file"]), .bill-review select { width: 100%; min-width: 0; border: 1px solid #CBD5E1; border-radius: 7px; background: white; padding: 8px 9px; outline: none; height: 37px; }
.bill-review input:focus, .bill-review select:focus { border-color: #0284C7; box-shadow: 0 0 0 3px #E0F2FE; }
.br-field-error input { border-color: #FCA5A5 !important; background: #FFFAFA !important; }
.br-field-review input { border-color: #FCD34D !important; }
.br-total-field input { font-size: 18px !important; font-weight: 600 !important; height: 44px !important; color: #0F172A; }
.br-field-note, .br-original-value, .br-suggestion-label { font-size: 10px; color: #92400E; line-height: 1.6; }
.br-original-value { color: #64748B; }
.br-suggestion-label { color: #0369A1; }
.br-issues { display: flex; flex-direction: column; gap: 6px; }
.br-issue { display: flex; align-items: flex-start; gap: 8px; width: 100%; text-align: left; border-radius: 8px; padding: 10px; border: 1px solid #FDE68A; background: #FFFBEB; color: #92400E; cursor: pointer; }
.br-issue > span { font-size: 11px; line-height: 1.6; }
.br-issue strong { display: block; font-size: 10px; margin-top: 3px; }
.br-issue-error { border-color: #FECACA; background: #FEF2F2; color: #991B1B; }
.br-duplicates { display: flex; flex-direction: column; gap: 7px; padding: 12px 0; font-size: 12px; }
.br-details { border-top: 1px solid #E2E8F0; padding: 12px 0; }
.br-details summary { font-size: 12px; font-weight: 500; cursor: pointer; color: #475569; }
.br-details pre { max-height: 240px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; background: #F8FAFC; border-radius: 8px; font-size: 11px; margin-top: 10px; }
.br-item-title { margin: 15px 0 8px; }
.br-items { width: 100%; min-width: 610px; }
.br-items th, .br-items td { padding: 5px !important; }
.br-items td:first-child { min-width: 180px; }
.br-items td:not(:first-child) { min-width: 77px; }
.br-items td:last-child { min-width: 32px; }
.br-items input { font-size: 11px !important; padding: 6px !important; }
.br-math { padding: 10px 0; display: flex; flex-direction: column; gap: 8px; }
.br-math > div { display: flex; gap: 7px; align-items: center; font-size: 10px; color: #475569; flex-wrap: wrap; }
.br-math strong { margin-left: auto; font-weight: 500; }
.br-confirm-box { display: flex; flex-direction: column; gap: 12px; background: #F8FAFC; padding: 14px; border-radius: 10px; margin: 10px 0 20px; }
.br-confirm-box label, .br-check { display: flex; gap: 8px; align-items: flex-start; font-size: 11px !important; line-height: 1.65; }
.br-confirm-box input[type="checkbox"], .br-check input { margin-top: 3px; flex-shrink: 0; accent-color: #0284C7; }
.br-approval { border: 1px solid #BAE6FD; border-radius: 12px; padding: 15px; margin-bottom: 18px; background: #FBFDFF; }
.br-approval-summary { display: grid; grid-template-columns: 1fr auto; margin-top: 12px; gap: 4px; }
.br-approval-summary strong { font-size: 13px; }
.br-approval-summary span { font-size: 11px; color: #64748B; }
.br-approval-summary b { grid-column: 1 / -1; font-size: 25px; font-weight: 500; }
.br-check { margin: 10px 0; }
.br-approve { width: 100%; justify-content: center; margin: 8px 0; }
.bill-review button:disabled { opacity: .5; cursor: not-allowed; }
.br-message { padding: 12px 16px; border: 1px solid #BAE6FD; border-radius: 10px; background: #F0F9FF; color: #075985; font-size: 12px; line-height: 1.7; }
.br-message[hidden] { display: none; }
.br-message-error, .br-alert-error { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }
.br-alert-error { padding: 12px; border-radius: 8px; font-size: 12px; }
.br-posted { padding: 12px; border-radius: 10px; font-size: 12px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.br-audit { padding: 12px 0 12px 18px; max-height: 260px; overflow: auto; font-size: 11px; }
.br-audit li { margin-bottom: 10px; overflow-wrap: anywhere; }
.br-audit small { display: block; color: #64748B; font-size: 10px; }
.br-field { position: relative; }
.br-field-title { padding-right: 28px; }
.br-feedback-field { position: absolute; right: 0; top: -5px; width: 26px; height: 26px; }
.br-feedback { margin-top: 14px; }
.br-feedback textarea { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #CBD5E1; border-radius: 8px; resize: vertical; font: inherit; font-size: 12px; }
.br-feedback textarea:focus { outline: 2px solid #BAE6FD; border-color: #0284C7; }
.br-feedback-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0; }
.br-feedback [data-feedback-count] { display: inline-block; padding: 1px 7px; border-radius: 8px; background: #E0F2FE; color: #075985; }
.br-queue-card > .br-section-heading { flex-wrap: wrap; gap: 10px; }
.br-queue-card .br-actions { flex-wrap: wrap; }
.br-feedback-table { min-width: 600px; width: 100%; font-size: 12px; }
.br-feedback-table td { vertical-align: top; overflow-wrap: anywhere; max-width: 380px; }
.br-feedback-table small { display: block; font-size: 10px; color: #64748B; margin-top: 4px; }
.br-reader-card { padding: 16px 18px; border: 1px solid #BAE6FD; border-radius: 12px; background: #F0F9FF; }
.br-reader-card > .br-field { max-width: 560px; font-size: 13px; }
.br-reader-card [data-reader-select] { height: 42px; font-size: 13px; font-weight: 500; }
.br-reader-card details { border-top: 1px solid #BAE6FD; padding-top: 10px; }
.br-reader-card summary { cursor: pointer; color: #075985; font-size: 12px; }
.br-reader-provenance { padding: 8px 10px; border-radius: 8px; background: #F0F9FF; color: #075985; font-size: 11px; overflow-wrap: anywhere; }
@media (max-width: 1100px) {
  .br-workspace { grid-template-columns: minmax(0,1fr); }
  .br-original-card { position: static; }
  .br-viewer { height: 440px; }
}
@media (max-width: 650px) {
  .br-overview { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .br-upload { flex-direction: column; align-items: stretch; padding: 14px; }
  .br-upload .br-actions { justify-content: flex-end; }
  .br-fields { grid-template-columns: minmax(0,1fr); }
  .br-review-card { padding: 14px; }
  .br-viewer { height: 360px; padding: 12px; }
  .br-heading h2 { font-size: 18px; }
}
/* Thai invoice evidence in document order. */
.br-step-nav { display:flex;flex-wrap:wrap;gap:6px;position:sticky;top:0;background:white;padding:10px 0;z-index:2;border-bottom:1px solid #e2e8f0; }
.br-step-nav a { padding:6px 10px;border-radius:6px;background:#f1f5f9;color:#334155;font-size:11px;text-decoration:none; }
.br-invoice-section { border-bottom:1px solid #e2e8f0;padding:20px 0;scroll-margin-top:65px; }
.br-step-heading { display:flex;align-items:center;gap:10px;margin-bottom:12px; }
.br-step-heading > span { display:grid;place-items:center;background:#0c4a6e;color:white;width:26px;height:26px;border-radius:8px;font-size:12px;flex:none; }
.br-registry-panel,.br-company-target,.br-words-result { background:#f0f9ff;border:1px solid #bae6fd;padding:13px;border-radius:10px;display:flex;flex-direction:column;gap:7px;font-size:12px;overflow-wrap:anywhere; }
.br-registry-panel p,.br-words-result p { margin:0;font-size:11px;line-height:1.7; }
.br-registry-panel small,.br-company-target small,.br-words-result small { color:#64748b;font-size:10px; }
.br-registry-panel button { align-self:flex-start; }
.br-company-target { background:#f8fafc;border-color:#cbd5e1; }
.br-company-target b { font-size:11px;font-weight:500;color:#075985; }
.br-account-lines { display:flex;flex-direction:column;gap:10px;margin:16px 0; }
.br-account-line { padding:12px;background:#fff;border:1px solid #cbd5e1;border-radius:9px; }
.br-account-line > strong { font-size:12px; }
.br-journal { min-width:480px;width:100%;font-size:11px; }
.br-journal td,.br-journal th { padding:10px 8px; }
.br-journal tfoot { background:#f1f5f9; }
.br-approval { scroll-margin-top:65px; }
.br-items { min-width:710px; }
.br-items td:first-child { min-width:210px; }
.br-items td:nth-child(3) { min-width:75px; }
.br-field-confirm { display:flex;align-items:center;gap:6px;color:#475569;font-size:10px; }
.br-field-confirm input { width:13px;height:13px;accent-color:#0284c7; }
@media (min-width: 861px) and (max-width: 1100px) {
  .br-workspace { grid-template-columns:minmax(260px,.8fr) minmax(0,1.4fr);gap:12px; }
  .br-original-card { position:sticky;top:12px; }
  .br-viewer { height:calc(100vh - 200px);min-height:400px;padding:10px; }
  .br-review-card { padding:14px; }
  .br-fields { gap:10px; }
}
.br-issue-details { border:1px solid #fcd34d;background:#fffbeb;border-radius:8px;margin:12px 0;padding:10px; }
.br-issue-details summary { cursor:pointer;color:#92400e;font-size:12px; }
.br-issue-details .br-issues { margin-top:10px; }
.br-vendor-memory { margin-top:12px;padding:13px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc;display:flex;flex-direction:column;gap:9px;font-size:12px; }
.br-vendor-memory .br-section-heading span { font-size:10px;color:#64748b; }
.br-vendor-memory p { margin:0;font-size:11px;line-height:1.7; }
.br-address-compare { margin:0;display:grid;gap:5px;overflow-wrap:anywhere; }
.br-address-compare dt { font-size:10px;color:#64748b; }
.br-address-compare dd { margin:0 0 7px;font-size:11px;line-height:1.7; }
.br-vendor-confirm { padding-top:8px;border-top:1px solid #e2e8f0; }
.br-vendor-confirm summary { cursor:pointer;font-size:12px;color:#075985; }
.br-vendor-confirm > * { margin-top:10px; }
.br-address-book { display:flex;flex-direction:column;gap:8px; }
.br-address-book h4 { margin:2px 0;font-size:12px; }
.br-address-card { background:white;padding:11px;border:1px solid #cbd5e1;border-radius:8px;display:flex;flex-direction:column;gap:6px; }
.br-address-card strong { font-size:11px; }
.br-address-card small { font-size:10px;color:#64748b; }
.br-address-pending { border-color:#fcd34d;background:#fffbeb; }

/* Address comparison is advisory; original OCR remains visible above. */
.br-address-suggestions{margin:18px 0;min-width:0}
.br-address-suggestion{padding:16px;margin:12px 0;border:1px solid #e2e8f0;border-radius:12px;background:#fff;overflow-wrap:anywhere}
.br-address-similar{border-color:#93c5fd;background:#eff6ff}
.br-address-suggestion ul{padding-left:22px}
.br-address-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.br-address-card details{margin-top:12px}

/* Receipt-like amount summary; full verification remains available below. */
.br-amounts .br-field-title small { display: none; }
.br-amounts .br-field > .br-field-note { display: none; }
.br-amounts .br-field-error > .br-field-note { display: block; color: #b91c1c; grid-column: 1 / -1; }
.br-amounts .br-field-review input, .br-amounts .br-field-review select { border-color: #cbd5e1 !important; }
.br-amount-pending { font-size: 11px; color: #92400e; margin: 10px 0 14px; }
.br-amount-alert { padding: 10px 12px; border-radius: 8px; background: #fef2f2; color: #991b1b; font-size: 12px; }
.br-amount-main { border: 1px solid #e2e8f0; border-radius: 12px; padding: 8px 14px; margin: 14px 0; background: #fff; }
.br-amount-main > .br-field { display: grid; grid-template-columns: minmax(0,1fr) minmax(120px,45%); align-items: center; gap: 8px 12px; padding: 8px 32px 8px 0; }
.br-amount-main .br-field-title { padding-right: 0; font-size: 12px; }
.br-amount-main .br-feedback-field { top: 14px; right: 0; }
.br-amount-main input[data-field] { grid-column: 2; font-size: 15px; }
.br-amount-main .br-original-value { grid-column: 1 / -1; }
.br-amount-main .br-total-field { border-top: 1px solid #cbd5e1; margin-top: 8px; padding-top: 14px; padding-bottom: 12px; }
.br-amount-main .br-total-field .br-field-title { font-weight: 600; color: #0f172a; }
.br-amount-main .br-total-field input { background: #f0f9ff; color: #075985; }
.br-amount-main .br-total-field .br-feedback-field { top: 22px; }
.br-amount-words { padding: 2px 0 12px; }
.br-amount-words-status { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #64748b; margin: 8px 0 0; }
.br-amount-words-status svg { width: 16px; height: 16px; flex-shrink: 0; }
.br-amount-words-status.is-match { color: #047857; }
.br-amount-details { border-top: 1px solid #e2e8f0; padding: 12px 0; }
.br-amount-details > summary { cursor: pointer; font-size: 12px; color: #334155; font-weight: 500; line-height: 1.7; }
.br-amount-details > summary > span { display: block; margin-left: 16px; font-size: 10px; color: #64748b; font-weight: 400; }
.br-amount-audit { list-style: none; padding: 0; margin: 10px 0; }
.br-amount-audit li { padding: 10px 0; border-top: 1px solid #f1f5f9; font-size: 11px; }
.br-amount-audit li > span { float: right; color: #64748b; font-size: 10px; }
.br-amount-audit p { color: #92400e; margin: 4px 0 0; line-height: 1.6; }
@media (max-width: 480px) {
  .br-amount-main { padding: 6px 10px; }
  .br-amount-main > .br-field { grid-template-columns: minmax(0,1fr) minmax(110px,48%); gap: 8px; }
  .br-amount-main .br-field-title { font-size: 11px; }
}

.br-amount-pass { display: flex; align-items: center; gap: 7px; font-size: 12px; color: #047857; margin: 12px 0; }
.br-amount-pass svg { width: 17px; height: 17px; flex-shrink: 0; }
.br-amount-alert div { margin-top: 4px; font-size: 11px; }

.br-amount-stale .br-amount-pass, .br-amount-stale .br-amount-alert, .br-amount-stale .br-amount-words-status { display: none; }
.br-amount-recheck { font-size: 12px; color: #92400e; }

.br-amount-main select[data-field] { grid-column: 2; font-size: 12px; min-width: 0; }

.br-session-dialog { border: 1px solid #cbd5e1; border-radius: 16px; padding: 24px; width: min(440px, calc(100vw - 32px)); color: #0f172a; font-family: Kanit, sans-serif; }
.br-session-dialog::backdrop { background: rgba(15,23,42,.45); }
.br-session-dialog label { display: grid; gap: 6px; margin: 14px 0; }
.br-session-dialog input { padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; font: inherit; width: 100%; box-sizing: border-box; }
.br-session-dialog p { font-size: 13px; line-height: 1.7; }
.br-session-dialog [data-error] { color: #b91c1c; }

.bill-review [data-session][hidden] { display: none; }