/* ============================================================
   ARBIQOR EXPOSE — evidence-based violation-report components.
   Rides on /arbiqor/arbiqor.css (base tokens, layout, nav, buttons)
   and /arbiqor/lens/lens.css (shared landing components — hero/sections/
   nav/footer/faq are reused verbatim from there + arbiqor.css).
   Only Expose-specific pieces live here: finding card, verbatim evidence
   quote, policy-reference line, channel badge, confidence meter,
   ready-to-submit draft box, and the red hard-stop disclaimer.
   ============================================================ */

/* ---------- Expose accent theme ----------
   Same layout as Arbiqor/Lens; only the accent swaps. expose.css loads
   AFTER arbiqor.css AND lens.css, so this :root wins and re-themes every
   var(--accent) use to violet — evidence / judgement / "case file", clearly
   distinct from Arbiqor amber and Lens cyan.
   Mirrors the EXACT property names lens.css overrides. */
:root{
  --accent:      #8b5cf6;
  --accent-dark: #7c3aed;
  --accent-ink:  #1e1b4b;   /* light text on the violet fill */
  --accent-rgb:  139,92,246;
}

/* status hues for findings / verdicts (accent = neutral/info) */
:root{
  --exp-stop:     #ef4444;   /* hard-stop, do-not-report red (reserved for the hard-stop box only) */
  --exp-stop-soft:rgba(239,68,68,.10);
  --exp-clear:    #22c55e;   /* "not reportable / cleared" green */
  --exp-warn:     #f59e0b;   /* arguable / human-review amber */
  --exp-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
  /* editorial palette — restrained, desaturated. Violation reads through a
     muted rose hairline + type, never a saturated fill or a thick block. */
  --exp-violation:    #b4546e;             /* desaturated rose — the only violation hue */
  --exp-violation-ln: rgba(180,84,110,.55);/* the thin left rule */
  --exp-head: 'Syne', system-ui, sans-serif;
}

/* ============================================================
   1. VIOLATION FINDING CARD
   Used for both "✓ Not reportable" (cleared) and the illustrative
   "violation found" example. Left border encodes the verdict.
   ============================================================ */
.finding{
  background:transparent;border:1px solid var(--border);
  padding:26px 28px;display:flex;flex-direction:column;gap:16px;
}
/* a single thin desaturated rule on the left encodes the verdict — no fill, no thick block */
.finding.is-clear{box-shadow:inset 2px 0 0 rgba(34,197,94,.5)}
.finding.is-violation{box-shadow:inset 2px 0 0 var(--exp-violation-ln)}
.finding.is-review{box-shadow:inset 2px 0 0 rgba(245,158,11,.5)}
.finding-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.finding-verdict{display:inline-flex;align-items:center;font-size:.7rem;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;white-space:nowrap;color:var(--text-muted)}
.finding.is-clear .finding-verdict{color:#5ea986}
.finding.is-violation .finding-verdict{color:var(--exp-violation)}
.finding.is-review .finding-verdict{color:var(--exp-warn)}
.finding-why{font-size:.7rem;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-muted);text-align:right}
.finding h4{font-size:1rem;line-height:1.3;margin:0}
.finding p{font-size:.88rem;line-height:1.55;color:var(--text-sub);margin:0}
.finding p b{color:var(--text)}

/* ============================================================
   2. VERBATIM EVIDENCE-QUOTE BLOCK
   Monospace, left violet border — "this is the exact text we'd cite".
   ============================================================ */
.evidence{
  font-family:var(--exp-mono);font-size:.85rem;line-height:1.72;
  color:var(--text-sub);background:rgba(var(--accent-rgb),.035);
  border:0;box-shadow:inset 2px 0 0 rgba(var(--accent-rgb),.5);
  padding:16px 20px;margin:0;white-space:pre-wrap;word-break:break-word;
}
.evidence::before{
  content:"VERBATIM FROM LISTING";display:block;
  font-family:var(--font);font-size:.58rem;font-weight:600;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:9px;
}
.evidence q{color:var(--text);quotes:none}
.evidence q::before,.evidence q::after{content:'"'}

/* ============================================================
   3. POLICY-REFERENCE LINE
   The exact Amazon policy clause that goes into the report.
   ============================================================ */
.policy-ref{
  display:flex;align-items:baseline;gap:10px;
  font-size:.82rem;line-height:1.55;color:var(--text-sub);
}
.policy-ref .pr-label{font-size:.58rem;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--text-muted);flex-shrink:0}
.policy-ref b{color:var(--text);font-weight:600}

/* ============================================================
   4. CHANNEL BADGE — REPORT_ABUSE (non-IP) / RaV (IP)
   ============================================================ */
.chan-badge{
  display:inline-flex;align-items:center;
  font-size:.64rem;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;
  padding:0 0 2px;border:0;border-bottom:1px solid rgba(var(--accent-rgb),.32);
  color:rgba(var(--accent-rgb),.92);background:transparent;white-space:nowrap;
}
.chan-badge.rav{border-bottom-color:rgba(245,158,11,.4);color:var(--exp-warn)}
.chan-badge.none{border-bottom:0;color:var(--text-muted);letter-spacing:1.2px}

/* ============================================================
   5. CONFIDENCE — typographic, no bar, no pill, no green.
   The score reads as a refined display number; "report candidate"
   is quiet muted-violet caps text, never a chip.
   ============================================================ */
.conf{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.conf-num{
  font-family:var(--exp-head);font-weight:700;font-size:2.1rem;line-height:.9;
  color:var(--text);letter-spacing:-.01em;font-variant-numeric:tabular-nums;
}
.conf-suffix{font-size:.62rem;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-muted)}
/* report-candidate flag — text only, muted violet, never a pill */
.conf-tag{
  margin-left:auto;font-size:.62rem;font-weight:600;letter-spacing:1.6px;
  text-transform:uppercase;color:rgba(var(--accent-rgb),.82);white-space:nowrap;
}

/* ============================================================
   6. READY-TO-SUBMIT DRAFT BOX
   The prepared report text + channel instructions + pre-submit checklist.
   ============================================================ */
.draft-box{background:var(--bg-2);border:1px solid var(--border);box-shadow:var(--shadow-card)}
.draft-bar{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--border);background:var(--bg-3);flex-wrap:wrap}
.draft-bar .dt{font-size:.72rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted)}
.draft-bar .draft-meta{margin-left:auto;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.draft-body{padding:18px}
.draft-text{
  font-family:var(--exp-mono);font-size:.84rem;line-height:1.65;color:var(--text);
  white-space:pre-wrap;word-break:break-word;margin:0;
}
.draft-text q{color:var(--accent)}
.draft-text q::before,.draft-text q::after{content:'"'}
.draft-foot{margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.draft-instr{display:flex;align-items:flex-start;gap:9px;font-size:.82rem;line-height:1.5;color:var(--text-sub);margin-bottom:14px}
.draft-instr svg{width:15px;height:15px;color:var(--accent);flex-shrink:0;margin-top:3px}
.draft-instr b{color:var(--text);font-weight:600}
.draft-check{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0}
.draft-check .dc-h{font-size:.6rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted)}
.draft-check li{display:flex;gap:10px;font-size:.84rem;line-height:1.5;color:var(--text-sub)}
.draft-check li svg{width:15px;height:15px;color:var(--accent);flex-shrink:0;margin-top:3px}

/* ============================================================
   7. RED HARD-STOP DISCLAIMER BOX
   The "do not submit if / you submit, not us" guardrail.
   ============================================================ */
.hardstop{
  background:var(--exp-stop-soft);border:1px solid rgba(239,68,68,.4);
  border-left:3px solid var(--exp-stop);padding:20px 22px;
  display:flex;gap:16px;align-items:flex-start;
}
.hardstop .hs-ic{
  width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;
  background:rgba(239,68,68,.14);color:var(--exp-stop);
}
.hardstop .hs-ic svg{width:20px;height:20px}
.hardstop h4{font-size:1rem;margin:0 0 7px;color:var(--exp-stop)}
.hardstop p{font-size:.88rem;line-height:1.6;color:var(--text-sub);margin:0}
.hardstop p b{color:var(--text)}
.hardstop ul{list-style:none;display:flex;flex-direction:column;gap:8px;margin:12px 0 0}
.hardstop li{display:flex;gap:10px;font-size:.86rem;line-height:1.5;color:var(--text-sub)}
.hardstop li svg{width:15px;height:15px;color:var(--exp-stop);flex-shrink:0;margin-top:3px}

/* ============================================================
   SAMPLE-REPORT WRAPPER (reuses Lens .lens-report rhythm; here for
   the registration banner + finding grid spacing on the Expose sample)
   ============================================================ */
.exp-report{display:flex;flex-direction:column;gap:34px}
.exp-report .lr-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 16px}
.exp-report .lr-head .verdict-0{font-family:var(--exp-head);font-size:2.2rem;font-weight:700;color:#5ea986;line-height:1;letter-spacing:-.01em}
/* found-violation counter — the primary "this tool finds things" headline number */
.exp-report .lr-head .verdict-found{font-family:var(--exp-head);font-size:2.2rem;font-weight:700;color:var(--text);line-height:1;letter-spacing:-.01em}
.exp-report .lr-head .lr-sub{font-size:.92rem;color:var(--text-muted)}

/* registration banner — "verified independently, REGISTERED".
   Editorial: near-transparent, a 1px hairline, a small caps label. */
.reg-banner{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  background:rgba(34,197,94,.04);border:1px solid rgba(34,197,94,.22);
  padding:18px 20px;
}
.reg-banner .reg-pill{display:inline-flex;align-items:center;font-size:.66rem;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;color:#5ea986;white-space:nowrap}
.reg-banner .reg-src{font-size:.84rem;color:var(--text-sub);line-height:1.55}
.reg-banner .reg-src b{color:var(--text);font-weight:600}
/* "NOT REGISTERED" state — a muted-red hairline, near-transparent wash, calm body. No fill. */
.reg-banner.is-bad{border-color:var(--exp-violation-ln);background:rgba(180,84,110,.04)}
.reg-banner .reg-pill.bad{color:var(--exp-violation)}

.finding-grid{display:flex;flex-direction:column;gap:16px}

/* a hairline divider between sections inside a finding — air, not boxes */
.finding .hairline{height:1px;background:var(--border);margin:2px 0;border:0}

/* sample caption — the "knows when to stay silent" punchline */
.exp-sample-cap{
  margin-top:8px;padding:16px 18px;background:var(--bg-3);border:1px solid var(--border);
  font-size:.95rem;line-height:1.6;color:var(--text-sub);
}
.exp-sample-cap b{color:var(--accent);font-weight:800}

/* compact precision-guarantee aside — the "won't false-flag a legit product"
   reassurance, kept small so the silence case no longer dominates the page */
.exp-guarantee{
  padding:22px 24px;background:transparent;border:1px solid var(--border);
  box-shadow:inset 2px 0 0 rgba(34,197,94,.5);
}
.exp-guarantee .finding-verdict{font-size:.7rem;letter-spacing:1.6px;color:#5ea986}
.exp-guarantee p{font-size:.86rem;line-height:1.6;color:var(--text-sub);margin:10px 0 0}
.exp-guarantee p b{color:var(--text);font-weight:600}

/* illustrative-example label (the only place a "violation found" is shown) */
.illus-label{
  display:inline-flex;align-items:center;gap:7px;font-size:.66rem;font-weight:800;
  letter-spacing:.7px;text-transform:uppercase;color:var(--exp-warn);
  border:1px dashed rgba(245,158,11,.5);padding:4px 10px;margin-bottom:4px;
}

@media(max-width:680px){
  .finding{padding:22px 20px}
  .finding-head{flex-direction:column;gap:8px}
  .finding-why{text-align:left}
  .conf-tag{margin-left:0}
}
