/* ==========================================================================
   Bouwplanvergunning — splitsen-formulier [bpv_leadform_splitsen] v1.0.1 — 26-10-2026 (1.0.1: lettertype afdwingen tegen Salient)
   Zelfde uiterlijk als het leadformulier (css/leadform.css 1.2.0): witte kaart, Rajdhani/Montserrat,
   groen #3CAE49. Alles gescoped onder .bpv-lfs; de Salient-overrides onderaan alleen binnen
   #bpv-leadform-splitsen. Eigen klasse (niet .bpv-leadform) zodat leadform.js dit blok nooit oppakt.
   ========================================================================== */
.bpv-lfs{
  --bpv-groen:#3CAE49;--bpv-groen-donker:#2f8c3a;--bpv-groen-licht:#EBF7EC;
  --bpv-rand:#D6D9D6;--bpv-tekst:#202421;--bpv-groen-tekst:#2A7D34;--bpv-grijs:#6B716C;--bpv-fout:#C0392B;
  --bpv-radius:8px;--bpv-focusring:0 0 0 3px rgba(60,174,73,.18);
  font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:16px;line-height:1.5;color:var(--bpv-tekst);text-align:left;
  max-width:560px;margin:0 auto;background:#fff;border-radius:16px;
  padding:32px 28px;box-shadow:0 12px 44px rgba(0,0,0,.16);}
@media (max-width:520px){.bpv-lfs{padding:26px 18px}}
.bpv-lfs *{box-sizing:border-box}
.bpv-lfs h2{margin:0 0 6px;font-family:'Rajdhani','Montserrat',sans-serif;font-weight:700;font-size:1.9rem;line-height:1.15;letter-spacing:.01em}
.bpv-lfs .bpv-intro{margin:0 0 18px;color:var(--bpv-grijs);font-size:.93rem}
.bpv-lfs label{display:block;font-weight:600;font-size:.9rem;margin:16px 0 6px}
.bpv-lfs label .bpv-opt{color:var(--bpv-grijs);font-weight:400}
.bpv-lfs label .bpv-req{color:var(--bpv-fout)}
.bpv-lfs .bpv-hulp{font-size:.8rem;color:var(--bpv-grijs);margin:4px 0 0}
.bpv-lfs .bpv-hulp-boven{margin:-2px 0 8px}
.bpv-lfs .bpv-teller{text-align:right}
.bpv-lfs input[type=text],.bpv-lfs input[type=email],.bpv-lfs input[type=tel],.bpv-lfs textarea{width:100%;padding:12px 14px;border:1px solid var(--bpv-rand);border-radius:var(--bpv-radius);font:inherit;font-size:.95rem;background:#fff;color:inherit;transition:border-color .12s,box-shadow .12s}
.bpv-lfs textarea{min-height:90px;resize:vertical}
.bpv-lfs input::placeholder,.bpv-lfs textarea::placeholder{color:#9aa09b}
.bpv-lfs input:focus,.bpv-lfs textarea:focus{outline:2px solid transparent;outline-offset:2px;border-color:var(--bpv-groen);box-shadow:var(--bpv-focusring)}
.bpv-lfs .bpv-veldfout{border-color:var(--bpv-fout)!important}
.bpv-lfs .bpv-foutmelding{color:var(--bpv-fout);font-size:.8rem;margin:4px 0 0;display:none}
.bpv-lfs .bpv-rij{display:flex;gap:14px}.bpv-lfs .bpv-rij>div{flex:1;min-width:0}
@media (max-width:520px){.bpv-lfs .bpv-rij{flex-direction:column;gap:0}}
/* particulier/bedrijf */
.bpv-lfs .bpv-toggle{display:inline-flex;border:1px solid var(--bpv-rand);border-radius:var(--bpv-radius);overflow:hidden;background:#F3F5F3}
.bpv-lfs .bpv-toggle button{font:inherit;font-weight:600;font-size:.9rem;padding:10px 22px;border:0;background:transparent;color:var(--bpv-grijs);cursor:pointer;transition:background .12s,color .12s}
.bpv-lfs .bpv-toggle button[aria-pressed=true]{background:#fff;color:var(--bpv-tekst);box-shadow:inset 0 -3px 0 var(--bpv-groen)}
.bpv-lfs .bpv-toggle button:focus-visible{outline:2px solid var(--bpv-groen);outline-offset:-2px}
/* autocomplete */
.bpv-lfs .bpv-ac{position:relative}
.bpv-lfs .bpv-ac-lijst{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--bpv-rand);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.14);max-height:240px;overflow:auto;margin:0;padding:6px;list-style:none;display:none}
.bpv-lfs .bpv-ac-lijst li{padding:10px;border-radius:8px;cursor:pointer;font-size:.92rem;display:flex;gap:8px;align-items:center}
.bpv-lfs .bpv-ac-lijst li.bpv-actief,.bpv-lfs .bpv-ac-lijst li:hover{background:var(--bpv-groen-licht)}
.bpv-lfs .bpv-ac-lijst li .bpv-sub{color:var(--bpv-grijs);font-size:.82rem;margin-left:auto}
.bpv-lfs .bpv-ac-lijst li.bpv-ac-melding{color:var(--bpv-grijs);cursor:default;background:none}
/* traject: pillen met vinkvakje (zoals Lovable) */
.bpv-lfs .bpv-pills{display:flex;flex-wrap:wrap;gap:8px}
.bpv-lfs .bpv-pill{border:1px solid var(--bpv-rand);border-radius:999px;background:#fff;color:var(--bpv-grijs);font:inherit;font-size:.85rem;font-weight:500;padding:9px 16px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:border-color .12s,background .12s,color .12s}
.bpv-lfs .bpv-pill::before{content:"";width:16px;height:16px;border:1.5px solid var(--bpv-rand);border-radius:4px;flex:none;background:#fff;transition:background .12s,border-color .12s}
.bpv-lfs .bpv-pill:hover{border-color:var(--bpv-groen)}
.bpv-lfs .bpv-pill[aria-pressed=true]{border-color:var(--bpv-groen);color:var(--bpv-groen-tekst);background:var(--bpv-groen-licht);font-weight:600}
.bpv-lfs .bpv-pill[aria-pressed=true]::before{content:"\2713";border-color:var(--bpv-groen);background:var(--bpv-groen);color:#fff;font-size:.62rem;line-height:13px;text-align:center;font-weight:700}
.bpv-lfs .bpv-pill:focus-visible{outline:2px solid var(--bpv-groen);outline-offset:1px}
/* schakelaar "offerteadres wijkt af" */
.bpv-lfs .bpv-schakel{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:10px 12px;border:1px dashed var(--bpv-rand);border-radius:var(--bpv-radius)}
.bpv-lfs .bpv-schakel>span{font-weight:600;font-size:.88rem}
.bpv-lfs .bpv-schakelaar{position:relative;flex:none;width:44px;height:24px;border:0;border-radius:999px;background:#D6D9D6;cursor:pointer;padding:0;transition:background .15s}
.bpv-lfs .bpv-schakelaar span{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .15s}
.bpv-lfs .bpv-schakelaar[aria-checked=true]{background:var(--bpv-groen)}
.bpv-lfs .bpv-schakelaar[aria-checked=true] span{left:22px}
.bpv-lfs .bpv-schakelaar:focus-visible{outline:2px solid var(--bpv-groen);outline-offset:2px}
/* kennisgeving, knoppen, meldingen */
.bpv-lfs .bpv-kennisgeving{margin:18px 0 0;font-size:.8rem;line-height:1.45;color:var(--bpv-grijs)}
.bpv-lfs .bpv-kennisgeving a{color:var(--bpv-groen-tekst);text-decoration:underline}
.bpv-lfs .bpv-verstuur{width:100%;margin-top:14px;padding:14px;border:0;border-radius:10px;background:var(--bpv-groen);color:#fff;font:inherit;font-size:1rem;font-weight:700;cursor:pointer;transition:background .12s}
.bpv-lfs .bpv-verstuur:hover{background:var(--bpv-groen-donker)}
.bpv-lfs .bpv-verstuur:focus-visible{outline:2px solid var(--bpv-tekst);outline-offset:2px}
.bpv-lfs .bpv-verstuur:disabled{opacity:.6;cursor:wait}
.bpv-lfs .bpv-onder{margin-top:10px;text-align:center;font-size:.8rem;color:var(--bpv-grijs)}
.bpv-lfs .bpv-onder b{color:var(--bpv-tekst)}
.bpv-lfs .bpv-alert{display:none;margin-top:14px;padding:12px 14px;border-radius:var(--bpv-radius);font-size:.9rem}
.bpv-lfs .bpv-alert.bpv-fout{background:#fdecea;color:var(--bpv-fout)}
.bpv-lfs .bpv-alert a{color:inherit;font-weight:700;text-decoration:underline}
.bpv-lfs .bpv-verborgen{display:none!important}
/* upload */
.bpv-lfs .bpv-upload{margin-top:2px;border:2px dashed var(--bpv-rand);border-radius:10px;background:#FBFAF7;padding:22px 14px;text-align:center;cursor:pointer;display:flex;flex-direction:column;gap:4px;align-items:center;color:var(--bpv-grijs);transition:border-color .12s,background .12s}
.bpv-lfs .bpv-upload b{color:var(--bpv-tekst);font-weight:600;font-size:.9rem}
.bpv-lfs .bpv-upload span{font-size:.78rem}
.bpv-lfs .bpv-upload.bpv-sleep,.bpv-lfs .bpv-upload:hover{border-color:var(--bpv-groen);background:var(--bpv-groen-licht)}
.bpv-lfs .bpv-upload:focus-visible{outline:2px solid var(--bpv-groen);outline-offset:1px}
.bpv-lfs .bpv-upload-icoon{font-size:1.3rem;line-height:1;color:var(--bpv-groen)}
.bpv-lfs .bpv-upload-lijst{list-style:none;margin:8px 0 0;padding:0}
.bpv-lfs .bpv-upload-lijst li{display:flex;align-items:center;gap:8px;font-size:.86rem;padding:8px 10px;border:1px solid var(--bpv-rand);border-radius:8px;margin-top:6px}
.bpv-lfs .bpv-upload-lijst li .bpv-u-naam{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.bpv-lfs .bpv-upload-lijst li .bpv-u-status{margin-left:auto;color:var(--bpv-grijs);font-size:.8rem;white-space:nowrap}
.bpv-lfs .bpv-upload-lijst li.bpv-u-ok .bpv-u-status{color:var(--bpv-groen-tekst)}
.bpv-lfs .bpv-upload-lijst li.bpv-u-fout{border-color:var(--bpv-fout)}
.bpv-lfs .bpv-upload-lijst li.bpv-u-fout .bpv-u-status{color:var(--bpv-fout)}
.bpv-lfs .bpv-upload-lijst li .bpv-u-x{border:0;background:none;cursor:pointer;font-size:1rem;color:var(--bpv-grijs);padding:0 2px;line-height:1}
/* Gelukt!-kaart */
.bpv-lfs .bpv-klaar{text-align:center;padding:14px 0 6px}
.bpv-lfs .bpv-klaar-check{width:56px;height:56px;border-radius:50%;background:var(--bpv-groen);color:#fff;font-size:1.7rem;line-height:56px;text-align:center;margin:0 auto 14px;font-weight:700}
.bpv-lfs .bpv-klaar h2{margin-bottom:4px}
/* honeypot */
.bpv-lfs .bpv-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ==========================================================================
   Salient-overrides — zelfde regels als leadform.css, maar alleen binnen #bpv-leadform-splitsen.
   Salient zet op knoppen, velden en alinea's eigen regels, deels met !important.
   ========================================================================== */
#bpv-leadform-splitsen,#bpv-leadform-splitsen p,#bpv-leadform-splitsen label,#bpv-leadform-splitsen span,#bpv-leadform-splitsen b,#bpv-leadform-splitsen a,#bpv-leadform-splitsen li,#bpv-leadform-splitsen button,#bpv-leadform-splitsen input,#bpv-leadform-splitsen textarea{font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important}
#bpv-leadform-splitsen h2{font-family:'Rajdhani','Montserrat',sans-serif!important}
#bpv-leadform-splitsen p{padding:0!important}
#bpv-leadform-splitsen .bpv-intro{margin:0 0 18px!important}
#bpv-leadform-splitsen .bpv-hulp{margin:4px 0 0!important}
#bpv-leadform-splitsen .bpv-hulp-boven{margin:-2px 0 8px!important}
#bpv-leadform-splitsen .bpv-foutmelding{margin:4px 0 0!important}
#bpv-leadform-splitsen .bpv-kennisgeving{margin:18px 0 0!important}
#bpv-leadform-splitsen .bpv-onder{margin:10px 0 0!important}
#bpv-leadform-splitsen h2{color:var(--bpv-tekst)!important;letter-spacing:.01em!important;margin:0 0 6px!important;padding:0!important}
#bpv-leadform-splitsen label{font-weight:600!important;font-size:.9rem!important;margin:16px 0 6px!important;padding:0!important;text-transform:none!important;letter-spacing:normal!important;line-height:1.5!important;color:var(--bpv-tekst)!important}
#bpv-leadform-splitsen label .bpv-opt{font-weight:400!important;color:var(--bpv-grijs)!important}
#bpv-leadform-splitsen label .bpv-req{color:var(--bpv-fout)!important}
#bpv-leadform-splitsen input[type=text],#bpv-leadform-splitsen input[type=email],#bpv-leadform-splitsen input[type=tel],#bpv-leadform-splitsen textarea{background-color:#fff!important;border:1px solid var(--bpv-rand)!important;border-radius:var(--bpv-radius)!important;padding:12px 14px!important;font-size:.95rem!important;font-family:inherit!important;line-height:1.5!important;height:auto!important;margin:0!important;box-shadow:none!important;color:var(--bpv-tekst)!important;width:100%!important}
#bpv-leadform-splitsen textarea{min-height:90px!important}
#bpv-leadform-splitsen input:focus,#bpv-leadform-splitsen textarea:focus{border-color:var(--bpv-groen)!important;box-shadow:var(--bpv-focusring)!important;outline:2px solid transparent!important}
#bpv-leadform-splitsen .bpv-veldfout{border-color:var(--bpv-fout)!important}
#bpv-leadform-splitsen input::placeholder,#bpv-leadform-splitsen textarea::placeholder{color:#9aa09b!important;opacity:1!important}
#bpv-leadform-splitsen button{text-transform:none!important;letter-spacing:normal!important;height:auto!important;min-height:0!important;line-height:1.25!important;font-family:inherit!important;margin:0!important;box-shadow:none!important;transition:border-color .12s,background .12s,color .12s!important}
#bpv-leadform-splitsen .bpv-toggle button{border-radius:0!important;padding:10px 22px!important;font-size:.9rem!important;font-weight:600!important;background-color:transparent!important;color:var(--bpv-grijs)!important;border:0!important}
#bpv-leadform-splitsen .bpv-toggle button[aria-pressed=true]{background-color:#fff!important;color:var(--bpv-tekst)!important;box-shadow:inset 0 -3px 0 var(--bpv-groen)!important}
#bpv-leadform-splitsen .bpv-pill{border-radius:999px!important;padding:9px 16px!important;font-size:.85rem!important;font-weight:500!important;background-color:#fff!important;border:1px solid var(--bpv-rand)!important;color:var(--bpv-grijs)!important;line-height:1.3!important;width:auto!important}
#bpv-leadform-splitsen .bpv-pill:hover{border-color:var(--bpv-groen)!important}
#bpv-leadform-splitsen .bpv-pill[aria-pressed=true]{border-color:var(--bpv-groen)!important;background-color:var(--bpv-groen-licht)!important;color:var(--bpv-groen-tekst)!important;font-weight:600!important}
#bpv-leadform-splitsen .bpv-schakelaar{width:44px!important;height:24px!important;padding:0!important;border:0!important;border-radius:999px!important;background-color:#D6D9D6!important;transition:background .15s!important}
#bpv-leadform-splitsen .bpv-schakelaar[aria-checked=true]{background-color:var(--bpv-groen)!important}
#bpv-leadform-splitsen .bpv-verstuur{border-radius:10px!important;padding:14px!important;font-size:1rem!important;font-weight:700!important;background-color:var(--bpv-groen)!important;color:#fff!important;border:0!important;width:100%!important;line-height:1.5!important;margin-top:14px!important}
#bpv-leadform-splitsen .bpv-verstuur:hover{background-color:var(--bpv-groen-donker)!important}
#bpv-leadform-splitsen .bpv-verstuur:disabled{opacity:.6!important}
#bpv-leadform-splitsen .bpv-u-x{padding:0 2px!important;background:none!important;border:0!important;border-radius:0!important;font-size:1rem!important;color:var(--bpv-grijs)!important;font-weight:inherit!important;width:auto!important}
#bpv-leadform-splitsen ul{margin:0!important;padding:0!important;list-style:none!important}
#bpv-leadform-splitsen .bpv-ac-lijst{padding:6px!important}
#bpv-leadform-splitsen .bpv-upload-lijst{margin:8px 0 0!important}
#bpv-leadform-splitsen .bpv-upload-lijst li,#bpv-leadform-splitsen .bpv-ac-lijst li{margin:0!important;list-style:none!important}
#bpv-leadform-splitsen .bpv-upload-lijst li{margin-top:6px!important}
#bpv-leadform-splitsen .bpv-hp{position:absolute!important;left:-9999px!important}
