/* Kostbaar boekingstool. Alles staat onder .kb-boek zodat het thema niet wordt geraakt. */

.kb-boek-aan .amelia-v2-booking { display: none !important; }

/* De popup van het thema: tot helemaal onderaan kunnen scrollen en de pagina erachter stil laten staan. */
.kb-boek-aan .single-product-popup.form-active {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.kb-boek-aan .single-product-popup.form-active .form-component-wrapper.amelia-form {
  height: auto;
  min-height: calc(100% + 1px);
}

/* Kop van de popup compacter zodat de tool de ruimte krijgt: het label naast het kruis, de titel kleiner.
   kb-tool staat alleen op de popup als de nieuwe tool het formulier is dat in beeld staat. */
.kb-boek-aan .single-product-popup.form-active.kb-tool { padding-top: 22px; padding-bottom: 28px; }
.kb-boek-aan .single-product-popup.form-active.kb-tool .close-button { top: 20px; }
.kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form { padding-top: 0; padding-bottom: 0; }
.kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .form-component .section-content-wrapper { padding-left: 0; }
.kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .section-content-wrapper .section-subtitle { margin: 0 0 14px; }
.kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .section-content-wrapper .section-title {
  display: block; margin: 0; font-size: 30px; line-height: 1.15; text-wrap: balance;
}
.kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .form-wrapper { margin-top: 14px; padding-bottom: 0; }
@media (max-width: 767px) {
  .kb-boek-aan .single-product-popup.form-active.kb-tool { padding-top: 22px; }
  .kb-boek-aan .single-product-popup.form-active.kb-tool .close-button { top: 19px; }
  .kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .section-content-wrapper .section-subtitle { margin: 0 0 12px 35px; }
  .kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .section-content-wrapper .section-title { font-size: clamp(20px, 5.8vw, 24px); }
  .kb-boek-aan .single-product-popup.form-active.kb-tool .form-component-wrapper.amelia-form .form-wrapper { margin-top: 12px; }
}

/* ---------- Popup van het thema: vloeiend openen en sluiten (klasse kb-popup op html) ---------- */

/* Eigen donkere laag, zodat hij kan in- en uitfaden. De laag van het thema verschijnt en verdwijnt in één keer. */
.kb-laag {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999;
  background: rgba(18, 33, 59, 0.5);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.28s ease, visibility 0s linear 0.28s;
}
html.kb-popup body.popup-active:before { display: none; }
html.kb-popup body.popup-active > .kb-laag {
  opacity: 1; visibility: visible; pointer-events: auto;
  transition: opacity 0.28s ease, visibility 0s;
}
html.kb-popup.kb-sluit body.popup-active > .kb-laag { opacity: 0; pointer-events: none; }

/* Sluiten: paneel en laag lopen gelijk en zijn in 0,28 seconde klaar. */
html.kb-popup.kb-sluit .single-product-popup.form-active {
  transform: translateX(102%) !important;
  transition: transform 0.28s cubic-bezier(0.4, 0, 1, 1) !important;
}
/* Openen zonder wachttijd: eerst buiten beeld klaarzetten, dan meteen inschuiven. */
html.kb-popup.kb-opent .single-product-popup.form-active {
  transform: translateX(100%) !important;
  transition: none !important;
}
html.kb-popup.kb-opent.kb-opent-ga .single-product-popup.form-active {
  transform: none !important;
  transition: transform 0.3s cubic-bezier(0.2, 0.7, 0.2, 1) !important;
}
/* Het open formulier blijft staan, ook als het thema na 3 seconden zijn formulieren nog eens verbergt
   of na het sluiten nog bezig is de inhoud van de popup te wisselen. */
html.kb-popup .single-product-popup.form-active .form-component-wrapper.kb-actief { display: block !important; opacity: 1 !important; }
html.kb-popup .single-product-popup.form-active .popup-content { display: none !important; }

@media (max-width: 767px) {
  html.kb-popup.kb-sluit .single-product-popup.form-active { transform: translateY(102%) !important; }
  html.kb-popup.kb-opent:not(.kb-opent-ga) .single-product-popup.form-active { transform: translateY(100%) !important; }
}
/* Telefoon: de popup vult het hele scherm. De achtergrond erachter krijgt dezelfde lichte kleur,
   zodat de strook achter de werkbalk van de browser geen andere kleur heeft. */
@media (max-width: 620px) {
  html.kb-popup .kb-laag { bottom: -140px; background: #FFF5EE; }
  html.kb-popup.kb-vol, html.kb-popup.kb-vol body { background-color: #FFF5EE !important; }
}
/* De grote popup zonder knipvorm: die is hier een gewone rechthoek, en een knipvorm over een lange lijst
   kost Safari op de iPhone bij inzoomen veel geheugen. */
html.kb-popup .single-product-popup.form-active { clip-path: none !important; }

/* Na het sluiten wordt het paneel weer het kleine venster: zonder animatie, anders schuift dat even in beeld. */
html.kb-popup.kb-stil .single-product-popup { transition: none !important; }

/* Beheerbalk: de popup begint precies eronder (de balk is op een telefoon 46 punten hoog, het thema rekent met 32). */
html.kb-popup body.admin-bar .single-product-popup.form-active { top: var(--kb-ab, 32px) !important; }

@media (max-width: 767px) {
  /* De popup loopt tot de onderrand van het scherm, zodat Safari zijn kleur gebruikt voor de strook achter de knoppen. */
  html.kb-popup .single-product-popup.form-active { bottom: 0 !important; height: auto !important; }
  /* De knoppen onderin (agenda, bellen, mail, WhatsApp) worden niet smaller zolang de pagina op slot staat. */
  html body.popup-active #contact-labels-wrapper { right: auto; }
  #contact-labels-wrapper .contact-label { flex-shrink: 0; }
}

/* Telefoon: zolang de popup open is ligt er onderaan een smalle strook in de kleur van de popup (zie randAan in boek.js).
   Safari op de iPhone neemt daarvan de kleur over voor de strook achter zijn knoppen. Na het sluiten verdwijnt hij. */
.kb-rand {
  position: fixed; left: 0; right: 0; bottom: 0; height: 12px; z-index: 2147483000;
  background-color: #FFF5EE; pointer-events: none;
}
@media (min-width: 621px) { .kb-rand { display: none; } }
/* iPhone: de knoppen van Safari liggen over de onderkant van de popup. Extra ruimte onderin,
   zodat ook de laatste knop (Volgende, Verzenden) erboven komt te staan. Safari bedekt daar tot 170 punten. */
@media (max-width: 767px) {
  html.kb-popup.kb-ios .single-product-popup.form-active { padding-bottom: 230px !important; }
}
/* Het thema geeft het formulier de hoogte van de popup. Een lang formulier (Taxeren stap 2) loopt daar dan
   overheen, en de ruimte onderin de popup telt niet mee bij het scrollen. Zo groeit het vak mee. */
html.kb-popup .single-product-popup.form-active .form-component-wrapper.default.kb-actief { height: auto !important; min-height: 100%; }

@media (prefers-reduced-motion: reduce) {
  .kb-laag,
  html.kb-popup.kb-sluit .single-product-popup.form-active,
  html.kb-popup.kb-opent.kb-opent-ga .single-product-popup.form-active { transition-duration: 0.01s !important; }
}

.kb-boek {
  --kb-a: #EC6523;
  --kb-ah: #C95218;
  --kb-ink: #212529;
  --kb-navy: #12213B;
  --kb-lijn: #EBA883;
  --kb-cel: #FBE7DA;
  --kb-rand: #878892;
  --kb-grijs: #5B6068;
  --kb-bg: #FFF5EE;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0 0 calc(16px + var(--kb-onder, 0px) + env(safe-area-inset-bottom, 0px));
  font-family: "Hind-hosted", Hind, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--kb-ink);
  text-align: left;
  -webkit-text-size-adjust: 100%;
}

.kb-boek *,
.kb-boek *::before,
.kb-boek *::after {
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: normal;
  text-transform: none;
}

.kb-boek button,
.kb-boek input,
.kb-boek textarea,
.kb-boek select,
.kb-boek label,
.kb-boek a,
.kb-boek p,
.kb-boek h3,
.kb-boek small,
.kb-boek b,
.kb-boek form {
  all: unset;
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
}

.kb-boek form { display: flex; flex-direction: column; gap: 14px; }
.kb-boek svg { display: block; flex: 0 0 auto; }
.kb-boek :focus-visible { outline: 2px solid var(--kb-navy); outline-offset: 2px; }

/* Indeling */
.kb-boek .kb-blok { display: flex; flex-direction: column; gap: 16px; }
.kb-boek .kb-deel { display: flex; flex-direction: column; gap: 8px; }
.kb-boek .kb-kolom { display: flex; flex-direction: column; gap: 8px; }
.kb-boek .kb-res:empty, .kb-boek .kb-lijst:empty { display: none; }
.kb-boek .kb-res, .kb-boek .kb-lijst { display: flex; flex-direction: column; gap: 8px; }

.kb-boek .kb-stap {
  display: flex; align-items: center; gap: 2px; min-height: 40px;
  margin: 0 0 14px; border-bottom: 1px solid var(--kb-lijn);
}
.kb-boek .kb-stap-tekst { font-size: 15px; font-weight: 400; }
.kb-boek .kb-terug {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; margin-left: -12px; cursor: pointer;
}

.kb-boek .kb-kop { font-size: 15px; font-weight: 400; }
.kb-boek .kb-kop-los { margin-top: 6px; }
.kb-boek .kb-klein { display: block; font-size: 14px; color: var(--kb-grijs); }
.kb-boek .kb-laden { padding: 20px 0; font-size: 15px; color: var(--kb-grijs); }

/* Velden. Invoervelden blijven 16px, anders zoomt de iPhone in bij het aantikken. */
.kb-boek .kb-veld { display: flex; flex-direction: column; min-width: 0; }
.kb-boek .kb-veld > label:not(.kb-knop),
.kb-boek .kb-veld-kop { display: block; margin: 0 0 3px; font-size: 15px; font-weight: 400; }
.kb-boek .kb-ster { margin-right: 3px; color: var(--kb-a); }
.kb-boek .kb-in {
  display: block; width: 100%; height: 44px; padding: 0 12px;
  background: #fff; border: 1px solid var(--kb-rand); border-radius: 0;
  font-size: 16px; font-weight: 400; color: var(--kb-ink); cursor: text;
}
.kb-boek textarea.kb-in { height: auto; min-height: 76px; padding: 9px 12px; overflow: auto; white-space: pre-wrap; overflow-wrap: break-word; }
.kb-boek select.kb-in { cursor: pointer; }
.kb-boek .kb-in::placeholder { color: #5B6068; font-weight: 400; opacity: 1; }
.kb-boek .kb-in[aria-invalid="true"] { border-color: #B3261E; }
.kb-boek .kb-twee { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kb-boek .kb-fout { font-size: 14px; color: #B3261E; }
.kb-boek .kb-fout:empty { display: none; }
.kb-boek .kb-fout:not(:empty) { margin-top: 3px; }
.kb-boek .kb-keus { display: flex; align-items: center; gap: 10px; min-height: 40px; cursor: pointer; }
.kb-boek .kb-keus input { all: revert; width: 18px; height: 18px; margin: 0; }
.kb-boek .kb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kb-boek .kb-bestand { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.kb-boek .kb-bestanden { display: flex; flex-direction: column; }
.kb-boek .kb-bestandsrij { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--kb-lijn); }
.kb-boek .kb-bestandsnaam { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }

/* Locaties */
.kb-boek .kb-raster { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.kb-boek .kb-loc {
  display: flex; align-items: center; min-height: 42px; padding: 6px 10px;
  background: #fff; border: 1px solid var(--kb-lijn);
  font-size: 16px; font-weight: 400; line-height: 1.25; color: var(--kb-navy); text-align: left; cursor: pointer;
}
.kb-boek .kb-loc.kb-breed { justify-content: space-between; gap: 12px; width: 100%; min-height: 44px; font-size: 16px; font-weight: 400; }
.kb-boek .kb-loc:hover, .kb-boek .kb-kaart:hover { border-color: var(--kb-a); }
.kb-boek .kb-kaart {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; padding: 10px 12px;
  background: #fff; border: 1px solid var(--kb-lijn); text-align: left; cursor: pointer;
}
.kb-boek .kb-kaart-tekst { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.kb-boek .kb-kaart-kop { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.kb-boek .kb-kaart-naam { font-size: 17px; font-weight: 500; }
.kb-boek .kb-badge { display: inline-block; padding: 3px 7px 1px; background: var(--kb-navy); font-size: 12px; font-weight: 400; color: #fff; }
.kb-boek .kb-wanneer { display: block; font-size: 14px; font-weight: 400; }
.kb-boek .kb-link {
  display: inline-flex; align-items: center; align-self: flex-start; min-height: 40px;
  font-size: 15px; font-weight: 400; text-decoration: underline; cursor: pointer;
}

/* Afspraakpagina (Verkopen en Taxeren): knop Terug, alleen de subtitel boven het formulier en hoger in het vak. */
.header-afspraak .kb-afspraak { padding-top: 0 !important; }
.header-afspraak .kb-afspraak .kb-terug {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; margin: -8px 0 10px; padding: 0;
  background: none; border: 0; border-radius: 0; cursor: pointer;
  font-family: "Hind-hosted", Hind, sans-serif; font-size: 16px; font-weight: 400; line-height: 1; color: #12213B;
}
.header-afspraak .kb-afspraak .kb-terug span { font-size: 24px; line-height: 0.6; }
.header-afspraak .kb-afspraak .kb-terug:hover,
.header-afspraak .kb-afspraak .kb-terug:focus-visible { text-decoration: underline; }
.header-afspraak .kb-zonder-titel .form-component .section-title { display: none !important; }
.header-afspraak .kb-zonder-titel .form-component .section-content-wrapper { padding-left: 0; margin-bottom: 0; }
.header-afspraak .kb-zonder-titel .form-component .section-subtitle { display: flex; align-items: center; gap: 6px; margin: 0 0 20px; line-height: 1; }
.header-afspraak .kb-zonder-titel .form-wrapper { margin-top: 0; }
@media (min-width: 768px) {
  .section-header-default .header-afspraak-wrapper.kb-formulier { padding-top: 70px; }
}
.kb-boek .kb-meer { margin-top: 2px; }

/* Gekozen locatie */
.kb-boek .kb-vak {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 12px; background: #fff; border: 1px solid var(--kb-lijn);
}
.kb-boek .kb-vak .kb-link { align-self: center; flex: 0 0 auto; }
.kb-boek .kb-vak-kolom { flex-direction: column; align-items: flex-start; gap: 1px; padding: 10px 12px; }
.kb-boek .kb-vak-tekst { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.kb-boek .kb-vak-naam { font-size: 17px; font-weight: 500; }
.kb-boek .kb-vak-moment { display: block; margin-top: 2px; font-size: 15px; font-weight: 400; }
.kb-boek .kb-hint {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; min-height: 44px; padding: 8px 12px; background: var(--kb-cel);
  font-size: 15px; font-weight: 400; text-align: left; cursor: pointer;
}
.kb-boek .kb-melding { padding: 10px 12px; background: var(--kb-cel); font-size: 15px; }
.kb-boek .kb-melding-fout { color: #8C1D18; }

/* Dagen en tijden */
.kb-boek .kb-week { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kb-boek .kb-week-tekst { font-size: 15px; font-weight: 400; text-align: center; }
.kb-boek .kb-pijl {
  display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
  background: #fff; border: 1px solid var(--kb-lijn); cursor: pointer;
}
.kb-boek .kb-pijl[disabled] { border-color: #F0DDD0; color: #B5AEAE; cursor: default; }
.kb-boek .kb-dagen { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.kb-boek .kb-dag {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 50px; background: var(--kb-cel); border: 1px solid var(--kb-lijn); cursor: pointer; line-height: 1.15;
}
.kb-boek .kb-dag small { display: block; font-size: 12px; }
.kb-boek .kb-dag b { display: block; font-size: 16px; font-weight: 400; }
.kb-boek .kb-dag[disabled] { background: transparent; border-color: #F0DDD0; color: #A9A3A3; cursor: default; }
.kb-boek .kb-tijden { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.kb-boek .kb-tijd {
  display: flex; align-items: center; justify-content: center; height: 40px;
  background: var(--kb-cel); border: 1px solid var(--kb-lijn);
  font-size: 15px; font-weight: 400; cursor: pointer;
}
.kb-boek .kb-dag.kb-aan, .kb-boek .kb-tijd.kb-aan { background: var(--kb-a); border-color: var(--kb-a); color: #fff; }

/* Knoppen */
.kb-boek .kb-knop {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 46px;
  padding: 6px 16px; font-size: 16px; font-weight: 500; text-align: center; cursor: pointer;
}
.kb-boek .kb-primair { background: var(--kb-a); color: #fff; }
.kb-boek .kb-primair:hover { background: var(--kb-ah); }
.kb-boek .kb-primair[disabled] { background: #EFD5C5; color: #8A7F86; cursor: default; }
.kb-boek .kb-tweede { min-height: 42px; background: #fff; border: 1px solid var(--kb-a); font-size: 15px; font-weight: 400; }

.kb-boek .kb-tel { font-size: 14px; color: var(--kb-grijs); }
.kb-boek .kb-tel a, .kb-boek .kb-tel-link { color: var(--kb-ah); font-weight: 500; white-space: nowrap; text-decoration: none; cursor: pointer; }

/* Bevestiging */
.kb-boek .kb-klaar { align-items: flex-start; gap: 12px; padding-top: 8px; }
.kb-boek .kb-klaar > * { width: 100%; }
.kb-boek .kb-vink { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: var(--kb-navy); color: #fff; }
.kb-boek .kb-titel { display: block; font-family: "ivypresto-display", Georgia, serif; font-size: 26px; font-weight: 600; line-height: 1.2; color: var(--kb-navy); }
.kb-boek .kb-gegevens { font-size: 15px; color: var(--kb-grijs); }
.kb-boek .kb-tekst { display: block; font-size: 16px; }

@media (max-width: 480px) {
  .kb-boek .kb-blok { gap: 14px; }
  .kb-boek .kb-stap { margin-bottom: 12px; }
  .kb-boek .kb-loc { min-height: 42px; font-size: 15px; }
  .kb-boek .kb-kaart-naam, .kb-boek .kb-vak-naam { font-size: 16px; }
  .kb-boek .kb-dag { height: 46px; }
  .kb-boek .kb-titel { font-size: 23px; }
}

/* ---------- Taxeren (Gravity Forms) in de stijl van de boekingstool (klasse kb-tax op html, regel taxeren_stijl) ---------- */
@keyframes kb-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
html.kb-tax .single-product-popup.form-active:has(.form-component-wrapper.default.kb-actief) { padding-top: 22px !important; padding-bottom: 28px; }
html.kb-tax .single-product-popup.form-active:has(.form-component-wrapper.default.kb-actief) .close-button { top: 20px; }
html.kb-tax .single-product-popup.form-active .form-component-wrapper.default { padding-top: 0; padding-bottom: 0; font-family: "Hind-hosted", Hind, sans-serif; color: #212529; }
html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .section-content-wrapper { padding-left: 0; }
/* Afspraakpagina: titel van Taxeren in één lijn met het formulier, ook op de telefoon. */
html.kb-tax .header-afspraak .form-component-wrapper:has(.gform_wrapper) .section-content-wrapper { padding-left: 0; }
html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .section-content-wrapper .section-subtitle { margin: 0 0 14px; }
html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .section-content-wrapper .section-title {
  display: block; margin: 0; font-size: 30px; line-height: 1.15; text-wrap: balance;
}
html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .form-wrapper { margin-top: 14px; padding-bottom: 0; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper { animation: kb-in 0.25s ease both; }

/* Stap en voortgang: zoals "Stap 1 van 3" in de boekingstool, links, met een dunne balk eronder. */
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gf_progressbar_wrapper {
  position: static !important; display: flex; flex-direction: column; gap: 8px; width: auto; margin: 0 0 16px;
}
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gf_progressbar_title {
  margin: 0 !important; text-align: left !important; font-family: inherit; font-size: 15px !important; font-weight: 400 !important; color: #212529 !important; opacity: 1 !important;
}
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gf_progressbar { height: 3px !important; padding: 0 !important; border-radius: 0 !important; overflow: hidden; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gf_progressbar_percentage { height: 3px !important; border-radius: 0 !important; transition: width 0.3s ease; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gf_progressbar_percentage span { display: none !important; }

/* Velden */
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_fields { row-gap: 14px !important; column-gap: 10px !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield_label,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform-field-label--type-sub,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper legend.gfield_label {
  margin: 0 0 3px !important; font-family: inherit !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.4 !important; color: #212529 !important;
}
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield_required,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield_required_asterisk { color: #EC6523 !important; font-size: 15px !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]):not([type=button]),
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper select,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper textarea {
  box-sizing: border-box; width: 100%; height: 44px; min-height: 44px; padding: 0 12px !important;
  background-color: #fff !important; border: 1px solid #878892 !important; border-radius: 0 !important; box-shadow: none !important;
  font-family: inherit !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.3 !important; color: #212529 !important;
}
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper textarea { height: auto; min-height: 76px; padding: 9px 12px !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper select { padding: 0 40px 0 12px !important; line-height: 42px !important; background-position: calc(100% - 14px) 50% !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper input::placeholder,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper textarea::placeholder { color: #5B6068 !important; opacity: 1 !important; font-size: inherit !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper input:focus,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper select:focus,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper textarea:focus { outline: 2px solid #12213B !important; outline-offset: 1px; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gchoice label,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .ginput_container_consent label { font-family: inherit !important; font-size: 15px !important; font-weight: 400 !important; color: #212529 !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gchoice input { width: 20px; height: 20px; background-color: #fff !important; border: 1px solid #878892 !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-html,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-html div,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-html strong,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-html a { font-family: inherit; font-size: 16px !important; line-height: 1.5 !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-fileupload .gform_drop_area,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-fileupload input[type=file] { background-color: #fff !important; border: 1px dashed #878892 !important; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-fileupload .gform_drop_area input,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gfield--type-fileupload .gform_drop_area button { color: #5B6068 !important; font-size: 16px !important; }

/* Knoppen zoals in de boekingstool */
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_page_footer,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_footer { padding-top: 18px !important; gap: 10px; }
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_page_footer button,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_page_footer input[type=submit],
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_footer button,
html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_footer input[type=submit] {
  min-height: 46px; height: auto !important; padding: 6px 24px !important; font-family: inherit !important; font-size: 16px !important; font-weight: 500 !important;
}
@media (max-width: 767px) {
  html.kb-tax .single-product-popup.form-active:has(.form-component-wrapper.default.kb-actief) { padding-top: 22px !important; }
  html.kb-tax .single-product-popup.form-active:has(.form-component-wrapper.default.kb-actief) .close-button { top: 19px; }
  html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .section-content-wrapper .section-subtitle { margin: 0 0 12px 35px; }
  html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .section-content-wrapper .section-title { font-size: clamp(20px, 5.8vw, 24px); }
  html.kb-tax .single-product-popup.form-active .form-component-wrapper.default .form-wrapper { margin-top: 12px; }
  html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_page_footer button,
  html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_page_footer input[type=submit],
  html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_footer button,
  html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper .gform_footer input[type=submit] { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  html.kb-tax :is(.form-component-wrapper.default, .header-afspraak .form-component-wrapper) .gform_wrapper { animation: none; }
}