/* =============================================================================
   Проверка контрагента — /check/ and /check/<БИН>/
   Direction «Досье»: source rail on the left, blocks stacked on the right,
   the same shape as the act register so the two read as one product.

   Everything here is namespaced .cp-* and scoped under .cp-page. Tokens are
   declared on .cp-page and NOT on :root — extra_css renders after style.css,
   so a :root block here would win document-wide and repaint every control on
   the page (that is exactly what the old law list did with --radius and
   --primary). core/tests/test_counterparty_page.py asserts this file declares
   no :root.

   The four verdict states are the whole design problem. Three of them are
   flat tints; the fourth, «источник недоступен», is hatched and dashed on
   purpose. A flat neutral swatch still reads as a measured state — the hatch
   reads as a gap, which is what it is.
   ========================================================================== */

.cp-page {
  /* Neutrals carry a slight warm bias so they sit under the site's oxblood
     header rather than beside it. */
  --cp-paper: #faf8f7;
  --cp-card: #ffffff;
  --cp-sunk: #f3efee;
  --cp-ink: #1a1618;
  --cp-ink-soft: #5f5a5c;
  --cp-ink-faint: #8b8488;
  --cp-rule: #e6e0de;
  --cp-rule-soft: #f0ebea;
  --cp-brand: #730c0b;

  /* Semantic four. Pushed away from the brand oxblood on purpose: a risk red
     that reads as "the site's colour" stops reading as an alarm. */
  --cp-alert: #c2321b;
  --cp-alert-tint: #fbede9;
  --cp-alert-edge: #ebc4ba;
  --cp-watch: #a96b12;
  --cp-watch-tint: #fbf3e4;
  --cp-watch-edge: #e8d3ab;
  --cp-clear: #2c6e4b;
  --cp-clear-tint: #eaf3ee;
  --cp-clear-edge: #bedaca;
  --cp-unknown: #6e6a72;
  --cp-unknown-tint: #f1eff0;
  --cp-unknown-edge: #dad5d8;

  --cp-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* navbar.js measures the sticky header into --app-header-h; the rail and
     every scroll target read it rather than a constant, which is how the law
     reader stopped being wrong after the header gained a nav item. */
  --cp-sticky: calc(var(--app-header-h, 64px) + 12px);

  background: var(--cp-paper);
  color: var(--cp-ink);
}

/* --- shared furniture ---------------------------------------------------- */

.cp-page .cp-num {
  font-family: var(--cp-mono);
  font-variant-numeric: tabular-nums;
}

.cp-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 3px;
  border: 1px solid;
  white-space: nowrap;
}
.cp-chip::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex: none;
}
.cp-chip.is-alert { color: var(--cp-alert); background: var(--cp-alert-tint); border-color: var(--cp-alert-edge); }
.cp-chip.is-alert::before { background: var(--cp-alert); }
.cp-chip.is-watch { color: var(--cp-watch); background: var(--cp-watch-tint); border-color: var(--cp-watch-edge); }
.cp-chip.is-watch::before { background: var(--cp-watch); }
.cp-chip.is-clear { color: var(--cp-clear); background: var(--cp-clear-tint); border-color: var(--cp-clear-edge); }
.cp-chip.is-clear::before { background: var(--cp-clear); }
/* «Проверено, показывать нечего» — flat and solid, so it cannot be mistaken
   for the hatched «не проверено» below it. That difference is the point of the
   whole palette. */
.cp-chip.is-neutral {
  color: var(--cp-ink-soft);
  background: var(--cp-sunk);
  border-color: var(--cp-rule);
}
.cp-chip.is-neutral::before { background: var(--cp-ink-faint); }
.cp-chip.is-unknown {
  color: var(--cp-unknown);
  background: var(--cp-unknown-tint);
  border-color: var(--cp-unknown-edge);
  border-style: dashed;
}
.cp-chip.is-unknown::before {
  background: repeating-linear-gradient(45deg, var(--cp-unknown) 0 1.5px, transparent 1.5px 3.5px);
}

.cp-source-line {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 14px;
  font-size: 12px;
  color: var(--cp-ink-faint);
  margin-top: 8px;
}
.cp-source-line b { font-weight: 500; color: var(--cp-ink-soft); }

/* --- report shell -------------------------------------------------------- */

.cp-main { padding: 0 0 48px; }

.cp-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 0;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 20px;
  align-items: start;
}

.cp-rail {
  position: sticky;
  top: var(--cp-sticky);
  align-self: start;
  padding: 20px 0 24px;
  border-right: 1px solid var(--cp-rule);
  max-height: calc(100vh - var(--cp-sticky) - 16px);
  overflow-y: auto;
}
.cp-rail-title {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cp-ink-faint);
  font-weight: 600;
  padding: 0 16px 10px;
}
.cp-rail-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 16px;
  font-size: 13.5px;
  line-height: 1.35;
  color: var(--cp-ink-soft);
  text-decoration: none;
  border-left: 3px solid transparent;
}
.cp-rail-item:hover { background: var(--cp-sunk); color: var(--cp-ink); }
.cp-rail-item.is-current {
  border-left-color: var(--cp-brand);
  background: var(--cp-sunk);
  color: var(--cp-ink);
  font-weight: 500;
}
.cp-rail-item:focus-visible { outline: 2px solid var(--cp-brand); outline-offset: -2px; }
.cp-dot { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.cp-dot.is-alert { background: var(--cp-alert); }
.cp-dot.is-watch { background: var(--cp-watch); }
.cp-dot.is-clear { background: var(--cp-clear); }
.cp-dot.is-neutral { background: var(--cp-ink-faint); }
.cp-dot.is-unknown {
  background: repeating-linear-gradient(45deg, var(--cp-unknown) 0 1.5px, transparent 1.5px 3.5px);
  outline: 1px dashed var(--cp-unknown-edge);
}

.cp-body { padding: 20px 0 0 28px; min-width: 0; }

/* --- company head -------------------------------------------------------- */

.cp-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--cp-rule);
}
.cp-head h1 {
  font-size: clamp(21px, 2.6vw, 27px);
  font-weight: 700;
  line-height: 1.18;
  margin: 0 0 6px;
  text-wrap: balance;
}
.cp-head-meta { font-size: 13px; color: var(--cp-ink-faint); line-height: 1.6; }
/* The registry's own word for whether the entity still exists. Coloured
   because it outranks everything else on the page: a liquidated counterparty
   is not a risk to weigh, it is a counterparty that is not there. */
.cp-status-live { color: var(--cp-clear); font-weight: 600; }
.cp-status-dead { color: var(--cp-alert); font-weight: 700; }
.cp-verdict { text-align: right; flex: none; }
.cp-score {
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-family: var(--cp-mono);
}
.cp-score.is-alert { color: var(--cp-alert); }
.cp-score.is-watch { color: var(--cp-watch); }
.cp-score.is-clear { color: var(--cp-clear); }
.cp-score.is-unknown { color: var(--cp-unknown); }
.cp-score small { font-size: 15px; color: var(--cp-ink-faint); font-weight: 400; }
.cp-verdict-word { font-size: 13.5px; font-weight: 600; margin-top: 4px; }
.cp-confidence { font-size: 12px; color: var(--cp-ink-soft); margin-top: 4px; }

/* --- the incomplete-check banner ---------------------------------------- */
/* Deliberately loud and above the fold. A report where four registries never
   answered must say so before the reader reaches the green rows. */
.cp-incomplete {
  margin: 16px 0 0;
  padding: 13px 16px;
  border: 1px dashed var(--cp-unknown-edge);
  border-left: 3px solid var(--cp-unknown);
  background: var(--cp-unknown-tint);
  border-radius: 3px;
  font-size: 13.5px;
  color: var(--cp-ink-soft);
}
.cp-incomplete strong { color: var(--cp-ink); }

/* --- factor list --------------------------------------------------------- */

.cp-factors-title {
  font-size: 11px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--cp-ink-faint);
  font-weight: 600;
  margin: 24px 0 8px;
}
.cp-factors { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.cp-factor {
  border: 1px solid var(--cp-rule);
  border-left: 4px solid var(--cp-ink-faint);
  border-radius: 3px;
  background: var(--cp-card);
  padding: 9px 14px;
}
.cp-factor.is-alert { border-left-color: var(--cp-alert); border-color: var(--cp-alert-edge); }
.cp-factor.is-watch { border-left-color: var(--cp-watch); border-color: var(--cp-watch-edge); }
.cp-factor h3 { font-size: 14px; font-weight: 600; margin: 0 0 2px; }
.cp-factor p { margin: 0; font-size: 12.5px; color: var(--cp-ink-soft); }
.cp-factor-weight {
  float: right;
  font-family: var(--cp-mono);
  font-size: 12px;
  color: var(--cp-ink-faint);
}

/* --- source blocks ------------------------------------------------------- */

.cp-block {
  padding: 18px 0;
  border-bottom: 1px solid var(--cp-rule-soft);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 20px;
  scroll-margin-top: var(--cp-sticky);
}
.cp-block h2 { font-size: 16px; font-weight: 700; margin: 0 0 4px; }
.cp-answer { font-size: 14px; margin: 0; color: var(--cp-ink); }
.cp-block-right { text-align: right; }

.cp-detail {
  border: 1px solid var(--cp-rule);
  border-radius: 3px;
  padding: 10px 13px;
  font-size: 13px;
  margin-top: 10px;
  background: var(--cp-card);
}
.cp-detail.is-alert { background: var(--cp-alert-tint); border-color: var(--cp-alert-edge); }
.cp-detail.is-unknown {
  background: var(--cp-unknown-tint);
  border-style: dashed;
  border-color: var(--cp-unknown-edge);
  color: var(--cp-ink-soft);
}
.cp-detail dl { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 5px 16px; margin: 0; }
.cp-detail dt { color: var(--cp-ink-faint); font-size: 12.5px; }
.cp-detail dd { margin: 0; overflow-wrap: anywhere; }

.cp-records { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.cp-record {
  border-top: 1px solid var(--cp-rule-soft);
  padding-top: 8px;
  font-size: 13px;
}
.cp-record:first-child { border-top: 0; padding-top: 0; }
.cp-record-meta { color: var(--cp-ink-faint); font-size: 12px; overflow-wrap: anywhere; }

/* --- footer / disclaimer ------------------------------------------------- */

.cp-foot {
  margin-top: 26px;
  padding-top: 16px;
  border-top: 1px solid var(--cp-rule);
  font-size: 12.5px;
  color: var(--cp-ink-faint);
  max-width: 88ch;
}
.cp-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; }
.cp-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 4px;
  border: 1px solid var(--cp-rule);
  background: var(--cp-card);
  color: var(--cp-ink);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}
.cp-btn:hover { background: var(--cp-sunk); color: var(--cp-ink); }
.cp-btn.is-primary { background: var(--cp-brand); border-color: var(--cp-brand); color: #fff; }
.cp-btn.is-primary:hover { background: #8b0f0e; color: #fff; }
.cp-btn:focus-visible { outline: 2px solid var(--cp-brand); outline-offset: 2px; }

.cp-cta {
  margin-top: 26px;
  padding: 18px 20px;
  border: 1px solid var(--cp-rule);
  border-radius: 4px;
  background: var(--cp-card);
}
.cp-cta h2 { font-size: 17px; margin: 0 0 6px; }
.cp-cta p { margin: 0 0 12px; font-size: 14px; color: var(--cp-ink-soft); max-width: 70ch; }

/* --- search page --------------------------------------------------------- */

.cp-search-wrap { max-width: 980px; margin: 0 auto; padding: 32px 20px 56px; }
.cp-search-lede { font-size: 16px; color: var(--cp-ink-soft); max-width: 62ch; margin: 10px 0 0; }
.cp-search-form { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 8px; }
.cp-search-input {
  flex: 1 1 320px;
  min-width: 0;
  padding: 13px 16px;
  font-size: 17px;
  font-family: var(--cp-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  border: 1px solid var(--cp-rule);
  border-radius: 4px;
  background: var(--cp-card);
  color: var(--cp-ink);
}
.cp-search-input:focus-visible { outline: 2px solid var(--cp-brand); outline-offset: 1px; }
.cp-search-error {
  margin: 8px 0 0;
  color: var(--cp-alert);
  font-size: 14px;
  font-weight: 500;
}
.cp-search-hint { font-size: 13px; color: var(--cp-ink-faint); margin: 6px 0 0; }

.cp-avail { margin-top: 40px; border: 1px solid var(--cp-rule); border-radius: 4px; overflow: hidden; }
.cp-avail-head { padding: 15px 18px; background: var(--cp-sunk); border-bottom: 1px solid var(--cp-rule); }
.cp-avail-head h2 { font-size: 17px; margin: 0 0 5px; }
.cp-avail-head p { margin: 0; font-size: 13.5px; color: var(--cp-ink-soft); max-width: 78ch; }
/* Its own scroller: three columns of registry names do not fit a phone, and a
   table is the one thing allowed to run wider than the page — inside a box of
   its own, never by widening the body. */
.cp-avail-scroll { overflow-x: auto; }
.cp-avail-table { width: 100%; min-width: 480px; border-collapse: collapse; font-size: 13.5px; background: var(--cp-card); }
.cp-avail-table th {
  text-align: left;
  font-size: 11px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--cp-ink-faint);
  font-weight: 600;
  padding: 10px 16px;
  border-bottom: 1px solid var(--cp-rule);
}
.cp-avail-table td { padding: 11px 16px; border-bottom: 1px solid var(--cp-rule-soft); vertical-align: top; }
.cp-avail-table tr:last-child td { border-bottom: 0; }
.cp-avail-what { font-weight: 500; }
.cp-avail-who { color: var(--cp-ink-faint); font-size: 12.5px; }

/* --- narrow -------------------------------------------------------------- */

@media (max-width: 900px) {
  .cp-shell { grid-template-columns: minmax(0, 1fr); padding: 0 16px; }
  .cp-rail {
    position: static;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid var(--cp-rule);
    /* A horizontal strip on a phone: the rail is a state overview first and a
       navigation aid second, and the states must stay visible either way. */
    display: flex;
    overflow-x: auto;
    padding: 10px 0;
    gap: 6px;
  }
  .cp-rail-title { display: none; }
  .cp-rail-item { border-left: 0; border-bottom: 3px solid transparent; white-space: nowrap; padding: 6px 12px; }
  .cp-rail-item.is-current { border-left: 0; border-bottom-color: var(--cp-brand); }
  .cp-body { padding: 18px 0 0; }
  .cp-head { flex-direction: column; gap: 14px; }
  .cp-verdict { text-align: left; }
  .cp-block { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .cp-block-right { text-align: left; }
  .cp-source-line { justify-content: flex-start !important; }
  .cp-detail dl { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .cp-detail dt { margin-top: 6px; }
}

/* --- theme --------------------------------------------------------------- */
/* Light only, deliberately. style.css has no dark palette, so a dark block
   here produced a page with this feature's dark ground under the site's
   light-mode headings and header — headings rendered near-invisible. A single
   feature cannot opt the site into a theme the rest of it does not have. */

/* =============================================================================
   PRINT — the «Справка» form.
   People attach this to a contract, so the printed page is a document in its
   own right: it carries the company, the generation date, every source with
   its authority and publication date, and the disclaimer. The rail, the
   buttons and the lead CTA are not part of that document and are dropped.
   Nothing is hidden that a reader would need to evaluate the report.
   ========================================================================== */

@media print {
  .cp-page {
    --cp-paper: #fff;
    --cp-card: #fff;
    --cp-sunk: #fff;
    --cp-ink: #000;
    --cp-ink-soft: #333;
    --cp-ink-faint: #555;
    --cp-rule: #999;
    --cp-rule-soft: #ccc;
  }
  @page { margin: 16mm 14mm; }

  /* Site chrome is not part of the document. navbar.css already hides
     .header-main, but the search overlay, the category tabs and the chat widget
     are SIBLINGS of <header> (see the note at the top of base.html), so they
     survive that rule and printed on top of the report. Same list the law
     reader hides, for the same reason. */
  header.header-main,
  /* The mobile search bar is a sibling of <header> and is hidden on screen by
     Bootstrap's d-xl-none — a viewport-width utility, and print media is narrow,
     so it reappeared at the top of every printed report. */
  .site-search-row,
  .site-search-command,
  .site-tabs,
  .site-mobile-menu,
  .mobile-menu,
  .footer,
  .site-footer,
  .ai-chat-widget,
  #aiChatWidget,
  #siteSearchCommand,
  .cp-rail,
  .cp-actions,
  .cp-cta,
  .cp-search-form { display: none !important; }

  .cp-main { padding: 0; }

  .cp-shell { grid-template-columns: minmax(0, 1fr); max-width: none; padding: 0; }
  .cp-body { padding: 0; }
  .cp-print-head { display: block !important; }

  .cp-block {
    grid-template-columns: minmax(0, 1fr) 190px;
    /* A source and its verdict must never be split across a page break: half a
       finding on the bottom of page 1 is how a printed report gets misread. */
    break-inside: avoid;
    page-break-inside: avoid;
    padding: 10px 0;
  }
  .cp-head { break-after: avoid; }
  .cp-chip { border-width: 1px; padding: 2px 7px; }
  /* Tints do not survive a monochrome printer, so every state also carries a
     printed word — the chip's text — and the alert rows keep a rule. */
  .cp-detail.is-alert { border-left: 3px solid #000; }
  .cp-detail.is-unknown { border-style: dashed; }
  .cp-foot { break-inside: avoid; }
  a[href]::after { content: ""; }
}

.cp-print-head { display: none; }
