/* silmera-modules.css - the reskin layer for the ENGINE MODULES' own screens.
 *
 * The modules (apps/oraclea/js/silmera-*.js) carry their own stylesheet as a string
 * inside silmera-memo.js, appended to <head> AT RUNTIME - i.e. AFTER this file. Later
 * wins on a tie, so every rule here is written at TWO ids (#sil-view #silmera-memo-panel)
 * against their one, and `!important` is used only where the module sets the property
 * as an INLINE style (the home chooser's per-flow button colours), which no selector
 * can outrank.
 *
 * Rule of this layer: RESTYLE, never remove. Where a module screen carries more than the
 * mock does (the dossier input, the sheet, the DD report, the checklist and template
 * review, the data room), its content stays and only its skin changes.
 *
 * The "(?)" that the module appends to an unlocated source chip is stripped in the DOM by
 * silmera-host.js (the mark is a text node, not a style); the amber chip below is what
 * carries the same meaning here.
 */

/* -- the module's own chrome, off -------------------------------------------- */

/* the floating launcher and the modal backdrop have no place on a page that IS the
   product; the adapter moves the panel into <main> and hides both. */
body #silmera-memo-fab { display: none !important; }
body #silmera-memo-overlay { display: none !important; }
body #sm-sheet-stage { display: none !important; }
body #silmera-veracita-bridge { display: none !important; }

/* -- the panel, re-homed ----------------------------------------------------- */

#sil-view #silmera-memo-panel {
  background: var(--card);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 12px;
  max-width: none;
  width: auto;
  padding: 20px 22px;
  box-shadow: none;
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  line-height: 1.5;
  max-height: none;
  overflow: visible;
}
#sil-view #silmera-memo-panel.sm-wide { max-width: none; }

#sil-view #silmera-memo-panel h2 {
  font-size: 18px; font-weight: 600; letter-spacing: -0.01em;
  margin: 0 0 4px; color: var(--ink);
}
#sil-view #silmera-memo-panel .sm-sub { color: var(--ink3); font-size: 13.5px; margin-bottom: 14px; }
#sil-view #silmera-memo-panel .sm-note { color: var(--ink3); font-size: 12.5px; margin-top: 10px; }
#sil-view #silmera-memo-panel .sm-err { color: var(--bad-ink); font-size: 13px; margin-top: 10px; white-space: pre-wrap; }

/* -- buttons: one accent, and the module's inline flow colours neutralised ---- */

#sil-view #silmera-memo-panel .sm-btn {
  background: var(--accent) !important;
  color: var(--on-accent) !important;
  border: 1px solid var(--accent) !important;
  border-radius: 8px;
  font-family: inherit; font-weight: 600; font-size: 14px;
  padding: 0 16px; min-height: 38px;
  cursor: pointer;
}
#sil-view #silmera-memo-panel .sm-btn:hover { background: var(--accent-hover) !important; border-color: var(--accent-hover) !important; }
#sil-view #silmera-memo-panel .sm-btn[disabled] { opacity: 0.45; cursor: wait; }
#sil-view #silmera-memo-panel .sm-btn.sm-ghost {
  background: var(--card) !important;
  color: var(--ink) !important;
  border: 1px solid rgba(var(--ink-rgb), 0.14) !important;
}
#sil-view #silmera-memo-panel .sm-btn.sm-ghost:hover { border-color: rgba(var(--ink-rgb), 0.28) !important; }
/* the home chooser: the flow cards keep their copy, lose their five different colours */
#sil-view #silmera-memo-panel #sm-go-legal,
#sil-view #silmera-memo-panel #sm-go-plan,
#sil-view #silmera-memo-panel #sm-go-fill,
#sil-view #silmera-memo-panel #sm-go-ask,
#sil-view #silmera-memo-panel #sm-go-author,
#sil-view #silmera-memo-panel #sm-go-checklist,
#sil-view #silmera-memo-panel #dd-go {
  background: var(--card) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  text-align: left;
  font-weight: 600;
}
#sil-view #silmera-memo-panel #sm-go-legal:hover,
#sil-view #silmera-memo-panel #sm-go-plan:hover,
#sil-view #silmera-memo-panel #sm-go-fill:hover,
#sil-view #silmera-memo-panel #sm-go-ask:hover,
#sil-view #silmera-memo-panel #sm-go-author:hover,
#sil-view #silmera-memo-panel #sm-go-checklist:hover,
#sil-view #silmera-memo-panel #dd-go:hover { border-color: var(--accent) !important; background: rgba(var(--accent-rgb), 0.05) !important; }
#sil-view #silmera-memo-panel .sm-btn span { color: var(--ink3) !important; }

/* -- inputs ------------------------------------------------------------------ */

#sil-view #silmera-memo-panel textarea,
#sil-view #silmera-memo-panel input[type=text],
#sil-view #silmera-memo-panel input[type=file],
#sil-view #silmera-memo-panel select {
  border: 1px solid rgba(var(--ink-rgb), 0.14);
  border-radius: 8px;
  font-family: inherit; font-size: 14px;
  background: var(--card); color: var(--ink);
  padding: 8px 12px;
}
#sil-view #silmera-memo-panel textarea:focus,
#sil-view #silmera-memo-panel input:focus,
#sil-view #silmera-memo-panel select:focus { outline: 2px solid rgba(var(--accent-rgb), 0.35); outline-offset: 1px; border-color: var(--accent); }

/* -- tables: the sheet, the trail, the report -------------------------------- */

#sil-view #silmera-memo-panel table { width: 100%; border-collapse: collapse; font-size: 13.5px; margin: 12px 0; }
#sil-view #silmera-memo-panel th {
  border: 0; border-bottom: 1px solid var(--line);
  padding: 0 12px 10px; text-align: left;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);
  background: transparent;
}
#sil-view #silmera-memo-panel td {
  border: 0; border-bottom: 1px solid var(--line-soft);
  padding: 11px 12px; vertical-align: top; color: var(--ink);
}
#sil-view #silmera-memo-panel tr.sm-sect td {
  background: transparent;
  padding: 16px 12px 6px;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted); border-bottom: 0;
}
#sil-view #silmera-memo-panel table.sm-sheet td.sm-n { color: var(--muted); font-family: var(--mono); font-size: 12.5px; }
/* a value that has not landed yet is quiet, not a different hue */
#sil-view #silmera-memo-panel tr.sm-row td.sm-v,
#sil-view #silmera-memo-panel tr.sm-row td.sm-s { color: rgba(var(--ink-rgb), 0.28); }
#sil-view #silmera-memo-panel tr.sm-row.sm-done td.sm-v,
#sil-view #silmera-memo-panel tr.sm-row.sm-done td.sm-s { color: var(--ink); }
#sil-view #silmera-memo-panel .sm-val { font-weight: 500; }

/* -- source chips: document and page, in mono, page always shown ------------- */

#sil-view #silmera-memo-panel .sm-chip,
#sil-view #silmera-memo-panel .sm-fill-doclist .sm-doc {
  display: inline-block;
  font-family: var(--mono); font-size: 12px;
  color: var(--ink); background: var(--card);
  border: 1px solid var(--line); border-radius: 8px;
  padding: 2px 8px; margin: 2px 6px 2px 0;
  cursor: pointer;
}
#sil-view #silmera-memo-panel .sm-chip:hover { border-color: var(--accent); background: rgba(var(--accent-rgb), 0.05); }
/* the quote could not be located verbatim in the piece - amber, and the tooltip says so.
   The module's own "(?)" suffix is removed from the text by silmera-host.js. */
#sil-view #silmera-memo-panel .sm-chip.sm-unver {
  color: var(--rev-ink); background: rgba(var(--rev-rgb), 0.06); border-color: rgba(var(--rev-rgb), 0.35);
}
#sil-view #silmera-memo-panel .sm-fill-doclist { margin: 12px 0; font-size: 12.5px; color: var(--ink3); }
#sil-view #silmera-memo-panel .sm-fill-doclist .sm-doc { cursor: default; }
#sil-view #silmera-memo-panel .sm-fill-doclist .sm-doc b { font-weight: 600; color: var(--ink); }
#sil-view #silmera-memo-panel .sm-quote {
  font-family: 'DM Sans', sans-serif; font-style: normal;
  color: var(--ink2); font-size: 12.5px;
  border-left: 2px solid var(--line); padding: 4px 0 4px 10px; margin-top: 6px;
  background: transparent;
}

/* -- THE FOUR STATES. One vocabulary on the page and inside the panel -------- */

#sil-view #silmera-memo-panel .sm-verdict {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 6px; padding: 3px 10px;
  font-size: 12.5px; font-weight: 500;
  border-radius: 9999px; border: 1px solid var(--line); background: var(--card);
}
#sil-view #silmera-memo-panel .sm-verdict::before {
  content: ""; width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px; background: var(--muted);
}
/* Confirmed */
#sil-view #silmera-memo-panel .sm-verdict.sm-v-ok { color: var(--ok-ink); background: var(--card); border-color: rgba(var(--ok-rgb), 0.35); }
#sil-view #silmera-memo-panel .sm-verdict.sm-v-ok::before { background: var(--ok); }
/* To review */
#sil-view #silmera-memo-panel .sm-verdict.sm-v-warn { color: var(--rev-ink); background: var(--card); border-color: rgba(var(--rev-rgb), 0.35); }
#sil-view #silmera-memo-panel .sm-verdict.sm-v-warn::before { background: var(--card); border: 2px solid var(--rev); }
/* neither judged nor judgeable */
#sil-view #silmera-memo-panel .sm-verdict.sm-v-none { color: var(--ink3); background: var(--card); border-color: var(--line); }
#sil-view #silmera-memo-panel .sm-verdict.sm-v-none::before { background: transparent; border: 1.5px solid var(--abs); }
#sil-view #silmera-memo-panel .sm-verdict .sm-vsrc { display: block; font-weight: 400; font-size: 11px; margin-top: 2px; color: var(--ink3); }

/* Absent - "not in the dossier", stated, never guessed */
#sil-view #silmera-memo-panel .sm-badge-missing {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 12.5px; font-weight: 500; font-style: italic;
  color: var(--ink3); background: var(--card);
  border: 1px solid var(--line); border-radius: 9999px; padding: 3px 10px;
}
#sil-view #silmera-memo-panel .sm-badge-missing::before { content: ""; width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--abs); flex: 0 0 9px; }

/* Contradiction - both readings side by side, neither picked */
#sil-view #silmera-memo-panel .sm-conflict {
  border: 1px solid rgba(var(--bad-rgb), 0.25);
  background: rgba(var(--bad-rgb), 0.04);
  border-radius: 8px; padding: 10px 12px;
}
#sil-view #silmera-memo-panel .sm-conflict .sm-hdr {
  display: flex; align-items: center; gap: 7px;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--bad-ink); margin-bottom: 6px;
}
#sil-view #silmera-memo-panel .sm-conflict .sm-hdr::before {
  content: ""; width: 8px; height: 8px; background: var(--bad); border-radius: 2px; transform: rotate(45deg); flex: 0 0 8px;
}
#sil-view #silmera-memo-panel .sm-branch { padding: 6px 0; }
#sil-view #silmera-memo-panel .sm-branch + .sm-branch { border-top: 1px dashed rgba(var(--bad-rgb), 0.25); }
#sil-view #silmera-memo-panel .sm-bv { font-weight: 600; font-size: 13.5px; color: var(--ink); }

/* -- the footer counters ----------------------------------------------------- */

#sil-view #silmera-memo-panel .sm-foot {
  display: flex; align-items: baseline; gap: 22px; flex-wrap: wrap;
  border-top: 1px solid var(--line); margin-top: 16px; padding-top: 14px;
  color: var(--ink2); font-size: 13px;
}
#sil-view #silmera-memo-panel .sm-foot .sm-stat b { font-size: 18px; font-variant-numeric: tabular-nums; color: var(--ink); }
#sil-view #silmera-memo-panel .sm-foot .sm-ok b, #sil-view #silmera-memo-panel .sm-foot .sm-vok b { color: var(--ok-ink); }
#sil-view #silmera-memo-panel .sm-foot .sm-warn b, #sil-view #silmera-memo-panel .sm-foot .sm-vwarn b { color: var(--rev-ink); }
#sil-view #silmera-memo-panel .sm-foot .sm-err2 b { color: var(--bad-ink); }
#sil-view #silmera-memo-panel .sm-foot .sm-trace { margin-left: auto; color: var(--muted); font-size: 12.5px; }

/* -- the approval card (one card, one price, before anything is reserved) ----- */

#sil-view #silmera-memo-panel .sm-cost {
  border: 1px solid var(--accent);
  background: rgba(var(--accent-rgb), 0.05);
  border-radius: 12px; padding: 16px 18px; margin: 14px 0;
}
#sil-view #silmera-memo-panel .sm-cost .sm-cost-h { font-weight: 600; font-size: 15px; color: var(--ink); margin-bottom: 6px; }
#sil-view #silmera-memo-panel .sm-cost .sm-cost-n { font-size: 12.5px; color: var(--ink3); margin: 6px 0 12px; }

/* -- prose the modules render as markdown (memo, report, plan) --------------- */

#sil-view #silmera-memo-panel .sm-md h1 { font-size: 20px; font-weight: 600; margin: 16px 0 8px; letter-spacing: -0.015em; }
#sil-view #silmera-memo-panel .sm-md h2 { font-size: 15px; font-weight: 600; margin: 16px 0 6px; text-transform: none; letter-spacing: 0; color: var(--ink); }
#sil-view #silmera-memo-panel .sm-md h3 { font-size: 13.5px; font-weight: 600; margin: 14px 0 5px; color: var(--ink2); text-transform: none; letter-spacing: 0; }
#sil-view #silmera-memo-panel .sm-md ul { margin: 6px 0; padding-left: 20px; }
#sil-view #silmera-memo-panel .sm-md hr { border: 0; border-top: 1px solid var(--line); margin: 18px 0; }
#sil-view #silmera-memo-panel .sm-md em { color: var(--ink3); font-style: italic; }

/* -- module hosts that render inside the panel (ask, data room, correct,
      report, checklist, template author, pseudonymise) ------------------------- */

#sil-view #silmera-memo-panel #sm-ask-host,
#sil-view #silmera-memo-panel #sm-dr-host,
#sil-view #silmera-memo-panel #sm-correct-host,
#sil-view #silmera-memo-panel #sm-ps-host { margin-top: 16px; }

#sil-view #silmera-memo-panel .sm-ask-ans,
#sil-view #silmera-memo-panel .sm-ask-out { border-left: 2px solid var(--ok); padding: 6px 12px; margin-top: 12px; }
#sil-view #silmera-memo-panel .sm-ask-missing { border-left-color: var(--abs); color: var(--ink3); }
#sil-view #silmera-memo-panel .sm-ask-q { color: var(--muted); font-size: 12.5px; }
#sil-view #silmera-memo-panel .sm-ask-row { display: flex; gap: 8px; align-items: center; }
#sil-view #silmera-memo-panel .sm-ask-row input[type=text] { flex: 1 1 auto; height: 38px; }

#sil-view #silmera-memo-panel .sm-trail,
#sil-view #silmera-memo-panel .sm-correct-note {
  border-left: 2px solid var(--line); padding: 2px 10px; margin-top: 6px;
  color: var(--ink2); font-size: 12.5px;
}

#sil-view #silmera-memo-panel .sm-dr-row,
#sil-view #silmera-memo-panel .sm-ps-row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
#sil-view #silmera-memo-panel .sm-dr-bar { height: 6px; border-radius: 9999px; background: rgba(var(--ink-rgb), 0.10); overflow: hidden; }
#sil-view #silmera-memo-panel .sm-dr-stat,
#sil-view #silmera-memo-panel .sm-ps-stat { color: var(--ink3); font-size: 12.5px; }
#sil-view #silmera-memo-panel .sm-dr-warn { color: var(--rev-ink); font-size: 12.5px; }
#sil-view #silmera-memo-panel .sm-dr-err,
#sil-view #silmera-memo-panel .sm-ps-err,
#sil-view #silmera-memo-panel .sm-export-err { color: var(--bad-ink); font-size: 13px; }

/* the DD report's own severity pills, in the four-state palette */
#sil-view #silmera-memo-panel .sm-c-vok { color: var(--ok-ink); }
#sil-view #silmera-memo-panel .sm-c-vwarn { color: var(--rev-ink); }
#sil-view #silmera-memo-panel .sm-c-conflict { color: var(--bad-ink); }
#sil-view #silmera-memo-panel .sm-c-missing { color: var(--ink3); }
#sil-view #silmera-memo-panel .sm-c-filled { color: var(--ink); }

/* -- step 4 of the flow: only what the flow has NOT asked yet (2026-09-10) ------------ */
/* Andy, reviewing the four-step flow live: "the result screen is really messy". The
 * module's dossier screen repeats what steps 1-3 already settled - its own file input, the
 * chip list, the paste box, "Add this piece", the data room card (with its "Vectors"
 * engineering leak), the ask box, and a Back that leads to the module's own menu. The
 * page stamps the goal on the slot (#sil-slot[data-for]) and this block hides, per goal,
 * every part the flow already covered. The elements stay in the DOM (display:none): the
 * page still feeds dropped files into the module's own input, and the module's handlers
 * are untouched. This is the ONE deliberate exception to "restyle, never remove". */

/* the fill / ask screen: title + lead, the module's own document controls, its Back */
#sil-view #sil-slot #silmera-memo-panel:has(#sm-fill-files) > h2,
#sil-view #sil-slot #silmera-memo-panel:has(#sm-fill-files) > .sm-sub:first-of-type,
#sil-view #sil-slot #silmera-memo-panel div:has(> #sm-fill-files),
#sil-view #sil-slot #silmera-memo-panel #sm-fill-doclist,
#sil-view #sil-slot #silmera-memo-panel #sm-fill-paste,
#sil-view #sil-slot #silmera-memo-panel div:has(> #sm-fill-add),
#sil-view #sil-slot #silmera-memo-panel #sm-fill-back { display: none !important; }

/* the data room card: never on step 4 (the documents were step 3) */
#sil-view #sil-slot #silmera-memo-panel #sm-dr-host { display: none !important; }

/* the ask box: only when the goal IS a question */
#sil-view #sil-slot:not([data-for="ask"]) #silmera-memo-panel #sm-ask-host { display: none !important; }

/* the due-diligence screen: same rule for its own document controls and Back */
#sil-view #sil-slot #silmera-memo-panel #dd-files,
#sil-view #sil-slot #silmera-memo-panel #dd-paste,
#sil-view #sil-slot #silmera-memo-panel #dd-add,
#sil-view #sil-slot #silmera-memo-panel #dd-doclist,
#sil-view #sil-slot #silmera-memo-panel #dd-back { display: none !important; }

/* the action row sits flush under the page's summary now */
#sil-view #sil-slot #silmera-memo-panel div:has(> #sm-fill-run) { margin-top: 0 !important; }

/* the page draws the filled sheet itself (silmera-app.js resultView, 2026-09-10): while it
   does, the module's own screen is hidden - NOT removed: the certificate counts on it and
   silmera-correct anchors its slots on it. "Show the engine's own table" lifts the class. */
#sil-view #sil-slot.has-result #silmera-memo-panel > :not(#sm-ask-sheet) { display: none !important; }
/* ... except the "Ask the dossier" box the module mounts under its sheet (2026-09-11 evening,
   Andy: the question had disappeared from the latest version): it stays, under the page's
   result, on the same documents, with its own price card */
#sil-view #sil-slot.has-result #silmera-memo-panel { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
#sil-view #sil-slot.has-result #silmera-memo-panel #sm-ask-sheet { display: block !important; margin-top: 16px; }