/*
 * ingestion-modals.css — ingestion review/mapping modals + the grid advisory strip.
 * (Renamed 2026-08-05 from css/data-input.css, which collided by name with
 * css/pages/data-input.css and was a standing source of "which file owns this?".)
 *
 * Home for CSS that used to be injected from JavaScript. Loaded on data-input.html
 * only, AFTER the brand design system (tokens.css → chrome.css → app.css →
 * pages/data-input.css).
 *
 * OWNERSHIP — the two files are disjoint, verified 2026-08-05 (zero shared selectors):
 *   THIS file            .cell-invalid/.row-rejected  ·  .ingm-*  ·  .ingx-*
 *   pages/data-input.css page layout + the Treasury register components
 *
 * Styling rule: use the brutalist brand tokens (tokens.css). Layout keeps the old
 * `--color-*` aliases (app.css maps them onto the brand + flips them under
 * [data-theme]); semantic status colours use --neg / --green / --orange / --blue so
 * they flip too, and radii/shadow/type use --r-* / --sh-lg / --font-sans.
 * No hardcoded hex — it can't theme.
 *
 * Bump the ?v= on the <link> in data-input.html when editing, or browsers serve stale CSS.
 */

/* ============================================================================
 * Grid cell/row validation state (the .grid-advisory panel under each table was
 * removed 2026-08-10 — findings now mark the row and the offending cell directly)
 * ==========================================================================*/
.cell-invalid { box-shadow: inset 0 -2px 0 var(--neg); }
.cell-invalid input, .cell-invalid select { border-color: var(--neg); }

/* ============================================================================
 * Import mapping modal (was CSS in ingestion-mapping.js)
 * ==========================================================================*/
.ingm-overlay { position: fixed; inset: 0; background: rgba(17,17,17,.55); display: flex; align-items: center; justify-content: center; z-index: 10000; font-family: var(--font-sans); font-size: 14px; line-height: 1.45; color: var(--color-text); }
.ingm-modal { background: var(--color-surface); width: min(1120px,96vw); max-height: 90vh; border-radius: var(--r-lg); box-shadow: var(--sh-lg); display: flex; flex-direction: column; overflow: hidden; }
.ingm-head { padding: 16px 20px; border-bottom: 1px solid var(--color-border); }
.ingm-head h2 { margin: 0 0 4px; font-size: 16px; font-weight: 650; font-family: var(--font-display); }
.ingm-head p { margin: 0; font-size: 12.5px; color: var(--color-text-secondary); }
.ingm-body { padding: 8px 20px; overflow: auto; }
.ingm-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
.ingm-row:last-child { border-bottom: none; }
.ingm-field { flex: 0 0 160px; font-weight: 600; }
.ingm-arrow { color: var(--color-text-secondary); }
.ingm-source { flex: 1; color: var(--color-text); }
.ingm-conf { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: var(--r-sm); margin-left: 6px; border: 1px solid transparent; }
.ingm-conf.medium { background: var(--bone-2); color: var(--orange-deep); border-color: var(--orange); }
.ingm-conf.low { background: var(--bone-2); color: var(--neg); border-color: var(--neg); }
.ingm-conf.matched { background: var(--bone-2); color: var(--green-3); border-color: var(--green); }
.ingm-conf.verify { background: var(--bone-2); color: var(--orange-deep); border-color: var(--orange); }
.ingm-select { border: 1px solid var(--color-border); border-radius: var(--r-sm); padding: 5px 8px; font-family: inherit; font-size: 13px; line-height: 1.3; min-width: 160px; }
.ingm-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--color-border); background: var(--color-tertiary-bg); }
.ingm-btn { border: 1px solid var(--color-border); background: var(--color-surface); padding: 8px 16px; border-radius: var(--r-md); font-weight: 600; cursor: pointer; }
.ingm-btn.primary { background: var(--color-primary); border-color: var(--color-primary); color: var(--lime-ink); }
.ingm-preview { margin: 4px 0 10px; border: 1px solid var(--color-border); border-radius: var(--r-md); overflow: auto; max-height: 200px; }
.ingm-preview table { border-collapse: collapse; font-size: 12px; white-space: nowrap; }
.ingm-preview th, .ingm-preview td { border: 1px solid var(--color-border); padding: 4px 8px; text-align: left; max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.ingm-preview th { background: var(--color-tertiary-bg); font-weight: 650; position: sticky; top: 0; color: var(--color-text); }
.ingm-preview td { color: var(--color-text-secondary); }
.ingm-preview-cap { font-size: 11.5px; color: var(--color-text-secondary); margin: 2px 0 4px; }
.ingm-th-src { display: block; font-weight: 400; font-size: 10.5px; color: var(--color-text-secondary); margin-top: 2px; }
.ingm-note { margin: 8px 0 2px; padding: 8px 10px; border-radius: var(--r-md); background: var(--bone-2); border: 1px solid var(--blue); color: var(--blue); font-size: 12.5px; }
.ingm-row.ingm-flash { background: var(--bone-2); transition: background-color .3s; }
.ingm-mapped { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--color-border); }
.ingm-showall { border: 0; background: transparent; color: var(--color-primary); font-weight: 600; font-size: 12.5px; cursor: pointer; padding: 8px 0; }
.ingm-showall:hover { text-decoration: underline; }
.ingm-extra[hidden] { display: none; }
/* Header-mapper grid: each preview column header carries the field label + a click-to-edit column mapper. */
.ingm-colhead { display: flex; align-items: center; gap: 6px; font-weight: 650; white-space: nowrap; margin-bottom: 5px; }
.ingm-colmap-label { border: 0; background: transparent; color: var(--color-primary); cursor: pointer; font-family: inherit; font-size: 11.5px; font-weight: 600; padding: 2px 0; white-space: nowrap; }
.ingm-colmap-label:hover { text-decoration: underline; }
.ingm-edit-ic { opacity: .55; }
.ingm-colmap .ingm-select { min-width: 130px; }
.ingm-preview th { vertical-align: top; }

/* ============================================================================
 * Import review modal (was CSS in ingestion-review.js)
 * ==========================================================================*/
.ingx-overlay { position: fixed; inset: 0; background: rgba(17,17,17,.55); display: flex; align-items: center; justify-content: center; z-index: 10000; font-family: var(--font-sans); font-size: 14px; line-height: 1.45; color: var(--color-text); }
.ingx-modal { background: var(--color-surface); width: min(1280px,96vw); max-height: 90vh; border-radius: var(--r-lg); box-shadow: var(--sh-lg); display: flex; flex-direction: column; overflow: hidden; }
.ingx-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--color-border); }
.ingx-head h2 { margin: 0; font-size: 16px; font-weight: 650; font-family: var(--font-display); }
.ingx-x { border: 0; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: var(--color-text-secondary); padding: 4px 8px; border-radius: var(--r-sm); }
.ingx-x:hover { background: var(--color-secondary-bg); color: var(--color-text); }
.ingx-body { padding: 16px 20px; overflow: auto; }
.ingx-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--color-border); background: var(--color-tertiary-bg); }
.ingx-btn { border: 1px solid var(--color-border); background: var(--color-surface); padding: 8px 16px; border-radius: var(--r-md); font-weight: 600; cursor: pointer; }
.ingx-btn:hover { background: var(--color-secondary-bg); }
.ingx-btn.primary { background: var(--color-primary); border-color: var(--color-primary); color: var(--lime-ink); }
.ingx-btn.primary:hover { background: var(--color-primary-hover); }
.ingx-btn:disabled { opacity: .5; cursor: not-allowed; }
.ingx-sec { font-weight: 650; margin: 20px 0 12px; font-size: 16px; letter-spacing: -.01em; color: var(--color-text); font-family: var(--font-display); }
.ingx-empty { color: var(--color-text-secondary); padding: 20px; text-align: center; }
.ingx-loading { padding: 40px; text-align: center; color: var(--color-text-secondary); }
.ingx-fixrow-fields { display: flex; flex-wrap: nowrap; gap: 10px; align-items: flex-end; overflow-x: auto; padding-bottom: 8px; }
.ingx-fixfield { display: flex; flex-direction: column; gap: 2px; margin: 4px 0; flex: 0 0 auto; min-width: 120px; max-width: 190px; }
.ingx-fixfield label { font-size: 11px; color: var(--color-text-secondary); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ingx-fixfield .ingx-fixval { font-size: 13px; color: var(--color-text); padding: 3px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ingx-fixfield input, .ingx-fixfield select { width: 100%; box-sizing: border-box; }
.ingx-fixfield input { border: 1px solid var(--color-border); border-radius: var(--r-sm); padding: 5px 8px; font-family: inherit; font-size: 13px; line-height: 1.3; background: var(--color-surface); }
.ingx-fixfield select, .ingx-fixfield input[type=date] { border: 1px solid var(--color-border); border-radius: var(--r-sm); padding: 5px 8px; font-family: inherit; font-size: 13px; line-height: 1.3; background: var(--color-surface); }
.ingx-fixfield input:focus { outline: 2px solid var(--color-primary); outline-offset: 1px; border-color: var(--color-primary); }
.ingx-fixfield.err label { color: var(--neg); }
.ingx-fixfield.err input { border-color: var(--neg); background: var(--color-surface); }
.ingx-fixfield.err select, .ingx-fixfield.err input[type=date] { border-color: var(--neg); }
.ingx-fixfield.rel label { color: var(--orange-deep); }
.ingx-fixfield.rel select, .ingx-fixfield.rel input { border-color: var(--orange); }
.ingx-fixfield .msg { font-size: 11px; color: var(--neg); }
.ingx-fixfield .msg.rel { color: var(--orange-deep); }
.ingx-recheck-bar { display: flex; align-items: center; gap: 10px; margin: 10px 0 4px; padding: 10px 12px; background: var(--bone-2); border: 1px solid var(--orange); border-radius: var(--r-md); }
.ingx-recheck-bar .note { font-size: 12.5px; color: var(--orange-deep); flex: 1; }
.ingx-rccy-bar { background: var(--bone-2); border-color: var(--blue); margin: 0 0 14px; }
.ingx-rccy-bar .note { color: var(--blue); }
.ingx-rccy-label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--blue); white-space: nowrap; }
.ingx-rccy { border: 1px solid var(--blue); border-radius: var(--r-sm); padding: 5px 8px; font-family: inherit; font-size: 13px; line-height: 1.3; background: var(--color-surface); }
.ingx-map { margin: 6px 0 12px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-tertiary-bg); font-size: 12.5px; }
.ingx-map-title { font-weight: 650; color: var(--color-text-secondary); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .03em; font-size: 11px; }
.ingx-map-list { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.ingx-map-item { color: var(--color-text); }
.ingx-map-item b { color: var(--color-text); }
.ingx-map-conf { color: var(--orange-deep); font-weight: 600; }
.ingx-map-note { color: var(--color-text-secondary); margin-top: 5px; }
.ingx-map-miss { color: var(--neg); margin-top: 5px; font-weight: 600; }
.ingx-map-actions { margin-top: 8px; }
.ingx-map-actions .ingx-btn { padding: 5px 12px; font-size: 12px; }
.ingx-strip { display: flex; align-items: center; gap: 14px; margin: 4px 0 16px; }
.ingx-meter { flex: 1; height: 8px; border-radius: var(--r-sm); background: var(--color-border); overflow: hidden; display: flex; }
.ingx-meter i { display: block; height: 100%; }
.ingx-meter .seg-ok { background: var(--green); }
.ingx-meter .seg-warn { background: var(--orange); }
.ingx-meter .seg-bad { background: var(--neg); }
.ingx-legend { display: flex; gap: 14px; font-size: 12.5px; color: var(--color-text-secondary); white-space: nowrap; }
.ingx-legend b { color: var(--color-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.ingx-ready-line { font-size: 13px; color: var(--green-3); margin: 2px 0 12px; }
.ingx-allgood { font-size: 14px; color: var(--green-3); background: var(--bone-2); border: 1px solid var(--green); border-radius: var(--r-md); padding: 12px 14px; margin: 8px 0; }
.ingx-issues { display: flex; flex-direction: column; gap: 12px; }
.ingx-issue { border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 14px 16px; background: var(--color-surface); }
.ingx-issue.err { border-color: var(--neg); background: var(--color-surface); }
.ingx-issue.warn { border-color: var(--orange); background: var(--color-surface); }
.ingx-issue-head { display: flex; align-items: flex-start; gap: 10px; }
.ingx-issue-icon { flex: 0 0 24px; height: 24px; border-radius: var(--r-sm); display: grid; place-items: center; font-weight: 700; font-size: 14px; color: #fff; }
.ingx-issue.err .ingx-issue-icon { background: var(--neg); }
.ingx-issue.warn .ingx-issue-icon { background: var(--orange); }
.ingx-issue-title { font-size: 14px; color: var(--color-text); line-height: 1.4; }
.ingx-issue-title b { font-weight: 650; }
.ingx-issue-count { display: inline-block; margin-left: 8px; font-size: 11.5px; font-weight: 600; color: var(--color-text-secondary); background: var(--color-border); border-radius: var(--r-sm); padding: 2px 9px; vertical-align: middle; }
.ingx-issue-acts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 12px 0 0; padding-left: 34px; }
.ingx-bulkset { display: inline-flex; gap: 6px; }
.ingx-valfixers { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 0; padding-left: 34px; }
.ingx-valfix { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ingx-valfix-tag { font-size: 13px; color: var(--color-text); font-weight: 600; min-width: 120px; }
.ingx-valfix-tag em { font-style: normal; font-weight: 500; color: var(--color-text-secondary); font-size: 12px; }
.ingx-bulk-input { border: 1px solid var(--color-border); border-radius: var(--r-sm); padding: 6px 9px; font-family: inherit; font-size: 13px; line-height: 1.3; min-width: 210px; }
.ingx-bulk-input:focus { outline: 2px solid var(--color-primary); outline-offset: 1px; border-color: var(--color-primary); }
.ingx-btn.ingx-link { border: 0; background: transparent; color: var(--color-primary); padding: 6px 4px; }
.ingx-btn.ingx-link:hover { background: transparent; text-decoration: underline; }
.ingx-issue-rows { margin: 12px 0 0; padding: 12px 0 2px; border-top: 1px dashed var(--color-border); display: flex; flex-direction: column; gap: 12px; }
.ingx-drill { display: block; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-tertiary-bg); }
.ingx-drill-num { display: block; font-size: 11.5px; color: var(--color-text-secondary); margin-bottom: 6px; font-weight: 600; }
.ingx-ready-panel { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--color-border); }
select.ingx-bulk-input { background: var(--color-surface); }

/* Blocking variant of .ingm-note: an unmapped required field stops the mapping step (Apply is disabled). */
.ingm-note.ingm-req { border-color: var(--neg); color: var(--neg); }

/* Non-blocking variant: a required field the file has no column for, but which carries a contract
   default. Offers "use this value for every row" so the import is not a dead end. Distinct from
   .ingm-req — that one stops Apply, this one never does. */
.ingm-const-head { margin-bottom: 6px; }
.ingm-const-row { display: flex; align-items: center; gap: 8px; margin-top: 5px; }
.ingm-const-row > span { flex: 0 0 150px; font-weight: 600; }
.ingm-const-input {
  flex: 1 1 auto; min-width: 0; max-width: 240px; padding: 3px 6px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  font-family: inherit; font-size: 12.5px; line-height: 1.3; color: inherit; background: var(--paper);
}
.ingm-btn:disabled { opacity: .5; cursor: not-allowed; }
/* Warnings collapse behind one toggle so blocking errors stay visible above them. */
.ingx-warnblock { margin-top: 10px; }
.ingx-def-n { font-size: 11px; color: var(--color-text-secondary); }
/* A grid row the contract would reject — outlined so the advisory list has an on-row counterpart. */
tr.row-rejected > td { background: var(--bone-2); }
tr.row-rejected > td:first-child { box-shadow: inset 3px 0 0 var(--neg); }

/* Per-row Apply: sticks to the bottom of the scrolling body so it stays reachable while editing a long row. */
.ingx-drill-acts { position: sticky; bottom: 0; display: flex; align-items: center; gap: 10px; padding: 6px 0 2px; background: var(--color-surface); }
.ingx-drill-edited { box-shadow: inset 3px 0 0 var(--orange); }
.ingx-drill-edited .ingx-drill-state::after { content: 'changed — Apply to confirm'; font-size: 11.5px; color: var(--orange-deep); }
/* Confirmed by Apply. Deliberately NOT "clean" or "fixed": Apply asserts the user dealt with the row, it does
   not validate — the Re-check that Confirm already demands is what decides whether the row is actually valid. */
.ingx-drill-fixed { box-shadow: inset 3px 0 0 var(--green); }
.ingx-drill-fixed .ingx-drill-state::after { content: '✓ confirmed — Re-check to validate'; font-size: 11.5px; color: var(--green-3); }
/* Warnings toggle: deliberately NOT the green .ingx-link — it is the only signal that unresolved
   warnings exist, so it reads as a warning, at a size that survives a crowded modal. */
.ingx-btn.ingx-warn-toggle { border: 1px solid var(--orange); background: var(--bone-2); color: var(--orange-deep); font-size: 14px; font-weight: 650; padding: 8px 12px; }
.ingx-btn.ingx-warn-toggle:hover { background: var(--color-surface); }
/* Footer Re-check: fixes accumulate and are validated in one pass, so this carries the pending count. It only
   asks for attention while changes are actually waiting — disabled it sits back as a peer of Cancel. */
.ingx-foot .ingx-recheck:not(:disabled) { border-color: var(--orange); color: var(--orange-deep); background: var(--bone-2); font-weight: 650; }
.ingx-foot .ingx-recheck:not(:disabled):hover { background: var(--color-surface); }
