body {
  background: #f7f8fa;
}

main {
  background: #fff;
  min-height: calc(100vh - 56px);
}

.table {
  background: #fff;
}

.invoice-preview {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #d7dde5;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  min-height: 520px;
  overflow: hidden;
}

.review-header,
.review-panel,
.review-document-pane,
.review-side-pane,
.documents-header,
.documents-table-panel,
.ai-work-header,
.ai-work-panel,
.ai-work-summary-card {
  background: #fff;
  border: 1px solid #d7dde5;
  border-radius: 6px;
  padding: 1rem;
}

.review-document-pane {
  position: sticky;
  top: 72px;
}

.review-side-pane {
  max-height: calc(max(65vh, 520px) + 4.25rem);
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.review-nav .btn.disabled {
  pointer-events: none;
}

.review-stepper {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

.review-stepper-item {
  align-items: flex-start;
  border-top: 3px solid #d7dde5;
  display: flex;
  gap: 0.55rem;
  padding-top: 0.65rem;
}

.review-stepper-marker {
  align-items: center;
  background: #f1f3f5;
  border: 1px solid #d7dde5;
  border-radius: 50%;
  color: #526071;
  display: inline-flex;
  flex: 0 0 1.6rem;
  font-size: 0.85rem;
  font-weight: 700;
  height: 1.6rem;
  justify-content: center;
  width: 1.6rem;
}

.review-stepper-label {
  font-size: 0.875rem;
  font-weight: 600;
}

.review-stepper-status,
.review-stepper-time {
  color: #526071;
  font-size: 0.75rem;
}

.review-stepper-completed {
  border-top-color: #198754;
}

.review-stepper-completed .review-stepper-marker {
  background: #e9f7ef;
  border-color: #198754;
  color: #198754;
}

.review-stepper-processing {
  border-top-color: #0d6efd;
}

.review-stepper-processing .review-stepper-marker {
  background: #eef6ff;
  border-color: #0d6efd;
  color: #0d6efd;
}

.review-stepper-review_required,
.review-stepper-skipped {
  border-top-color: #ffc107;
}

.review-stepper-review_required .review-stepper-marker,
.review-stepper-skipped .review-stepper-marker {
  background: #fff8e1;
  border-color: #d39e00;
  color: #8a6500;
}

.review-stepper-failed {
  border-top-color: #dc3545;
}

.review-stepper-failed .review-stepper-marker {
  background: #fdecec;
  border-color: #dc3545;
  color: #dc3545;
}

.review-stepper-not_required {
  border-top-color: #adb5bd;
}

.review-stepper-not_required .review-stepper-marker {
  background: #f8f9fa;
  border-color: #adb5bd;
  color: #526071;
}

.ocr-stage-details summary {
  color: #526071;
  cursor: pointer;
  font-size: 0.75rem;
}

.review-field-section {
  border-top: 1px solid #e5e9ef;
  padding-top: 1rem;
}

.review-field-section + .review-field-section {
  margin-top: 1rem;
}

.review-section-title {
  color: #526071;
  margin-bottom: 0.85rem;
  text-transform: none;
}

.review-field details summary,
.review-details details summary {
  cursor: pointer;
}

.documents-summary {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
}

.document-stat {
  background: #fff;
  border: 1px solid #d7dde5;
  border-radius: 6px;
  padding: 0.85rem 1rem;
}

.document-stat-label {
  color: #526071;
  font-size: 0.8rem;
  font-weight: 600;
}

.document-stat-value {
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.2;
}

.documents-filter-bar {
  align-items: end;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(14rem, 1fr) minmax(10rem, 13rem) minmax(10rem, 13rem) auto;
}

.documents-filter-bar .form-label {
  color: #526071;
  font-size: 0.85rem;
  font-weight: 600;
}

.documents-filter-actions {
  display: flex;
  gap: 0.5rem;
}

.documents-table thead th {
  color: #526071;
  font-size: 0.82rem;
  text-transform: uppercase;
}

.documents-table tbody tr:hover {
  background: #f8fafc;
}

.documents-row-review {
  border-left: 4px solid #ffc107;
}

.document-name {
  font-weight: 600;
  max-width: 32rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.documents-empty-state {
  padding: 3rem 1rem;
  text-align: center;
}

.ai-work-summary-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
}

.ai-work-summary-label {
  color: #526071;
  font-size: 0.8rem;
  font-weight: 600;
}

.ai-work-summary-value {
  font-size: 1rem;
  font-weight: 700;
}

.ai-compare-selector-grid {
  align-items: end;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(14rem, 1fr) minmax(14rem, 1fr) minmax(8rem, 10rem);
}

.ai-compare-table {
  min-width: 760px;
  table-layout: fixed;
}

.ai-compare-table th:first-child {
  width: 15%;
}

.ai-compare-table td,
.ai-compare-table th {
  overflow-wrap: anywhere;
  vertical-align: top;
}

.ai-compare-evidence {
  margin-top: 0.2rem;
  max-width: 28rem;
}

.ai-work-field-table thead th {
  color: #526071;
  font-size: 0.82rem;
  text-transform: uppercase;
}

.ai-work-review-row {
  border-left: 4px solid #ffc107;
}

.ai-work-code-block {
  max-height: 360px;
}

.ai-work-candidate-group {
  border-top: 1px solid #e5e9ef;
  padding: 0.75rem 0;
}

.ai-work-candidate-group summary {
  cursor: pointer;
}

.ai-work-score {
  height: 0.35rem;
  max-width: 7rem;
}

.invoice-preview-empty {
  min-height: 320px;
  padding: 1.5rem;
  text-align: center;
}

.invoice-preview iframe,
.invoice-preview img {
  border: 0;
  display: block;
  height: 65vh;
  max-height: 900px;
  min-height: 520px;
  width: 100%;
}

.invoice-preview img {
  height: auto;
  max-height: 900px;
  object-fit: contain;
}

.processing-status {
  background: #eef6ff;
  border: 1px solid #b8d9ff;
  border-radius: 6px;
  margin-bottom: 1rem;
  padding: 0.9rem 1rem;
}

.processing-timeline {
  list-style: none;
  padding-left: 0;
}

.processing-step {
  border-left: 4px solid #d7dde5;
  padding: 0.55rem 0 0.55rem 0.8rem;
}

.processing-step-completed {
  border-left-color: #198754;
}

.processing-step-processing {
  border-left-color: #0d6efd;
}

.processing-step-review_required,
.processing-step-skipped {
  border-left-color: #ffc107;
}

.processing-step-failed {
  border-left-color: #dc3545;
}

.form-control.is-warning {
  border-color: #d39e00;
  padding-right: calc(1.5em + 0.75rem);
}

.form-control.is-warning:focus {
  border-color: #d39e00;
  box-shadow: 0 0 0 0.25rem rgba(211, 158, 0, 0.18);
}

.field-warning-feedback {
  color: #8a6500;
  font-size: 0.875em;
  margin-top: 0.25rem;
}

.evidence-line,
.field-evidence {
  overflow-wrap: anywhere;
}

.audit-details {
  display: grid;
  gap: 0.15rem 0.5rem;
  grid-template-columns: max-content minmax(12rem, 1fr);
}

.audit-details dt {
  color: #526071;
  font-weight: 600;
}

.audit-details dd {
  margin-bottom: 0;
  overflow-wrap: anywhere;
}

.ai-work-pre {
  background: #f6f8fb;
  border: 1px solid #d7dde5;
  border-radius: 6px;
  color: #1f2933;
  font-size: 0.875rem;
  max-height: 420px;
  overflow: auto;
  padding: 0.85rem;
  white-space: pre-wrap;
}

.text-diff-block {
  line-height: 1.55;
}

.text-diff {
  border-radius: 3px;
  color: inherit;
  padding: 0 0.12rem;
}

.diff-delete {
  background: #ffd7d7;
  box-shadow: inset 0 -1px 0 #dc3545;
}

.diff-insert {
  background: #d9f2df;
  box-shadow: inset 0 -1px 0 #198754;
}

.ai-work-source {
  max-width: 24rem;
  overflow-wrap: anywhere;
}

.ai-work-details {
  border-top: 1px solid #e5e9ef;
  padding: 0.65rem 0;
}

.ai-work-details summary {
  cursor: pointer;
  font-weight: 600;
}

@media (max-width: 991.98px) {
  .review-document-pane {
    position: static;
  }

  .review-side-pane {
    max-height: none;
    overflow-y: visible;
  }

  .invoice-preview,
  .invoice-preview iframe,
  .invoice-preview img {
    min-height: 420px;
  }
}

@media (max-width: 767.98px) {
  .documents-filter-bar {
    grid-template-columns: 1fr;
  }

  .ai-compare-selector-grid {
    grid-template-columns: 1fr;
  }

  .documents-filter-actions {
    justify-content: flex-start;
  }
}
.evaluation-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: 1rem;
  align-items: end;
}
.evaluation-filter-grid, .evaluation-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  gap: 1rem;
  align-items: end;
}
.evaluation-control { min-width: 0; }
.evaluation-control .form-label { font-size: .8rem; color: #64748b; font-weight: 600; }
.evaluation-control .form-control, .evaluation-control .form-select,
.evaluation-action { min-height: 42px; }
.evaluation-history .table { vertical-align: middle; }
.evaluation-history .table th { background: #f5f7fa; color: #475569; white-space: nowrap; padding: .75rem; }
.evaluation-history .table td { padding: .75rem; }
.evaluation-history-table { min-width: 1050px; }
.evaluation-history-table td:first-child { min-width: 220px; overflow-wrap: anywhere; }
.evaluation-history-table td:nth-child(n+5):nth-child(-n+7),
.evaluation-history-table th:nth-child(n+5):nth-child(-n+7) { text-align: right; font-variant-numeric: tabular-nums; }
.evaluation-result-table { min-width: 600px; table-layout: fixed; }
.evaluation-result-table td { overflow-wrap: anywhere; }
.evaluation-result-table th:first-child, .evaluation-result-table td:first-child { width: 34%; }
.evaluation-result-table th:not(:first-child), .evaluation-result-table td:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.evaluation-path-panel h4 { margin-bottom: 1rem; font-weight: 700; }
.evaluation-path-panel details { border: 1px solid #dee2e6; border-radius: .5rem; padding: 1rem; }
.evaluation-path-panel summary { cursor: pointer; color: #0d6efd; font-weight: 600; }
.evaluation-path-panel details[open] summary { margin-bottom: 1rem; }
.evaluation-path-panel details .form-select { margin-bottom: 1rem; }
.evaluation-path-panel details .table { table-layout: auto; }
.evaluation-path-panel details .table th, .evaluation-path-panel details .table td { text-align: left; }
#evaluation-message:empty { display: none; }
@media (max-width: 991px) {
  .evaluation-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evaluation-form-grid .evaluation-action { grid-column: 1 / -1; }
}
@media (max-width: 575px) {
  .evaluation-form-grid, .evaluation-filter-grid, .evaluation-compare-grid { grid-template-columns: 1fr; }
}
