/**
 * BPM-calculator — layout naar auto-importeren.nl mockup (Inter, kleuren, card).
 * Alles onder .auto-importeren-bpmcalc om thema-conflicten te beperken.
 */

.auto-importeren-bpmcalc {
  --bpm-midnight: #040649;
  --bpm-brilliant: #3c2ced;
  --bpm-offwhite: #fafafa;
  --bpm-offblack: #1c1c1c;
  --bpm-pink: #ff5cf4;
  --bpm-border: #e2e2e8;
  --bpm-sum-border: #c7c7f5;
  --bpm-section-gap: 16px;
  max-width: 580px;
  margin: 0 auto;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: var(--bpm-offblack);
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.auto-importeren-bpmcalc *,
.auto-importeren-bpmcalc *::before,
.auto-importeren-bpmcalc *::after {
  box-sizing: border-box;
}

/* --- Kaart (formulier) --- */
.auto-importeren-bpmcalc__page {
  background: #fff;
  border: 1.5px solid var(--bpm-border);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 16px;
}

.auto-importeren-bpmcalc__topbar {
  background: var(--bpm-midnight);
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.auto-importeren-bpmcalc__topbarLogo {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}

.auto-importeren-bpmcalc__topbarPhone {
  color: #8fa8cc;
  font-size: 12px;
}

.auto-importeren-bpmcalc__body {
  padding: 28px 28px 32px;
  background: var(--bpm-offwhite);
}

.auto-importeren-bpmcalc__pageTitle {
  font-size: 22px;
  font-weight: 700;
  color: var(--bpm-midnight);
  margin: 0 0 6px;
  line-height: 1.25;
}

.auto-importeren-bpmcalc__pageSub {
  font-size: 14px;
  color: #6b7280;
  margin: 0 0 22px;
  line-height: 1.55;
}

/* Tabs */
.auto-importeren-bpmcalc__tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}

.auto-importeren-bpmcalc__tab {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 1.5px solid var(--bpm-border);
  border-radius: 10px;
  padding: 14px 16px;
  cursor: pointer;
  background: #fff;
  text-align: left;
  transition: border-color 0.15s, background 0.15s;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}

.auto-importeren-bpmcalc__tab.on {
  border-color: var(--bpm-brilliant);
  background: #f0effe;
}

/* Geen gekleurde achtergrond bij hover (thema’s overschrijven vaak button:hover) */
.auto-importeren-bpmcalc__tab:hover {
  background: #fff !important;
}

.auto-importeren-bpmcalc__btnUnlock auto-importeren-bpmcalc__btnUnlock--full:hover{
  background: none !important;

}

.auto-importeren-bpmcalc__tab.on:hover {
  background: #fff !important;
}

.auto-importeren-bpmcalc__tabTitle {
  display: block;
  width: 100%;
  font-size: 13px;
  font-weight: 600;
  color: var(--bpm-midnight);
  margin: 0 0 3px;
}

.auto-importeren-bpmcalc__tabSub {
  display: block;
  width: 100%;
  font-size: 11px;
  color: #9ca3af;
  margin: 0;
}

/* Velden */
.auto-importeren-bpmcalc__fl {
  font-size: 13px;
  font-weight: 500;
  color: var(--bpm-offblack);
  margin: 0 0 6px;
  display: block;
}

.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__fh {
  font-size: 11px !important;
  color: #9ca3af !important;
  line-height: 1.45;
  margin: 4px 0 0 !important;
}

.auto-importeren-bpmcalc__fg {
  margin-bottom: 16px;
}

.auto-importeren-bpmcalc__frow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.auto-importeren-bpmcalc__sw {
  position: relative;
}

.auto-importeren-bpmcalc__sw::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid #6b7280;
  pointer-events: none;
}

.auto-importeren-bpmcalc__body input[type='text'],
.auto-importeren-bpmcalc__body input[type='email'],
.auto-importeren-bpmcalc__body input[type='tel'],
.auto-importeren-bpmcalc__body input[type='number'],
.auto-importeren-bpmcalc__body input[type='url'],
.auto-importeren-bpmcalc__body select,
.auto-importeren-bpmcalc__manualNotice input[type='text'],
.auto-importeren-bpmcalc__manualNotice input[type='email'],
.auto-importeren-bpmcalc__manualNotice input[type='tel'] {
  width: 100%;
  height: 42px;
  border: 1.5px solid var(--bpm-border);
  border-radius: 8px;
  padding: 0 12px;
  font-size: 16px;
  font-family: inherit;
  background: #fff;
  color: var(--bpm-offblack);
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.15s;
}

.auto-importeren-bpmcalc__body select {
  padding-right: 32px;
}

.auto-importeren-bpmcalc__body input:focus,
.auto-importeren-bpmcalc__body select:focus,
.auto-importeren-bpmcalc__manualNotice input:focus {
  outline: none;
  border-color: var(--bpm-brilliant);
}

.auto-importeren-bpmcalc input::placeholder,
.auto-importeren-bpmcalc textarea::placeholder {
  color: #9ca3af;
  opacity: 1;
}

.auto-importeren-bpmcalc__field[hidden],
.auto-importeren-bpmcalc__fg[hidden] {
  display: none !important;
}

/* Primaire knoppen */
.auto-importeren-bpmcalc__btnPrimary {
  width: 100%;
  height: 48px;
  background: var(--bpm-brilliant);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  padding: 0 14px;
  white-space: normal;
}

.auto-importeren-bpmcalc__btnPrimary:hover {
  background: #2d20d4;
}

.auto-importeren-bpmcalc__btnUnlock {
  width: 100%;
  height: 46px;
  background: var(--bpm-brilliant);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  padding: 0 14px;
  white-space: normal;
}

.auto-importeren-bpmcalc__btnBack {
  background: #fff;
  color: var(--bpm-midnight);
  border: 1.5px solid var(--bpm-border);
  border-radius: 10px;
  padding: 0 18px;
  height: 46px;
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
}

.auto-importeren-bpmcalc__btnBack:hover {
  background: #f3f4f6;
}

.auto-importeren-bpmcalc__actionsRow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}

.auto-importeren-bpmcalc__actionsRow .auto-importeren-bpmcalc__btnUnlock {
  flex: 1;
  min-width: 160px;
}

/* Divider + help */
.auto-importeren-bpmcalc__divider {
  border: none;
  border-top: 1px solid #e5e7eb;
  margin: 20px 0;
}

.auto-importeren-bpmcalc__helpBlock {
  display: flex;
  align-items: center;
  gap: 10px;
}

.auto-importeren-bpmcalc__helpIcon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #eeedfd;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.auto-importeren-bpmcalc__helpText {
  font-size: 13px;
  color: #6b7280;
  margin: 0;
}

.auto-importeren-bpmcalc__helpNum {
  font-size: 13px;
  color: var(--bpm-brilliant);
  font-weight: 600;
  text-decoration: none;
}

.auto-importeren-bpmcalc__helpNum:hover {
  text-decoration: underline;
}

/* URL / scrape */
.auto-importeren-bpmcalc__scrapeStatus {
  margin-top: 8px;
  font-size: 13px;
  color: #6b7280;
}

/* Stap 2 — capture box */
.auto-importeren-bpmcalc__capBox {
  background: #fff;
  border: 1.5px solid #c7c7f5;
  border-radius: 12px;
  padding: 18px 20px;
  margin-top: 4px;
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.auto-importeren-bpmcalc__capBox input,
.auto-importeren-bpmcalc__capBox button {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__capTitle {
  font-size: 15px;
  font-weight: 700;
  color: var(--bpm-midnight);
  margin: 0 0 6px !important;
  line-height: 1.35;
}

.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__capSub {
  font-size: 13px;
  color: #6b7280;
  margin: 0 0 12px !important;
  line-height: 1.55;
}

.auto-importeren-bpmcalc__capBox input[type='email'] {
  margin-bottom: 12px;
}

.auto-importeren-bpmcalc__capBox--inResult {
  padding: 20px 22px;
  margin-top: var(--bpm-section-gap);
  margin-bottom: 0;
  border: 1.5px solid var(--bpm-sum-border);
}

.auto-importeren-bpmcalc__leadFields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.auto-importeren-bpmcalc__leadFields .auto-importeren-bpmcalc__fg {
  margin-bottom: 0;
}

.auto-importeren-bpmcalc__leadFields .auto-importeren-bpmcalc__fg--phone {
  grid-column: 1 / -1;
}

.auto-importeren-bpmcalc__leadFields input[type='text'],
.auto-importeren-bpmcalc__leadFields input[type='email'],
.auto-importeren-bpmcalc__leadFields input[type='tel'] {
  margin-bottom: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__leadFields {
  grid-template-columns: 1fr;
}

@media (max-width: 520px) {
  .auto-importeren-bpmcalc__leadFields {
    grid-template-columns: 1fr;
  }
}

.auto-importeren-bpmcalc__leadFrow {
  margin-bottom: 14px;
}

.auto-importeren-bpmcalc__leadFrow input[type='text'],
.auto-importeren-bpmcalc__leadFrow input[type='email'],
.auto-importeren-bpmcalc__leadFrow input[type='tel'] {
  margin-bottom: 0;
}

.auto-importeren-bpmcalc__optional {
  font-weight: 400;
  color: #6b7280;
}

.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__phoneHint {
  margin: 6px 0 0 !important;
  color: #9ca3af !important;
  font-size: 11px !important;
  line-height: 1.45;
}

.auto-importeren-bpmcalc__btnUnlock--full {
  width: 100%;
  margin-top: 4px;
}

.auto-importeren-bpmcalc__leadStatus {
  margin: 10px 0 0;
  font-size: 13px;
  color: #b45309;
  min-height: 1.2em;
}

.auto-importeren-bpmcalc__leadStatus.is-success {
  color: var(--bpm-midnight);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin: 0 !important;
  padding: 12px 0;
  text-align: center;
  line-height: 1.55;
}

.auto-importeren-bpmcalc__confirmationTitle {
  font-size: 16px;
  font-weight: 700;
}

.auto-importeren-bpmcalc__confirmationText {
  max-width: 460px;
  font-size: 13px;
  font-weight: 400;
}

.auto-importeren-bpmcalc__confirmationTeam {
  font-size: 14px;
  font-weight: 700;
}

.auto-importeren-bpmcalc__leadStatus:empty {
  display: none;
}

.auto-importeren-bpmcalc__pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.auto-importeren-bpmcalc__pill {
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 20px;
  background: #f0fdf4;
  color: #166534;
  font-weight: 500;
  border: 1px solid #86efac;
}

.auto-importeren-bpmcalc__step--hidden {
  display: none !important;
}

.auto-importeren-bpmcalc__status {
  margin: 12px 0 0;
  font-size: 13px;
  color: #6b7280;
}

.auto-importeren-bpmcalc__status:empty {
  display: none;
}

/* Handmatige melding + lead (zelfde formulier als bij resultaat) */
.auto-importeren-bpmcalc__manualNotice {
  margin: 0 0 16px;
  padding: 0;
  background: transparent;
  border: none;
}

.auto-importeren-bpmcalc__manualNotice .auto-importeren-bpmcalc__capBox--manualLead {
  margin-top: 0;
}

.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__capSub--manualFollowup {
  margin-bottom: 14px !important;
}

.auto-importeren-bpmcalc__capBox--manualLead .auto-importeren-bpmcalc__pills {
  margin-bottom: 14px;
}

/* Resultaatkaart (tweede page) */
.auto-importeren-bpmcalc__result {
  margin-top: 24px;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.auto-importeren-bpmcalc [data-bpmcalc-step='2'] {
  scroll-margin-top: calc(12px + env(safe-area-inset-top, 0px));
}

.auto-importeren-bpmcalc__page--result .auto-importeren-bpmcalc__body {
  padding-top: 24px;
}

.auto-importeren-bpmcalc__resultSubline {
  font-size: 14px;
  color: #6b7280;
  margin: 0 0 18px;
  line-height: 1.5;
}

.auto-importeren-bpmcalc__sumcard {
  background: #fff;
  border: 1.5px solid var(--bpm-sum-border);
  border-radius: 14px;
  padding: 20px 22px;
  margin-bottom: 14px;
}

[data-bpmcalc-result-summary] {
  scroll-margin-top: calc(12px + env(safe-area-inset-top, 0px));
}

.auto-importeren-bpmcalc__sumSec {
  font-size: 13px;
  font-weight: 700;
  color: var(--bpm-midnight);
  margin: 0 0 4px;
}

.auto-importeren-bpmcalc__sumSpacer {
  height: 12px;
}

.auto-importeren-bpmcalc__sumRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  gap: 12px;
}

.auto-importeren-bpmcalc__sumRow--last {
  border-bottom: none;
}

.auto-importeren-bpmcalc__sumL {
  font-size: 14px;
  color: var(--bpm-offblack);
  min-width: 0;
}

.auto-importeren-bpmcalc__sumV {
  font-size: 14px;
  color: var(--bpm-offblack);
  text-align: right;
  font-variant-numeric: tabular-nums;
  justify-self: end;
  white-space: nowrap;
}

.auto-importeren-bpmcalc__sumV--discount {
  color: #16a34a;
}

.auto-importeren-bpmcalc__sumHr {
  border: none;
  border-top: 1.5px solid #e5e7eb;
  margin: 8px 0;
}

.auto-importeren-bpmcalc__sumTotal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: 10px 0 0;
  gap: 12px;
}

.auto-importeren-bpmcalc__sumTl {
  font-size: 15px;
  font-weight: 700;
  color: var(--bpm-midnight);
}

.auto-importeren-bpmcalc__sumTv {
  font-size: 15px;
  font-weight: 700;
  color: var(--bpm-brilliant);
  font-variant-numeric: tabular-nums;
  justify-self: end;
  white-space: nowrap;
}

/* Neutrale disclaimer onderaan de resultaatpagina */
.auto-importeren-bpmcalc__disc {
  font-size: 11px;
  font-weight: 400;
  color: #9ca3af;
  background: transparent;
  border: 0;
  border-top: 1px solid #e5e7eb;
  border-radius: 0;
  padding: var(--bpm-section-gap) 0 0;
  margin: var(--bpm-section-gap) 0 0;
  line-height: 1.55;
}

.auto-importeren-bpmcalc__disc p {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit;
  line-height: inherit;
  margin: 0 0 8px !important;
}

.auto-importeren-bpmcalc__disc p:last-child {
  margin-bottom: 0;
}

/* WhatsApp / bel */
.auto-importeren-bpmcalc p.auto-importeren-bpmcalc__or {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: #6b7280;
  margin: 24px 0 !important;
  line-height: 1.4;
  white-space: nowrap;
}

.auto-importeren-bpmcalc__or::before,
.auto-importeren-bpmcalc__or::after {
  content: '';
  height: 1px;
  background: #d1d5db;
  flex: 1 1 auto;
}

.auto-importeren-bpmcalc__primaryCtas {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  margin-top: var(--bpm-section-gap);
}

.auto-importeren-bpmcalc__btnWa {
  width: 100%;
  height: 52px;
  background: #25d366;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-decoration: none;
  text-align: center;
  line-height: 1.2;
  padding: 0 14px;
  white-space: normal;
}

.auto-importeren-bpmcalc__btnWa:hover {
  background: #1ebe5d;
  color: #fff;
}

.auto-importeren-bpmcalc__btnBel {
  width: 100%;
  height: 52px;
  background: var(--bpm-brilliant);
  color: #fff;
  border: 1.5px solid var(--bpm-brilliant);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 0;
  text-decoration: none;
  text-align: center;
  line-height: 1.2;
  padding: 0 14px;
  white-space: normal;
}

.auto-importeren-bpmcalc__btnBel:hover {
  background: #2f21c8;
  color: #fff;
}

.auto-importeren-bpmcalc__capBox--emailForm {
  margin-top: 0;
  padding-bottom: 20px;
}

/* Social proof */
.auto-importeren-bpmcalc__socialProof {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 14px;
}

.auto-importeren-bpmcalc__spItem {
  font-size: 11px;
  color: #9ca3af;
  display: flex;
  align-items: center;
  gap: 4px;
}

.auto-importeren-bpmcalc__spDot {
  color: #040649;
  font-size: 14px;
}

/* WordPress-thema’s: koppen en formulier vaak globaal gestyled — mock-afmetingen afdwingen */
.auto-importeren-bpmcalc h1.auto-importeren-bpmcalc__pageTitle {
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--bpm-midnight) !important;
}

.auto-importeren-bpmcalc label.auto-importeren-bpmcalc__fl {
  font-size: 13px !important;
  font-weight: 500 !important;
  display: block !important;
  margin: 0 0 6px !important;
  color: var(--bpm-offblack) !important;
}

.auto-importeren-bpmcalc input[type='text'],
.auto-importeren-bpmcalc input[type='email'],
.auto-importeren-bpmcalc input[type='tel'],
.auto-importeren-bpmcalc input[type='number'],
.auto-importeren-bpmcalc input[type='url'],
.auto-importeren-bpmcalc .auto-importeren-bpmcalc__body select {
  max-width: 100% !important;
}

@media (max-width: 782px) {
  .auto-importeren-bpmcalc {
    width: 100%;
  }

  [data-bpmcalc-result-summary] {
    scroll-margin-top: calc(16px + env(safe-area-inset-top, 0px));
  }
  .auto-importeren-bpmcalc [data-bpmcalc-step='2'] {
    scroll-margin-top: calc(16px + env(safe-area-inset-top, 0px));
  }
  .auto-importeren-bpmcalc__body {
    padding: 22px 18px 26px;
  }
  .auto-importeren-bpmcalc__frow {
    grid-template-columns: 1fr;
  }

  .auto-importeren-bpmcalc__result {
    margin-top: 16px;
  }

  .auto-importeren-bpmcalc__sumcard {
    padding: 16px;
  }

  .auto-importeren-bpmcalc__capBox--inResult,
  .auto-importeren-bpmcalc__capBox--emailForm {
    padding: 16px;
  }

  .auto-importeren-bpmcalc__sumRow,
  .auto-importeren-bpmcalc__sumTotal {
    gap: 10px;
  }

  .auto-importeren-bpmcalc__sumL {
    font-size: 13px;
  }

  .auto-importeren-bpmcalc__sumV,
  .auto-importeren-bpmcalc__sumTv {
    font-size: 13px;
  }

  /* Voorkomt browser-inzoom op focus van formvelden op mobiel. */
  .auto-importeren-bpmcalc input[type='text'],
  .auto-importeren-bpmcalc input[type='email'],
  .auto-importeren-bpmcalc input[type='tel'],
  .auto-importeren-bpmcalc input[type='number'],
  .auto-importeren-bpmcalc input[type='url'],
  .auto-importeren-bpmcalc__body select {
    font-size: 16px;
  }

  /* Laat knoptekst netjes doorlopen zonder geplette hoogte. */
  .auto-importeren-bpmcalc__btnPrimary,
  .auto-importeren-bpmcalc__btnUnlock,
  .auto-importeren-bpmcalc__btnBack,
  .auto-importeren-bpmcalc__btnSecondary,
  .auto-importeren-bpmcalc__btnWa,
  .auto-importeren-bpmcalc__btnBel {
    min-height: 48px;
    height: auto;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .auto-importeren-bpmcalc__urlFetchRow .auto-importeren-bpmcalc__btnSecondary {
    width: 100%;
  }

  .auto-importeren-bpmcalc__btnWa,
  .auto-importeren-bpmcalc__btnBel {
    gap: 8px;
    font-size: 14px;
  }
}

/* iPhone/iOS Safari: voorkom auto-zoom bij focus op input/select (<16px). */
@supports (-webkit-touch-callout: none) {
  .auto-importeren-bpmcalc input[type='text'],
  .auto-importeren-bpmcalc input[type='email'],
  .auto-importeren-bpmcalc input[type='tel'],
  .auto-importeren-bpmcalc input[type='number'],
  .auto-importeren-bpmcalc input[type='url'],
  .auto-importeren-bpmcalc select,
  .auto-importeren-bpmcalc textarea {
    font-size: 16px !important;
    line-height: 1.25;
  }
}

/* -----------------------------------------------------------------------------
 * [bpm_calculator_fixed] — vast kader max 500×500px: stap 1 = invoer, stap 2 =
 * uitslag of handmatige flow. Zelfde typografie/layout; geen transform/schaal.
 * -------------------------------------------------------------------------- */

.auto-importeren-bpmcalc.auto-importeren-bpmcalc--boxed {
  position: relative;
  box-sizing: border-box;
  width: min(100%, 500px);
  max-width: 500px;
  height: min(500px, 88dvh);
  max-height: 500px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  border: 1.5px solid var(--bpm-border);
  border-radius: 16px;
  background: var(--bpm-offwhite);
  padding: 8px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedInner {
  position: relative;
  box-sizing: border-box;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.auto-importeren-bpmcalc__boxedBack {
  width: 100%;
  margin: 0 0 10px;
  padding: 10px 14px;
  border: 1.5px solid var(--bpm-border);
  border-radius: 10px;
  background: #fff;
  color: var(--bpm-midnight);
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
  line-height: 1.3;
}

.auto-importeren-bpmcalc__boxedBack:hover {
  background: #f3f4f6;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__boxedInner > form,
.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__boxedInner > .auto-importeren-bpmcalc__status {
  display: none !important;
}

.auto-importeren-bpmcalc--boxed [data-bpmcalc-result-flow='1'][data-bpmcalc-result-page='1'] [data-bpmcalc-result-page='2'] {
  display: none !important;
}

.auto-importeren-bpmcalc--boxed [data-bpmcalc-result-flow='1'][data-bpmcalc-result-page='2'] [data-bpmcalc-result-page='1'] {
  display: none !important;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__actionsRow--boxedFlow {
  margin-top: 10px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__step[data-bpmcalc-step='1'] .auto-importeren-bpmcalc__boxedSlice--footer {
  display: none !important;
}

/* Resultaat-stap in fixed flow: compacter zodat alles binnen de box past. */
.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__boxedBack {
  margin-bottom: 8px;
  padding: 8px 12px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__boxedSlice {
  padding: 10px 10px 12px;
  margin-bottom: 8px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__pageTitle {
  font-size: 18px !important;
  margin-bottom: 4px !important;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__resultSubline {
  font-size: 13px;
  margin: 0;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__sumcard {
  padding: 12px 10px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__sumRow,
.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__sumTotal {
  padding: 5px 0;
  gap: 6px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__sumSec {
  margin-bottom: 2px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__sumSpacer {
  height: 8px;
  margin: 2px 0 6px;
}

.auto-importeren-bpmcalc--boxed[data-bpmcalc-boxed-step='2'] .auto-importeren-bpmcalc__result .auto-importeren-bpmcalc__actionsRow--boxedFlow {
  margin-top: 8px;
}

/* Geen dubbele “grote” kaart: secties zijn de visuele blokken */
.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__page {
  background: transparent;
  border: none;
  border-radius: 0;
  margin-bottom: 0;
  overflow: visible;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__page .auto-importeren-bpmcalc__body {
  background: transparent;
  padding: 4px 0 8px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice {
  background: #fff;
  border: 1px solid var(--bpm-border);
  border-radius: 12px;
  padding: 12px 12px 14px;
  margin-bottom: 10px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice:last-child {
  margin-bottom: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice--footer {
  padding-bottom: 12px;
}

/* Slices die al een sterk afgebakend blok bevatten: geen dubbele witte rand */
.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice:has(> .auto-importeren-bpmcalc__sumcard) {
  background: transparent;
  border: none;
  padding: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice:has(> .auto-importeren-bpmcalc__disc) {
  background: transparent;
  border: none;
  padding: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__boxedSlice:has(> .auto-importeren-bpmcalc__leadForm) {
  background: transparent;
  border: none;
  padding: 0;
}

.auto-importeren-bpmcalc__urlPanel {
  margin-bottom: 16px;
}

.auto-importeren-bpmcalc__urlFetchRow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
  margin-top: 4px;
}

.auto-importeren-bpmcalc__urlFetchRow .auto-importeren-bpmcalc__urlInput {
  flex: 1;
  min-width: min(100%, 220px);
}

.auto-importeren-bpmcalc__btnSecondary {
  background: #fff;
  color: var(--bpm-midnight);
  border: 1.5px solid var(--bpm-border);
  border-radius: 10px;
  padding: 0 16px;
  min-height: 46px;
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* .auto-importeren-bpmcalc__btnSecondary:hover:not(:disabled) {
  background: #f3f4f6;
} */

.auto-importeren-bpmcalc__btnSecondary:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.auto-importeren-bpmcalc__urlPanelStatus {
  margin-top: 8px;
  color: #6b7280;
}

.auto-importeren-bpmcalc__urlPanelStatus.is-success {
  color: #166534;
}

.auto-importeren-bpmcalc__urlPanelStatus.is-error {
  color: #b91c1c;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__frow {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__fg {
  margin-bottom: 12px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__pageSub {
  margin-bottom: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__divider {
  margin: 10px 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__helpBlock {
  align-items: flex-start;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__manualNotice {
  margin: 0 0 10px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__status {
  margin: 8px 4px 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__result {
  margin-top: 8px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__page--result .auto-importeren-bpmcalc__body {
  padding-top: 4px;
}

/* BPM-tabel: twee kolommen = minder hoogte vóór schalen */
.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumRow,
.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumTotal {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  padding: 6px 0;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumV,
.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumTv {
  justify-self: end;
  text-align: right;
  white-space: nowrap;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumcard {
  margin-bottom: 0;
  padding: 14px 12px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumSpacer {
  height: 10px;
  margin: 4px 0 8px;
  border-bottom: 1px dashed #e5e7eb;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__socialProof {
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__capBox {
  padding: 14px 12px;
}

@media (max-width: 782px) {
  .auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumL,
  .auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumV,
  .auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumTv {
    font-size: 14px !important;
  }

  .auto-importeren-bpmcalc--boxed .auto-importeren-bpmcalc__sumTl {
    font-size: 15px !important;
  }
}