/* opvolging.css — de module Opvolging (bouwspec Offertes isolatie §6).
   Links de bellijst op kans × orderwaarde, rechts het gesprek. De opmaak
   blijft rustig: het werk zit in het gesprek, niet in het scherm.
   Alleen tokens. */
.ovg-wortel { max-width: 1240px; margin: 0 auto; width: 100%; padding: 26px 32px 72px;
  display: flex; flex-direction: column; gap: 12px; }
.ovg-kop { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.ovg-h1 { font-size: 24px; font-weight: 800; letter-spacing: -.02em; margin: 2px 0 0; }
.ovg-sub { font-size: .76rem; color: var(--c-ink-3); margin: 2px 0 0; line-height: 1.6; }
.ovg-sub a { color: var(--c-groen-d); }
.ovg-kop2 { font-size: .78rem; color: var(--c-ink-2); margin: 0; line-height: 1.6; }
.ovg-let { font-size: .72rem; color: var(--c-ink-3); font-style: italic; margin: 0; line-height: 1.6; }
.ovg-let a { color: var(--c-groen-d); font-weight: 700; }
.ovg-let2 { font-size: .74rem; color: var(--c-ink-2); margin: 0; line-height: 1.6; }

.ovg-twee { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1080px) { .ovg-twee { grid-template-columns: minmax(0, 1fr); } }
.ovg-kolL, .ovg-kolR { min-width: 0; }

/* de bellijst */
.ovg-lijst { display: flex; flex-direction: column; gap: 8px; }
.ovg-kaart { display: flex; flex-direction: column; gap: 4px; text-align: left; width: 100%;
  background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-left: 3px solid var(--c-lijn-2);
  border-radius: var(--radius); padding: 11px 13px; cursor: pointer; font-family: inherit;
  box-shadow: var(--schaduw-tegel); transition: border-color 160ms ease, background 160ms ease; }
.ovg-kaart.is-warm { border-left-color: var(--c-groen); }
.ovg-kaart.is-gekozen { background: var(--c-groen-t); border-color: var(--c-groen); }
.ovg-kaart:hover { border-color: var(--c-groen); }
.ovg-kr1 { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: .88rem; }
.ovg-kans { font-size: .74rem; font-weight: 800; color: var(--c-groen-d); }
.ovg-ks { font-size: .7rem; color: var(--c-ink-3); }
.ovg-pog { color: var(--c-amber); }
.ovg-sigs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.ovg-sig { font-size: .6rem; font-weight: 600; border-radius: 99px; padding: 1px 8px;
  border: var(--lijndikte) solid var(--c-lijn-2); color: var(--c-ink-3); }
.ovg-sig.is-warm { border-color: var(--c-groen); color: var(--c-groen-d); }
.ovg-sig.is-goed { border-color: var(--c-groen); background: var(--c-groen-t); color: var(--c-groen-d); }
.ovg-leeg { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 22px 18px; text-align: center; font-size: .86rem; font-weight: 700; color: var(--c-groen-d); }
.ovg-leeg span { display: block; margin-top: 5px; font-size: .72rem; font-weight: 400; color: var(--c-ink-3); }

/* het gesprek */
.ovg-detail { display: flex; flex-direction: column; gap: 11px; }
.ovg-h2 { margin: 2px 0 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.01em; }
.ovg-plaats { font-size: .8rem; font-weight: 600; color: var(--c-ink-3); }
.ovg-blok { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; box-shadow: var(--schaduw-tegel); }
.ovg-blok.is-notitie { background: var(--c-memo); border-color: var(--c-lijn-2); box-shadow: none; }
.ovg-blok.is-let { border-color: var(--c-amber); }
.ovg-blokkop { display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  font-size: .86rem; padding-bottom: 7px; border-bottom: var(--lijndikte) solid var(--c-lijn); }
.ovg-blokkop span { font-size: .58rem; letter-spacing: .07em; text-transform: uppercase; color: var(--c-ink-3); }
.ovg-sigrij { font-size: .78rem; padding: 2px 0; }
.ovg-notitie { margin: 0; font-size: .82rem; line-height: 1.55; }

.ovg-cadans { display: flex; gap: 6px; flex-wrap: wrap; }
.ovg-stap { flex: 1 1 100px; border: var(--lijndikte) solid var(--c-lijn-2); border-radius: var(--radius);
  padding: 7px 9px; font-size: .68rem; color: var(--c-ink-3); background: var(--c-paneel); }
.ovg-stap b { display: block; font-size: .6rem; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 2px; }
.ovg-stap.is-klaar { border-color: var(--c-groen); color: var(--c-groen-d); background: var(--c-groen-t); }
.ovg-stap.is-nu { border-color: var(--c-ink); color: var(--c-ink); background: #fff; font-weight: 700; }

.ovg-uitkomsten { display: flex; gap: 7px; flex-wrap: wrap; }
.ovg-gesprek { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; font-size: .74rem;
  padding: 5px 0; border-top: var(--lijndikte) solid var(--c-lijn); }
.ovg-gesprek:first-of-type { border-top: 0; }
.ovg-gesprek span:first-child { color: var(--c-ink-3); font-size: .66rem; }
.ovg-gesprek em { display: block; font-style: normal; font-size: .66rem; color: var(--c-ink-3); }

/* ── OI7 · Later terug, analyse en de adviseur-app ──────────────────── */
.ovg-groep { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 13px 15px; display: flex; flex-direction: column; gap: 7px; box-shadow: var(--schaduw-tegel); }
.ovg-groepkop { display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  font-size: .92rem; padding-bottom: 7px; border-bottom: var(--lijndikte) solid var(--c-lijn); }
.ovg-groepkop span { font-family: var(--font-mono); font-size: .74rem; color: var(--c-ink-3); }
.ovg-lrij { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; flex-wrap: wrap;
  padding: 9px 0; border-top: var(--lijndikte) solid var(--c-lijn); }
.ovg-lrij:first-of-type { border-top: 0; }
.ovg-lrij.is-vroeg { border-left: 3px solid var(--c-groen); padding-left: 10px; margin-left: -13px; }
.ovg-lrij .ovg-ks { display: block; }
.ovg-lacties { display: flex; gap: 6px; flex-wrap: wrap; }
.ovg-leeg2 { font-size: .76rem; color: var(--c-ink-3); margin: 0; }

.ovg-ana { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 8px 15px 14px; box-shadow: var(--schaduw-tegel); }
.ovg-anarij { display: grid; grid-template-columns: minmax(0,1.6fr) 70px 100px 110px minmax(80px,1fr);
  gap: 12px; align-items: center; padding: 9px 0; border-top: var(--lijndikte) solid var(--c-lijn); font-size: .8rem; }
.ovg-anarij--kop { border-top: 0; font-size: .6rem; letter-spacing: .07em; text-transform: uppercase; color: var(--c-ink-3); }
.ovg-anarij em { display: block; font-style: normal; font-size: .66rem; color: var(--c-ink-3); }
.ovg-balk { display: block; height: 7px; border-radius: 99px; background: var(--c-paneel); overflow: hidden; }
.ovg-balk i { display: block; height: 100%; background: var(--c-groen); }

.ovg-app { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.ovg-appkaart { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 12px 14px; display: flex; flex-direction: column; gap: 5px; box-shadow: var(--schaduw-tegel); }
.ovg-appkaart .btn { align-self: flex-start; margin-top: 4px; }

/* ── OI8 · de instellingen (§7): één plek voor alles wat de motor stuurt ── */
.ovg-cfg { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.ovg-cfgblok { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; box-shadow: var(--schaduw-tegel); }
.ovg-cfgrij { display: flex; align-items: center; gap: 10px; padding: 6px 0;
  border-top: var(--lijndikte) solid var(--c-lijn); font-size: .76rem; }
.ovg-cfgrij:first-of-type { border-top: 0; }
.ovg-cfgrij > span:first-child { flex: 1; min-width: 0; }
.ovg-cfgrij em { display: block; font-style: normal; font-size: .66rem; color: var(--c-ink-3); line-height: 1.45; }
.ovg-cfgrij input[type="number"], .ovg-cfgrij select { width: 86px; padding: 4px 7px; font-size: .76rem;
  border: var(--lijndikte) solid var(--c-lijn-2); border-radius: 7px; background: #fff; font-family: var(--font-mono); }
.ovg-cfgrij select { width: 128px; font-family: var(--font-ui); }
.ovg-cfgrij--vink { align-items: flex-start; }
.ovg-cfgrij--vink input { width: 17px; height: 17px; accent-color: var(--c-groen); margin-top: 2px; flex: 0 0 auto; }
.ovg-eh { font-size: .66rem; color: var(--c-ink-3); width: 34px; }
.ovg-vast { background: var(--c-paneel); border: var(--lijndikte) solid var(--c-lijn-2); border-radius: var(--radius);
  padding: 9px 11px; font-size: .7rem; line-height: 1.55; color: var(--c-ink-2); margin-top: 6px; }
.ovg-cfgvoet { background: #fff; border: var(--lijndikte) solid var(--c-lijn); border-radius: var(--radius);
  padding: 13px 15px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--schaduw-tegel); }
.ovg-cfgacties { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; }

/* ---- adres-motor (bouwspec OPVOLGING · wireframe v3) ---- */
.ov { max-width: 1240px; margin: 0 auto; padding: 0; }
.ov-kaart { background: var(--kaart); border: 1px solid var(--lijn); border-radius: var(--radius);
  box-shadow: var(--schaduw-kaart); overflow: hidden; margin-top: 14px; }
.ov-bakkop { display: flex; align-items: baseline; gap: 10px; padding: 10px 13px;
  border-bottom: 1px solid var(--lijn); background: var(--vlak); flex-wrap: wrap; }
.ov-bakkop b { font-size: 13px; }
.ov-bakkop span { font-size: 11px; color: var(--ink3); }
.ov-eind { margin-left: auto; }
.ov-lijf { padding: 11px 13px; }
.ov-leeg { padding: 22px; color: var(--ink3); line-height: 1.6; }
.ov-fout { padding: 12px 14px; border: 1px solid var(--stop); border-radius: var(--radius);
  background: var(--stop-t); color: var(--stop); margin-top: 14px; }
.ov-fijn { color: var(--ink3); font-size: 11px; line-height: 1.5; }
.ov-rechts { text-align: right; }
.ov-pil { display: inline-block; font-size: 10px; font-weight: 800; padding: 2px 8px; border-radius: var(--radius-pill); }
.ov-pil--goed { background: var(--goed-t); color: var(--goed); }
.ov-pil--let { background: var(--let-t); color: var(--let); }
.ov-pil--stop { background: var(--stop-t); color: var(--stop); }
.ov-pil--acc { background: var(--accent-t); color: var(--accent-d); }
.ov-pil--stil { background: var(--vlak); color: var(--ink2); }
.is-goed { color: var(--goed); }
.ov-bel { display: grid; grid-template-columns: minmax(0, 1fr) 110px 190px 130px; gap: 12px; align-items: center;
  padding: 10px 13px; border-bottom: 1px solid var(--lijn); cursor: pointer; font-size: 12.5px; }
.ov-bel:last-child { border-bottom: 0; }
.ov-bel:hover, .ov-bel:focus-visible { background: var(--vlak); }
.ov-bel.is-verzoek { border-left: 3px solid var(--goed); }
.ov-gesprek { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 14px; align-items: start; }
@media (max-width: 1100px) { .ov-gesprek { grid-template-columns: 1fr; } }
.ov-gesprek .ov-kaart:first-child { margin-top: 14px; }
.ov-tegel { border: 1px solid var(--lijn); border-radius: var(--radius-klein); padding: 10px 11px;
  margin-bottom: 9px; line-height: 1.55; font-size: 12.5px; }
.ov-tegel--goed { border-color: var(--goed); background: var(--goed-t); }
.ov-tegel h4 { margin: 0 0 6px; font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--ink3); }
.ov-tegel label { display: block; margin-bottom: 8px; font-size: 12px; }
.ov-tegel input { display: block; width: 100%; margin-top: 4px; font: inherit; border: 1px solid var(--lijn);
  border-radius: var(--radius-klein); padding: 5px 8px; background: var(--kaart); color: var(--ink); }
.ov-paar { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; font-size: 12.5px;
  align-items: flex-start; line-height: 1.5; }
.ov-paar--streep { border-top: 1px solid var(--lijn); margin-top: 4px; padding-top: 6px; }
.ov-uitk { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
@media (max-width: 900px) { .ov-uitk { grid-template-columns: 1fr 1fr; } }
.ov-uitk button { border: 1px solid var(--lijn); background: var(--kaart); border-radius: var(--radius-klein);
  padding: 9px 10px; font: inherit; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 3px; }
.ov-uitk button b { font-size: 12.5px; }
.ov-uitk button span { font-size: 10.5px; color: var(--ink3); }
.ov-uitk button.is-aan { border-color: var(--accent); background: var(--accent-t); }
.ov-spoor { display: grid; grid-template-columns: 64px 120px minmax(0, 1fr) 150px; gap: 11px;
  padding: 9px 13px; border-bottom: 1px solid var(--lijn); font-size: 12px; align-items: start; }
.ov-spoor:last-child { border-bottom: 0; }
.ov-dag { font-family: var(--font-mono); font-weight: 800; font-size: 11px; color: var(--ink2); }
.ov-twee { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 1000px) { .ov-twee { grid-template-columns: 1fr; } }
.ov-twee .ov-kaart { margin-top: 14px; }
