/* ==================================================================
   af-incoming.css - the Incoming Documents queue (ADR-0055 section 9;
   operations task O09).

   Canon: docs/design-canon/all-files-prototype-review/
          handoff/all-files/af-incoming.css, lifted verbatim: the page
          head and return link, the list (search, tabs, freshness,
          envelopes, items), the item card in decision order (source,
          siblings, status note, Find applicant, document type, file
          and use choices, reason sheet, summary, actions).

   Not lifted here: the scope chip (.af-in-scope) and the advisory
   proposal with its signals (.af-in-proposal, .af-in-cand*,
   .af-in-signal*), which ship with proposals in the matching
   delivery - the core proposes nothing (Kent, 2026-10-24); and the
   viewer beside the item (.af-in-viewer*, .af-in-grid.is-viewing),
   which ships with the shared viewer (O10).

   The narrow block is a media query, like all-files.css: a 760px
   container is a 992px viewport beside the 232px sidenav.

   Loads after threshold-tokens.css, threshold-chrome.css,
   all-files.css and af-requirements.css (refusals consume
   .af-req-conflict, radio dots .af-req-radio-dot, the dropdown
   .af-req-input; the freshness offer is the All Files .af-updates
   pill). TOKENS: no `--token:` declaration (ADR-0035); every colour
   is --th-*, so dark flows through the tokens.
   ================================================================== */
.af-in {
    font-family: var(--th-font-sans);
    color: var(--th-ink);
    background: var(--th-paper);
    font-size: var(--th-size-14);
    line-height: 1.45;
    min-width: 0;
}
.af-in a { color: var(--th-advant); text-decoration: none; }
.af-in a:hover { color: var(--th-advant-deep); }
.af-in svg { flex: none; }
.af-in .cc-pill { flex: none; }

/* ------------------------------------------------------------------
   Return link (only with a file context) and page head
   ------------------------------------------------------------------ */
.af-in-return { padding: 16px 24px 0; }
.af-in-return-link { display: inline-flex; align-items: center; gap: 5px; flex-wrap: wrap; font-size: var(--th-size-12); }
.af-in .af-in-return-link { color: var(--th-ink-2); }
.af-in-return-sep { color: var(--th-ink-4); }
.af-in-return-name { color: var(--th-ink-2); }
.af-in-return-ref { font-family: var(--th-font-mono); font-size: var(--th-size-12); color: var(--th-ink-2); }
.af-in-return-link:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: var(--th-radius-2); }

.af-in-head { padding: 22px 24px 14px; display: flex; flex-direction: column; gap: 4px; }
.af-in.has-context .af-in-head { padding-top: 10px; }
.af-in-title { margin: 0; font-family: var(--th-font-serif); font-weight: 500; font-size: var(--th-size-24); letter-spacing: -0.01em; line-height: 1.2; color: var(--th-ink); }
.af-in-sub { margin: 0; font-size: var(--th-size-13); color: var(--th-ink-2); max-width: 720px; text-wrap: pretty; }

/* ------------------------------------------------------------------
   Grid: list | detail
   ------------------------------------------------------------------ */
.af-in-grid {
    padding: 0 24px 28px;
    display: grid;
    grid-template-columns: minmax(300px, 0.85fr) minmax(0, 1.3fr);
    gap: 18px;
    align-items: start;
}

/* ------------------------------------------------------------------
   List: search, tabs, meta + freshness, envelopes
   ------------------------------------------------------------------ */
.af-in-list { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.af-in-search,
.af-in-find-input {
    font: inherit;
    font-size: 13px;
    padding: 7px 10px;
    border: 1px solid var(--th-line-2);
    border-radius: var(--th-radius-3);
    background: var(--th-paper-sunk);
    color: var(--th-ink);
    outline: none;
    min-width: 0;
}
.af-in-find-input { background: var(--th-paper); }
.af-in-search::placeholder, .af-in-find-input::placeholder { color: var(--th-ink-2); }
.af-in-search:focus, .af-in-find-input:focus { border-color: var(--th-advant); box-shadow: 0 0 0 1px var(--th-advant); }

.af-in-filters { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.af-in-tabs { display: inline-flex; border: 1px solid var(--th-line-2); border-radius: 4px; overflow: hidden; }
.af-in-tab {
    font: inherit;
    font-size: var(--th-size-12);
    padding: 5px 10px;
    border: 0;
    border-right: 1px solid var(--th-line);
    background: var(--th-paper-sunk);
    color: var(--th-ink-2);
    font-weight: 400;
    cursor: pointer;
    white-space: nowrap;
    display: inline-flex;
    gap: 6px;
    align-items: baseline;
}
.af-in-tab[aria-pressed="true"] { background: var(--th-advant-soft); color: var(--th-advant-deep); font-weight: 600; }
.af-in-tab-count { font-family: var(--th-font-mono); font-size: 10.5px; color: var(--th-ink-2); }
.af-in-meta { display: flex; align-items: center; gap: 4px 10px; flex-wrap: wrap; font-size: var(--th-size-12); color: var(--th-ink-2); }
.af-in-count { white-space: nowrap; }
.af-in-count b { color: var(--th-ink); font-weight: 600; }
.af-in-fresh { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
/* The queue's "Updates available - Refresh" offer is the All Files list's .af-updates pill
   (all-files.css), one shape on both surfaces (owner decision 2026-09-27). */
.af-in-refresh { font: inherit; font-size: var(--th-size-12); padding: 0; border: 0; background: transparent; color: var(--th-advant); cursor: pointer; white-space: nowrap; }

.af-in-empty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 22px 18px;
    border: 1px dashed var(--th-line-2);
    border-radius: var(--th-radius-5);
}
.af-in-empty svg { color: var(--th-ink-4); }
.af-in-empty-head { font-weight: 600; font-size: var(--th-size-14); color: var(--th-ink); }
.af-in-empty-body { font-size: var(--th-size-13); color: var(--th-ink-2); text-wrap: pretty; }
.af-in-empty .cc-btn { font-size: var(--th-size-12); font-weight: 400; padding: 4px 10px; background: var(--th-paper); white-space: nowrap; }

.af-in-envs { display: flex; flex-direction: column; gap: 10px; }
.af-in-env { border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper-sunk); overflow: hidden; }
.af-in-env-head { padding: 8px 12px; display: flex; flex-direction: column; gap: 2px; border-bottom: 1px solid var(--th-line); background: var(--th-paper-2); }
.af-in-env-line { display: flex; align-items: baseline; gap: 4px 10px; flex-wrap: wrap; }
.af-in-env-id { font-family: var(--th-font-mono); font-size: 12px; font-weight: 600; color: var(--th-ink); }
.af-in-env-channel { font-size: var(--th-size-12); color: var(--th-ink-2); }
.af-in-env-received { font-size: var(--th-size-12); color: var(--th-ink-2); white-space: nowrap; }
.af-in-env-count { margin-left: auto; font-size: 11px; color: var(--th-ink-2); white-space: nowrap; }
.af-in-env-sender { font-size: var(--th-size-12); color: var(--th-ink-2); }
.af-in-env-more { padding: 6px 12px; font-size: 11px; color: var(--th-ink-2); }

/* Items: one roving tab stop per list (up/down, Home, End); Enter opens and focuses the item heading */
.af-in-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    min-height: 44px;
    border: 0;
    border-bottom: 1px solid var(--th-line-soft);
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    color: var(--th-ink);
}
.af-in-item:hover { background: var(--th-paper-2); }
.af-in-item[aria-current="true"] { background: var(--th-advant-soft); box-shadow: inset 3px 0 0 var(--th-advant); }
.af-in-item:focus-visible { outline: 2px solid var(--th-advant); outline-offset: -2px; }
.af-in-item-n { font-family: var(--th-font-mono); font-size: 11px; color: var(--th-ink-2); flex: none; margin-top: 1px; }
.af-in-item-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.af-in-item-label { font-size: var(--th-size-13); font-weight: 500; color: var(--th-ink); overflow-wrap: anywhere; }
.af-in-item-label.is-mono { font-family: var(--th-font-mono); }
.af-in-item-line { font-size: var(--th-size-12); color: var(--th-ink-2); }

/* ------------------------------------------------------------------
   Detail: the item in decision order
   ------------------------------------------------------------------ */
.af-in-detail { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
/* "<- Queue": narrow with an item open */
.af-in-back {
    display: none;
    align-self: flex-start;
    font: inherit;
    font-size: var(--th-size-12);
    padding: 6px 10px;
    min-height: 36px;
    border: 1px solid var(--th-line-2);
    border-radius: var(--th-radius-3);
    background: var(--th-paper-sunk);
    color: var(--th-ink-2);
    cursor: pointer;
    white-space: nowrap;
    align-items: center;
}
.af-in-nosel { padding: 22px 18px; border: 1px dashed var(--th-line-2); border-radius: var(--th-radius-5); font-size: var(--th-size-13); color: var(--th-ink-2); }

.af-in-card {
    border: 1px solid var(--th-line);
    border-radius: 6px;
    background: var(--th-paper-sunk);
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}
.af-in-card-top { display: flex; flex-direction: column; gap: 5px; }
.af-in-eyebrow { font-family: var(--th-font-mono); font-size: 11px; color: var(--th-ink-2); }
.af-in-title-row { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; }
.af-in-title-row > svg { color: var(--th-ink-4); }
.af-in-name { margin: 0; font-size: var(--th-size-15); font-weight: 600; color: var(--th-ink); overflow-wrap: anywhere; outline: none; }
.af-in-name.is-mono { font-family: var(--th-font-mono); }
.af-in-name:focus-visible { box-shadow: 0 0 0 2px var(--th-advant); border-radius: var(--th-radius-2); }
.af-in-name-meta { font-size: var(--th-size-12); color: var(--th-ink-2); white-space: nowrap; }
.af-in-title-actions { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; }
.af-in-download { font-size: 12px; white-space: nowrap; }

.af-in-source { margin: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 4px 14px; font-size: var(--th-size-13); }
.af-in-source dt { color: var(--th-ink-2); }
.af-in-source dd { margin: 0; color: var(--th-ink); overflow-wrap: anywhere; }
.af-in-source dd.is-unset { color: var(--th-ink-2); } /* 2026-10-19: Type reads Unclassified */

.af-in-section { display: flex; flex-direction: column; gap: 6px; }
.af-in-siblings { gap: 4px; }
.af-in-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; color: var(--th-ink-2); }
.af-in-sibling {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font: inherit;
    font-size: 12px;
    padding: 3px 0;
    border: 0;
    background: transparent;
    color: var(--th-ink-2);
    cursor: pointer;
    text-align: left;
}
.af-in-sibling:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: var(--th-radius-2); }
.af-in-sibling-n { font-family: var(--th-font-mono); font-size: 11px; color: var(--th-ink-2); }
.af-in-sibling-label.is-mono { font-family: var(--th-font-mono); }
.af-in-hint { font-size: var(--th-size-12); color: var(--th-ink-2); text-wrap: pretty; }
/* 2026-10-19: Document type in the match form - the dropdown (the input atom) and Save type on one row. */
.af-in-type-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.af-in-type-row .af-req-input { min-width: 220px; max-width: 100%; }

/* Status note: what the item's status asks for (canon, and the states Kent approved 2026-10-24) */
.af-in-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px 12px;
    border: 1px solid var(--th-line-2);
    border-radius: 4px;
    background: var(--th-paper);
    font-size: var(--th-size-13);
    color: var(--th-ink);
    line-height: 1.5;
}
.af-in-note > svg { margin-top: 2px; color: var(--th-ink); }
.af-in-note.is-ok { border-color: var(--th-ok); background: var(--th-ok-soft); }
.af-in-note.is-risk { border-color: var(--th-risk); background: var(--th-risk-soft); }
.af-in-note.is-warn { border-color: var(--th-warn); background: var(--th-warn-soft); }
.af-in-note.is-muted { background: var(--th-paper-2); }
.af-in-note.is-ok > svg, .af-in-note.is-ok .af-in-note-head { color: var(--th-ok-ink); }
.af-in-note.is-risk > svg, .af-in-note.is-risk .af-in-note-head { color: var(--th-risk-ink); }
.af-in-note.is-warn > svg, .af-in-note.is-warn .af-in-note-head { color: var(--th-warn-ink); }
.af-in-note-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.af-in-note-head { font-weight: 600; color: var(--th-ink); }
.af-in-note-line { color: var(--th-ink-2); text-wrap: pretty; }
.af-in-note-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
/* A long action ("Back to Official high school transcript on the checklist →", I03; "Open RR-2027-0091 ·
   Marcus Webb · counselor letter →", I11) wraps inside the page rather than running past it (round 4
   corrections, fourth note, item 3). The reference inside stays whole (af-nobreak). */
.af-in-note-actions .cc-btn { min-height: 32px; white-space: normal; max-width: 100%; text-align: left; overflow-wrap: break-word; }
.af-in-note-actions .cc-btn:not(.is-primary) { background: var(--th-paper); }

/* Radio-like choices: applicant cards, found applicants, files, uses, disposition */
.af-in-radio {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    min-height: 40px;
    border-radius: 4px;
    border: 1px solid var(--th-line);
    background: var(--th-paper);
    font: inherit;
    text-align: left;
    cursor: pointer;
    color: var(--th-ink);
}
.af-in-radio[aria-checked="true"] { border-color: var(--th-advant); background: var(--th-advant-soft); }
.af-in-radio[aria-disabled="true"] { cursor: default; background: var(--th-paper-2); } /* 2026-10-19: was opacity 0.6 on the whole option (reason text near 3:1) */
.af-in-radio[aria-disabled="true"] .af-req-radio-dot { opacity: 0.45; }
.af-in-radio[aria-disabled="true"] .af-in-option-title, .af-in-radio[aria-disabled="true"] .af-in-option-ref { color: var(--th-ink-2); }
.af-in-radio:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; }
.af-in-radio .af-req-radio-dot { margin-top: 0; }
.af-in-radio.is-compact { padding: 7px 10px; min-height: 36px; font-size: var(--th-size-13); }
.af-in-disclosure {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: inherit;
    font-size: 12px;
    color: var(--th-ink-2);
    background: transparent;
    border: 0;
    padding: 2px 0;
    cursor: pointer;
}
.af-in-disclosure[aria-expanded="true"] svg { transform: rotate(90deg); }
.af-in-disclosure:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: var(--th-radius-2); }
.af-in-options { display: flex; flex-direction: column; gap: 4px; }
.af-in-option-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.af-in-option-text.is-grow { flex: 1; }
.af-in-option-name { font-size: var(--th-size-13); font-weight: 600; }
.af-in-option-files { font-size: 11px; color: var(--th-ink-2); font-family: var(--th-font-mono); overflow-wrap: anywhere; white-space: pre-line; }
.af-in-option-line { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.af-in-option-line.is-center { align-items: center; }
.af-in-option-ref { font-family: var(--th-font-mono); font-size: 12px; font-weight: 600; }
.af-in-option-label { font-size: 12px; color: var(--th-ink-2); }
.af-in-option-title { font-size: var(--th-size-13); font-weight: 500; }
.af-in-option-meta { font-size: 11px; color: var(--th-ink-2); }

/* Reason sheet: report, lift, confirm wrong match, correct the use, dispose */
.af-in-sheet {
    border: 1px solid var(--th-advant);
    border-radius: var(--th-radius-5);
    background: var(--th-paper);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.af-in-sheet-title { font-family: var(--th-font-serif); font-weight: 600; font-size: 14px; color: var(--th-ink); }
.af-in-sheet-desc { font-size: var(--th-size-13); color: var(--th-ink-2); line-height: 1.5; text-wrap: pretty; }
.af-in-reason { display: flex; flex-direction: column; gap: 4px; font-size: var(--th-size-12); color: var(--th-ink-2); }
.af-in-textarea {
    font: inherit;
    font-size: 13px;
    padding: 6px 9px;
    border: 1px solid var(--th-line-2);
    border-radius: var(--th-radius-3);
    background: var(--th-paper-sunk);
    color: var(--th-ink);
    resize: vertical;
}
.af-in-textarea:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 1px; }

/* What confirming does, in words */
.af-in-summary {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid var(--th-line-2);
    border-radius: 4px;
    background: var(--th-paper);
    font-size: var(--th-size-13);
    line-height: 1.5;
}
.af-in-summary-line { color: var(--th-ink); text-wrap: pretty; }
.af-in-summary-line.is-2 { color: var(--th-ink-2); }
.af-in-summary-line.is-3 { color: var(--th-ink-2); }

.af-in-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    border-top: 1px solid var(--th-line-soft);
    padding-top: 12px;
}
.af-in-actions .cc-btn { min-height: 34px; white-space: nowrap; }
.af-in-actions .cc-btn.is-primary { padding: 6px 13px; }
.af-in-actions .cc-btn.is-quiet-danger { background: var(--th-paper); }
/* Report wrong applicant, Confirm and place the copy, Dispose of item */
.af-in-actions .cc-btn.is-primary.af-in-danger { background: var(--th-risk-ink); border-color: var(--th-risk-ink); }
.af-in-actions .cc-btn.is-primary[aria-disabled="true"] { background: var(--th-advant-deep); border-color: var(--th-advant-deep); color: var(--th-advant-fg); opacity: 0.45; cursor: pointer; }
.af-in-actions .cc-btn.is-primary.af-in-danger[aria-disabled="true"] { background: var(--th-risk-ink); border-color: var(--th-risk-ink); }
.af-in-foot { font-size: var(--th-size-12); color: var(--th-ink-2); margin-left: auto; text-wrap: pretty; }

/* ------------------------------------------------------------------
   Narrow (400): one column; the detail replaces the list. The canon's
   @container (max-width: 760px) on .af-in, as a media query beside the
   232px sidenav (760 + 232 = 992).
   ------------------------------------------------------------------ */
@media (max-width: 992px) {
    .af-in-return { padding-left: 14px; padding-right: 14px; }
    .af-in-head { padding-left: 14px; padding-right: 14px; }
    .af-in-grid { padding: 0 14px 28px; grid-template-columns: minmax(0, 1fr); }
    .af-in-grid.has-item > .af-in-list { display: none; }
    .af-in-grid:not(.has-item) > .af-in-detail { display: none; }
    .af-in-grid.has-item .af-in-back { display: inline-flex; }
}
