/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 11 2026 | 19:50:43 */
/* ============================================================
   cp-pages-vinculos.css — Mapa de Vínculos (cp-vin-)
   Página /mapa-de-vinculos/ (PageMapaVinculosHelper). 5a peça da vertical de
   Investigação Defensiva. Canvas + relatório client-side; nada sai do
   navegador. Doc: mapa-vinculos.md.
   Regras BuddyBoss: !important nas props visíveis (color, margin, padding,
   line-height, font-weight, text-decoration, font-size). Full-width breakout
   em TODAS as seções (CLAUDE.md §1/§4).
   ============================================================ */

:root { --cp-vin-line: #e3e3e8; --cp-vin-ink: #1a1a1a; --cp-vin-muted: #6b6b73; }

/* ── Cover ── */
.cp-vin-cover {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  background: var(--cp-preto, #1A1A1A);
  padding: 56px 20px 48px !important;
}
.cp-vin-cover-inner { max-width: var(--cp-page-max, 1100px); margin: 0 auto !important; }
.cp-vin-cover-eyebrow {
  color: var(--cp-amarelo, #F7D44A) !important;
  font-size: 13px !important; font-weight: 700 !important;
  letter-spacing: .08em; text-transform: uppercase; margin: 0 0 14px !important;
}
h1.cp-vin-cover-title {
  color: #fff !important; font-size: 40px !important;
  line-height: 1.15 !important; font-weight: 800 !important; margin: 0 0 14px !important;
}
.cp-vin-cover-deck {
  color: #d8d8dc !important; font-size: 17px !important;
  line-height: 1.6 !important; margin: 0 !important; max-width: 760px;
}
.cp-vin-cover-badge {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 22px 0 0 !important; padding: 8px 14px !important;
  border: 1px solid rgba(247, 212, 74, .45); border-radius: 999px;
  color: var(--cp-amarelo, #F7D44A) !important; font-size: 13px !important; font-weight: 600 !important;
}

/* ── Seções ── */
.cp-vin-sec {
  width: 100vw; margin-left: calc(-50vw + 50%);
  background: #fff; padding: 44px 20px !important;
}
.cp-vin-sec-alt { background: var(--cp-bg, #f4f4f6); }
.cp-vin-inner { max-width: var(--cp-page-max, 1100px); margin: 0 auto !important; }
.cp-vin-sec-kicker {
  color: #8a8a92 !important; font-size: 12px !important; font-weight: 700 !important;
  letter-spacing: .1em; text-transform: uppercase; margin: 0 0 8px !important;
}
h2.cp-vin-sec-title {
  color: var(--cp-preto, #1A1A1A) !important; font-size: 26px !important;
  line-height: 1.25 !important; font-weight: 800 !important; margin: 0 0 10px !important;
}
.cp-vin-sec-deck {
  color: #55555c !important; font-size: 15px !important; line-height: 1.6 !important;
  margin: 0 0 22px !important; max-width: 720px;
}

/* ── Caso / diligência ── */
.cp-vin-caso-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 16px; }
.cp-vin-field { display: flex; flex-direction: column; gap: 4px; }
.cp-vin-field label {
  font-size: 12px !important; color: var(--cp-vin-muted) !important; font-weight: 600 !important; margin: 0 !important;
}
.cp-vin-field input, .cp-vin-field textarea {
  border: 1px solid var(--cp-vin-line); border-radius: 8px;
  padding: 9px 11px !important; font-size: 14px !important; font-family: inherit; background: #fff;
  color: var(--cp-vin-ink) !important; line-height: 1.4 !important;
}
.cp-vin-field textarea { resize: vertical; min-height: 42px; }
.cp-vin-field-wide { grid-column: 1 / -1; }

/* ── Área de trabalho: grafo + painel ── */
.cp-vin-work { display: grid; grid-template-columns: 1fr 340px; gap: 18px; align-items: start; height: 600px; margin-top: 22px; }
.cp-vin-canvas-wrap { background: #fff; border: 1px solid var(--cp-vin-line); border-radius: 12px; overflow: hidden; position: relative; height: 100%; display: flex; flex-direction: column; }
.cp-vin-canvas-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 10px 12px !important; border-bottom: 1px solid var(--cp-vin-line); background: #fafafb; flex: 0 0 auto; }
.cp-vin-canvas-bar .cp-vin-count { margin-left: auto !important; font-size: 12px !important; color: var(--cp-vin-muted) !important; }
#cp-vin-svg { width: 100%; flex: 1 1 auto; min-height: 0; display: block; background: radial-gradient(circle at 1px 1px, #ececed 1px, transparent 0); background-size: 22px 22px; touch-action: none; cursor: grab; }
.cp-vin-empty { position: absolute; inset: 52px 0 0 0; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--cp-vin-muted) !important; font-size: 14px !important; pointer-events: none; padding: 20px !important; }

.cp-vin-node-label { font-size: 12px; font-weight: 600; fill: var(--cp-vin-ink); paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.cp-vin-edge-line { stroke: #b9b9c2; stroke-width: 1.6; }
.cp-vin-edge-label { font-size: 10.5px; fill: var(--cp-vin-muted); paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.cp-vin-node circle { cursor: grab; stroke: #fff; stroke-width: 2.5; }
.cp-vin-node.sel circle { stroke: var(--cp-amarelo, #F7D44A); stroke-width: 3.5; }
.cp-vin-node-ini { font-size: 12px; font-weight: 800; fill: #fff; text-anchor: middle; dominant-baseline: central; pointer-events: none; }

/* ── Painel lateral (preso à altura do grafo, rola por dentro) ── */
.cp-vin-panel { display: flex; flex-direction: column; gap: 14px; height: 100%; overflow-y: auto; padding-right: 4px; }
.cp-vin-panel::-webkit-scrollbar { width: 8px; }
.cp-vin-panel::-webkit-scrollbar-thumb { background: #d9d9df; border-radius: 8px; }
.cp-vin-card { background: #fff; border: 1px solid var(--cp-vin-line); border-radius: 12px; padding: 14px !important; flex: 0 0 auto; }
.cp-vin-card h3 { margin: 0 0 10px !important; font-size: 13px !important; text-transform: uppercase; letter-spacing: .04em; color: var(--cp-vin-muted) !important; font-weight: 700 !important; }

/* Acordeão dos blocos de adicionar (fechados por padrão) */
.cp-vin-acc { padding: 0 !important; }
.cp-vin-acc-h { width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px !important; background: none; border: 0; font-family: inherit; font-size: 13.5px !important; font-weight: 700 !important; color: var(--cp-vin-ink) !important; cursor: pointer; }
.cp-vin-acc-h .fa-chevron-down { color: var(--cp-vin-muted) !important; transition: transform .18s; font-size: 12px !important; }
.cp-vin-acc.open .cp-vin-acc-h .fa-chevron-down { transform: rotate(180deg); }
.cp-vin-acc-h > span { display: inline-flex; align-items: center; gap: 8px; }
.cp-vin-acc-b { display: none; padding: 0 14px 14px !important; }
.cp-vin-acc.open .cp-vin-acc-b { display: block; }

.cp-vin-in { width: 100%; box-sizing: border-box; border: 1px solid var(--cp-vin-line); border-radius: 8px; padding: 8px 10px !important; font-size: 13.5px !important; font-family: inherit; margin: 0 0 8px !important; background: #fff; color: var(--cp-vin-ink) !important; line-height: 1.4 !important; }
.cp-vin-row { display: flex; gap: 8px; }
.cp-vin-row > * { flex: 1; }
.cp-vin-help { font-size: 11.5px !important; color: var(--cp-vin-muted) !important; margin: -2px 0 8px !important; line-height: 1.45 !important; }
.cp-vin-err { font-size: 12px !important; color: #c0392b !important; margin: 2px 0 8px !important; display: none; }
.cp-vin-err.on { display: block; }

.cp-vin-btn { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--cp-vin-line); background: #fff; color: var(--cp-vin-ink) !important; padding: 8px 12px !important; border-radius: 8px; font-size: 13px !important; font-weight: 600 !important; cursor: pointer; font-family: inherit; text-decoration: none !important; }
.cp-vin-btn:hover { background: #f4f4f6; }
.cp-vin-btn-dark { background: var(--cp-preto, #1a1a1a); color: #fff !important; border-color: var(--cp-preto, #1a1a1a); }
.cp-vin-btn-primary { background: var(--cp-amarelo, #F7D44A); border-color: var(--cp-amarelo, #F7D44A); color: #1a1a1a !important; font-weight: 700 !important; }
.cp-vin-btn-ghost { background: transparent; }
.cp-vin-btn-sm { padding: 5px 9px !important; font-size: 12px !important; }

.cp-vin-list { list-style: none; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 6px; }
.cp-vin-list:empty::after { content: 'Nada por aqui ainda.'; color: var(--cp-vin-muted) !important; font-size: 12.5px !important; }
.cp-vin-li { display: flex; align-items: center; gap: 9px; padding: 7px 9px !important; border: 1px solid var(--cp-vin-line); border-radius: 8px; font-size: 13px !important; color: var(--cp-vin-ink) !important; }
.cp-vin-li .cp-vin-ico { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; font-size: 11px !important; flex: 0 0 auto; }
.cp-vin-li .cp-vin-li-main { flex: 1; min-width: 0; }
.cp-vin-li .cp-vin-li-main b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700 !important; }
.cp-vin-li .cp-vin-li-main small { color: var(--cp-vin-muted) !important; font-size: 11.5px !important; }
.cp-vin-li .cp-vin-x { cursor: pointer; color: #b9b9c2 !important; padding: 2px 4px !important; }
.cp-vin-li .cp-vin-x:hover { color: #c0392b !important; }

/* ── Relatório (Provimento 188) ── */
.cp-vin-report { background: #fff; border: 1px solid var(--cp-vin-line); border-radius: 12px; padding: 22px 24px !important; margin-top: 22px !important; }
.cp-vin-report[hidden] { display: none; }
.cp-vin-report h2 { font-size: 18px !important; margin: 0 0 4px !important; color: var(--cp-vin-ink) !important; font-weight: 800 !important; }
.cp-vin-doc { border: 1px solid var(--cp-vin-line); border-radius: 8px; padding: 18px 20px !important; margin: 12px 0 !important; font-size: 13.5px !important; line-height: 1.55 !important; color: var(--cp-vin-ink) !important; }
.cp-vin-doc h4 { margin: 14px 0 4px !important; font-size: 13px !important; text-transform: uppercase; letter-spacing: .03em; color: var(--cp-vin-muted) !important; font-weight: 700 !important; }
.cp-vin-doc h4:first-child { margin-top: 0 !important; }
.cp-vin-doc p { margin: 0 0 8px !important; line-height: 1.55 !important; color: var(--cp-vin-ink) !important; font-size: 13.5px !important; }
.cp-vin-doc table { width: 100%; border-collapse: collapse; margin: 6px 0 !important; font-size: 12.5px !important; }
.cp-vin-doc th, .cp-vin-doc td { border: 1px solid var(--cp-vin-line); padding: 6px 8px !important; text-align: left; vertical-align: top; color: var(--cp-vin-ink) !important; }
.cp-vin-doc th { background: #fafafb; font-weight: 700 !important; }
.cp-vin-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px !important; }

/* ── Disclaimer ── */
.cp-vin-disclaimer {
  display: flex; gap: 12px; align-items: flex-start;
  background: #fff; border: 1px solid var(--cp-vin-line); border-left: 3px solid var(--cp-amarelo, #F7D44A);
  border-radius: 10px; padding: 16px 18px !important;
  color: #55555c !important; font-size: 13.5px !important; line-height: 1.6 !important;
}
.cp-vin-disclaimer .fa { color: var(--cp-amarelo, #F7D44A) !important; font-size: 18px !important; margin-top: 2px; }

/* ── Responsivo ── */
@media (max-width: 900px) {
  h1.cp-vin-cover-title { font-size: 30px !important; }
  .cp-vin-work { grid-template-columns: 1fr; height: auto; }
  #cp-vin-svg { height: 440px; flex: 0 0 auto; }
  .cp-vin-panel { height: auto; overflow: visible; }
  .cp-vin-caso-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .cp-vin-caso-grid { grid-template-columns: 1fr; }
}

/* ── Impressão: só o relatório ── */
@media print {
  body.cp-vin-printing * { visibility: hidden !important; }
  body.cp-vin-printing #cp-vin-report, body.cp-vin-printing #cp-vin-report * { visibility: visible !important; }
  body.cp-vin-printing #cp-vin-report { position: absolute; inset: 0; margin: 0 !important; border: none !important; }
  body.cp-vin-printing .cp-vin-actions { display: none !important; }
}