/* ===== Document Definition — Parser tab ===== */

.dd-parser-layout {
    display: flex;
    flex-direction: column;
    min-height: 70vh;
    height: 100%;
    padding: 8px 4px 4px;
    box-sizing: border-box;
    gap: 4px;
}

.dd-parser-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* Source cell body: viewer fills it, no padding */
.dd-source-body {
    padding: 0 !important;
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
}

/* PDF viewer fills its view panel */
.aipdf-ext-view .docv-viewer {
    flex: 1;
    min-height: 0;
}

/* Markdown viewer widget fills its view panel */
.aipdf-ext-view .aipdf-md-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

/* aipdf-ext-md-body (markdown body) inside the viewer */
.aipdf-md-wrap .aipdf-ext-md-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0;
}

/* CodeEditor (Serenity widget) inside aipdf-cm-host */
.aipdf-cm-host .s-CodeEditor {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.aipdf-cm-host .CodeMirror {
    flex: 1;
    height: 100% !important;
    max-height: none !important;
}

.aipdf-cm-host .CodeMirror-scroll {
    max-height: none !important;
}

/* Bottom row needs a minimum height in dialog context */
.dd-parser-layout .aipdf-ext-bottom-row {
    min-height: 300px;
    flex: 1;
}

/* Parser tab: initial pane sizes (overridable at runtime by collapse toggles) */
.dd-parser-top-pane {
    height: 60%;
}

/* Specificity bumped (combined with .docv-ext-cell) to override
   `.aipdf-ext-bottom-row > .docv-ext-cell { flex: 1 }` in pdf-parser.css. */
.docv-ext-cell.dd-parser-prompt-pane {
    flex: none;
    width: 50%;
    min-width: 120px;
}

/* ===== Mapping tab — toolbar & log ===== */

.dd-mapping-target-label,
.dd-mapping-array-label {
    margin-right: 6px;
    font-weight: 600;
}

.dd-mapping-array-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.dd-mapping-array-label input[type="checkbox"] {
    margin: 0;
}

.dd-mapping-target-input {
    width: 220px;
    display: inline-block;
    margin-right: 6px;
}

.dd-mapping-log {
    margin: 0;
    padding: 8px 12px;
    font-family: Consolas, 'Courier New', monospace;
    font-size: 12px;
    white-space: pre-wrap;
    word-break: break-word;
    overflow: auto;
    height: 100%;
    box-sizing: border-box;
}

.dd-mapping-log-error {
    color: #c0392b;
    font-weight: bold;
}

/* ===== Details tab — PDF upload ===== */

.dd-upload-container {
    margin-top: 8px;
}

/* Disabled state for dropzone in view mode */
.aipdf-dropzone-disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}

/* Hover / drag-over highlight (explicit values — CSS vars may not be in scope here) */
.dd-upload-container .aipdf-dropzone:not(.aipdf-dropzone-disabled):hover,
.dd-upload-container .aipdf-dropzone.drag-over {
    border-color: #3e8ed0;
    background: rgba(62, 142, 208, 0.08);
}

/* File info row shown after upload */
.dd-upload-file-row {
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    font-size: 13px;
}

.dd-upload-file-icon {
    color: #c0392b;
    font-size: 16px;
    flex-shrink: 0;
}

.dd-upload-filename {
    flex: 1;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== Sync-anchor highlight (field grounding) =====
   Every server-injected anchor span carries class="docv-anchor" so the
   persistent yellow box is visible immediately on render — no JS pass needed.
   Clicking a field adds .sync-highlight on top to make that single anchor
   the more prominent "active" state.                                         */

.docv-anchor {
    background-color: transparent;
    border: 2px solid rgba(255, 230, 0, 0.85);
    border-radius: 2px;
    padding: 1px 3px;
    transition: background-color 0.3s ease, outline 0.3s ease, border-color 0.3s ease;
}

/* Clicked anchor: thinner 1px border + red fill; the surrounding fields stay 2px. */
.docv-anchor.sync-highlight {
    background-color: rgba(220, 0, 0, 0.25);
    border-width: 1px;
    border-color: rgba(200, 0, 0, 0.7);
    outline: none;
}

/* Legacy text-search match (resolveHighlight tiers 2/3) wraps non-anchored
   text in a span with .sync-highlight (raw markdown mode has no persistent
   anchors, so only the clicked match shows). 1px border + a little padding. */
.sync-highlight:not(.docv-anchor) {
    background-color: rgba(220, 0, 0, 0.25);
    border: 1px solid rgba(200, 0, 0, 0.7);
    border-radius: 2px;
    padding: 1px 3px;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* ===== Right-click context menu (Generate Extraction Rule) ===== */

.dd-ctx-menu {
    position: fixed;
    z-index: 9999;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 4px 0;
    min-width: 210px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.45);
    user-select: none;
}

.dd-ctx-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 13px;
    color: var(--text);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.12s;
}

.dd-ctx-menu-item:hover:not(.disabled) {
    background: var(--accent-dim);
}

.dd-ctx-menu-item.disabled {
    opacity: 0.45;
    cursor: default;
}

/* ===== Rule preview dialog ===== */

.dd-rule-preview-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0,0,0,0.55);
    display: flex;
    align-items: center;
    justify-content: center;
}

.dd-rule-preview-dialog {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    width: min(560px, 92vw);
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0,0,0,0.55);
}

.dd-rule-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px 10px;
    border-bottom: 1px solid var(--border);
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.dd-rule-preview-close {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 16px;
    padding: 0 4px;
    line-height: 1;
}

.dd-rule-preview-close:hover {
    color: var(--text);
}

.dd-rule-preview-body {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.dd-rule-preview-label {
    font-size: 12px;
    color: var(--text-muted);
}

.dd-rule-preview-textarea {
    width: 100%;
    min-height: 160px;
    background: var(--bg-input);
    border: 1px solid var(--border);
    border-radius: 5px;
    color: var(--text);
    font-family: 'Cascadia Code', 'Fira Mono', monospace;
    font-size: 12px;
    line-height: 1.6;
    padding: 10px 12px;
    resize: vertical;
    box-sizing: border-box;
}

.dd-rule-preview-textarea:focus {
    outline: none;
    border-color: var(--accent);
}

.dd-rule-preview-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px 14px;
    border-top: 1px solid var(--border);
}

/* ===== Busy overlay (dialog-scoped) ===== */

.dd-busy-overlay {
    position: absolute;
    inset: 0;
    z-index: 8000;
    background: rgba(0,0,0,0.25);
    cursor: wait;
}

/* Tier-4 fallback: page-level border flash */
.sync-highlight-flash {
    animation: sync-flash-anim 0.6s ease 3;
}

@keyframes sync-flash-anim {
    0%   { box-shadow: none; }
    50%  { box-shadow: 0 0 0 3px #f0a500; }
    100% { box-shadow: none; }
}

/* ===== CSV grids — highlight + index column =====
   Shared by the source grid (CsvDocumentView) and the result grid
   (CsvResultGridView); both are sleekgrid, so one rule styles both. */
/* Yellow to match the PDF viewer's field highlights (#FFE066 / #E0B400). */
.slick-cell.dd-csv-cell-highlight {
    background-color: rgba(255, 224, 102, 0.35);
    box-shadow: inset 0 0 0 1px rgba(224, 180, 0, 0.85);
}

.slick-cell.dd-csv-row-highlight {
    background-color: rgba(255, 224, 102, 0.20);
}

/* Search matches — amber/gold to match the PDF/markdown search highlight,
   distinct from the yellow click-highlight above. The active match is brighter
   with an inset outline. (CsvDocumentView applies these via cell CSS styles.) */
.slick-cell.dd-csv-search-match {
    background-color: rgba(181, 137, 0, 0.45);
}

.slick-cell.dd-csv-search-active {
    background-color: rgba(212, 160, 23, 0.75);
    box-shadow: inset 0 0 0 2px #fff;
}

/* Leading # index column — muted, right-aligned, acts as the row-click target. */
.slick-cell.dd-csv-rg-idx-cell {
    color: var(--bs-secondary-color, #8a8a8a);
    text-align: right;
    background: rgba(255, 255, 255, 0.03);
}

.slick-header-column.dd-csv-rg-idx-hdr {
    text-align: right;
}

/* Plain section label shown only when a result has multiple grid sections. */
.dd-csv-rg-label {
    font-weight: 600;
    padding: 6px 8px 2px;
    color: var(--bs-body-color, #ddd);
}

/* Result-grid placeholder / raw fallback. */
.dd-csv-rg-empty {
    padding: 12px;
    color: var(--bs-secondary-color, #888);
}

.dd-csv-rg-raw {
    margin: 0;
    padding: 12px;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ===== Validation Results Table ===== */

.dd-validation-results-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    padding: 0;
}

.dd-vr-placeholder {
    color: #888;
    font-style: italic;
    padding: 24px 16px;
    text-align: center;
}

.dd-vr-summary {
    display: flex;
    flex: 0 0 auto;
    gap: 16px;
    padding: 8px 12px;
    border-bottom: 1px solid #e0e0e0;
    background: #fafafa;
    font-size: 13px;
    font-weight: 500;
}

.dd-vr-summary-pass {
    color: #1e7e34;
}

.dd-vr-summary-fail {
    color: #c62828;
}

.dd-vr-summary-total {
    color: #555;
    margin-left: auto;
}

.dd-validation-results-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
    line-height: 1.4;
}

.dd-validation-results-table thead {
    background: #f5f5f5;
    position: sticky;
    top: 0;
    z-index: 1;
}

.dd-validation-results-table th {
    padding: 6px 10px;
    text-align: left;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    color: #555;
    border-bottom: 2px solid #ddd;
}

.dd-validation-results-table td {
    padding: 6px 10px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

.dd-validation-results-table tr.dd-vr-pass {
    background: #e6f4ea;
}

.dd-validation-results-table tr.dd-vr-pass:hover {
    background: #d0ecd6;
}

.dd-validation-results-table tr.dd-vr-fail {
    background: #fce8e6;
}

.dd-validation-results-table tr.dd-vr-fail:hover {
    background: #f8d7d4;
}

.dd-vr-icon-pass {
    color: #1e7e34;
    font-size: 14px;
}

.dd-vr-icon-fail {
    color: #c62828;
    font-size: 14px;
}

.dd-vr-col-status {
    width: 50px;
    text-align: center;
}

.dd-vr-col-field {
    font-weight: 500;
    font-family: 'Consolas', 'Courier New', monospace;
}

.dd-vr-col-rule {
    width: 120px;
}

.dd-vr-rule-badge {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 3px;
    background: #e8eaed;
    font-size: 11px;
    font-family: 'Consolas', 'Courier New', monospace;
    color: #444;
}

.dd-vr-col-value {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 11.5px;
}

.dd-vr-null {
    color: #999;
    font-style: italic;
}

.dd-vr-col-message {
    color: #555;
}

.dd-vr-col-link {
    width: 40px;
    text-align: center;
}

.dd-vr-link {
    color: #1a73e8;
    text-decoration: none;
    font-size: 13px;
}

.dd-vr-link:hover {
    color: #0d47a1;
    text-decoration: underline;
}

/* --- Validation: generated tests list + run result codes --- */
.dd-vr-tests-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  padding: 0;
}

/* Host for the CSV-style sleekgrid in the Tests / Results panels. */
.dd-vr-grid-host {
  flex: 1 1 auto;
  min-height: 120px;
  position: relative;
}

.dd-vr-tests-header {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
  padding: 6px 8px;
  font-size: 12px;
}

.dd-vr-code-badge {
  display: inline-block;
  min-width: 48px;
  text-align: center;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
}

.dd-vr-code-pass {
  background: #2e7d32;
}

.dd-vr-code-fail {
  background: #c62828;
}

.dd-vr-code-warn {
  background: #ef6c00;
}

.dd-vr-code-error {
  background: #6a1b9a;
}

.dd-vr-code-ignore {
  background: #757575;
}