/* ==========================================================================
   BRÜNKEN TIMMERWERKEN — Gravity Forms huisstijl-stylesheet
   --------------------------------------------------------------------------
   Voor:      brunken.nl (Divi + Divi Pixel Gravity Forms Styler)
   Werkt met: Gravity Forms 3.x — Orbital theme (theme framework, --gf-* vars)
   Door:      enVisual
   Versie:    1.0 — september 2026

   LOCATIE
   Child theme "Brünken" → css/gravity-forms.css. Wordt geladen via
   functions.php (brunken_enqueue_styles), ná de stylesheets van Divi en
   Gravity Forms. Niet óók in Divi → Themaopties → Aangepaste CSS plakken.

   HOE HET WERKT
   Gravity Forms 3 stijlt alle velden via CSS custom properties (--gf-…).
   Blok 1 zet de huisstijl-tokens, blok 2 koppelt die aan ALLE --gf-variabelen
   van het theme framework. Daardoor volgen ook velden die nu nog niet in een
   formulier staan (upload, datum, lijst, pagina's, producten, consent, …)
   automatisch de huisstijl. Blokken 3–9 verfijnen onderdelen die het
   framework niet via variabelen regelt.

   WAAROM !important OP DE --gf-VARIABELEN
   GF 3 print per formulier een inline <style> met de standaardwaarden van de
   "Form Styles"-instellingen op #gform_wrapper_X[data-form-index].gform-theme.
   Die ID-selector wint van elke klasse-selector; met !important op de
   variabelen wint deze stylesheet. Pas kleuren/maten dus HIER aan (blok 1),
   niet in de Form Styles van het formulier.

   VOORWAARDE
   Formulierinstellingen → Form Theme = "Orbital" (standaard in GF 3).
   Het oude "Gravity Forms 2.5 Theme" en Legacy markup worden niet gestyled.

   MODIFIERS (CSS-klasse op de Divi-module of het formulier)
   .brk-form--card     optioneel: warme kaart-achtergrond met oranje toplijn
   .brk-form--dark     variant voor donkere secties (bv. footer #1C1C1C)
   .brk-form--compact  kleinere velden en minder witruimte (sidebar/popup)
   Tip: GF's ingebouwde formulierklasse "gf_simple_horizontal" geeft een
   nieuwsbrief-strook (veld + knop naast elkaar) en wordt hier ondersteund.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. HUISSTIJL-TOKENS
   -------------------------------------------------------------------------- */
:root {
  /* Kleur */
  --brk-orange:        #E9511D;             /* primaire accentkleur (knoppen, lijnen) */
  --brk-orange-rgb:    233, 81, 29;
  --brk-orange-dark:   #C94517;             /* hover/actief */
  --brk-orange-tint:   #FBEDE7;             /* lichte oranje tint (hover kalender, geselecteerd) */
  --brk-navy:          #01132D;             /* tekst op oranje knoppen (zoals header-CTA) */
  --brk-dark:          #1C1C1C;             /* koppen, labels, footer */
  --brk-dark-rgb:      28, 28, 28;
  --brk-text:          #4F4F4F;             /* lopende tekst */
  --brk-muted:         #6B6B6B;             /* sublabels, omschrijvingen */
  --brk-muted-light:   #9B948C;             /* placeholders, iconen */
  --brk-line:          #CFC9C1;             /* randen van velden (warm grijs) */
  --brk-line-hover:    #A39C93;
  --brk-line-soft:     #E6E1DB;             /* scheidingslijnen, progress-achtergrond */
  --brk-paper:         #F7F4F0;             /* warme tint (consentkader, landkeuze, uitgeschakeld veld, optionele kaart) */
  --brk-paper-deep:    #EFEAE3;
  --brk-white:         #FFFFFF;
  --brk-error:         #B3261E;
  --brk-error-rgb:     179, 38, 30;
  --brk-success:       #2E7D4F;
  --brk-success-rgb:   46, 125, 79;

  /* Typografie (zoals de site: Roboto Slab koppen, Inter tekst) */
  --brk-font-heading:  "Roboto Slab", Georgia, "Times New Roman", serif;
  --brk-font-body:     "Inter", Helvetica, Arial, sans-serif;

  /* Vorm */
  --brk-radius:        4px;                 /* velden */
  --brk-radius-lg:     8px;                 /* textarea, upload-zone, kaart */
  --brk-radius-pill:   100px;               /* knoppen, zoals header-CTA */
  --brk-ctrl-height:   52px;
  --brk-btn-height:    56px;
  --brk-shadow-btn:    0 8px 20px -10px rgba(233, 81, 29, 0.55);
  --brk-shadow-pop:    0 0 1px rgba(28, 28, 28, 0.18), 0 12px 32px -8px rgba(28, 28, 28, 0.22);
}


/* --------------------------------------------------------------------------
   2. GRAVITY FORMS THEME FRAMEWORK → HUISSTIJL
      Alle --gf-variabelen die het uiterlijk bepalen. Overschrijft de
      standaardwaarden van .gform-theme--framework (specificiteit 0,2,0).
   -------------------------------------------------------------------------- */
.gform_wrapper.gform-theme--orbital,
.gform-theme--orbital.gform-theme-datepicker {

  /* ---- Basis & radius ---- */
  --gf-radius:                      var(--brk-radius) !important;
  --gf-radius-max-sm:               var(--brk-radius) !important;
  --gf-radius-max-md:               var(--brk-radius) !important;
  --gf-radius-max-lg:               var(--brk-radius-lg) !important;

  /* ---- Kleurpalet ---- */
  --gf-color-primary:               var(--brk-orange) !important;
  --gf-color-primary-rgb:           var(--brk-orange-rgb) !important;
  --gf-color-primary-contrast:      var(--brk-white) !important;
  --gf-color-primary-contrast-rgb:  255, 255, 255 !important;
  --gf-color-primary-darker:        var(--brk-orange-dark) !important;
  --gf-color-primary-lighter:       #F0774D !important;

  --gf-color-secondary:             var(--brk-white) !important;
  --gf-color-secondary-rgb:         255, 255, 255 !important;
  --gf-color-secondary-contrast:    var(--brk-dark) !important;
  --gf-color-secondary-contrast-rgb: var(--brk-dark-rgb) !important;
  --gf-color-secondary-darker:      var(--brk-paper) !important;
  --gf-color-secondary-lighter:     var(--brk-paper) !important;

  /* Buiten de velden (labels, omschrijvingen, lijnen) */
  --gf-color-out-ctrl-dark:         var(--brk-muted) !important;
  --gf-color-out-ctrl-dark-rgb:     107, 107, 107 !important;
  --gf-color-out-ctrl-dark-darker:  var(--brk-dark) !important;
  --gf-color-out-ctrl-dark-lighter: var(--brk-muted-light) !important;
  --gf-color-out-ctrl-light:        var(--brk-line-soft) !important;
  --gf-color-out-ctrl-light-rgb:    230, 225, 219 !important;
  --gf-color-out-ctrl-light-darker: #D6D0C8 !important;
  --gf-color-out-ctrl-light-lighter: var(--brk-paper) !important;

  /* Binnen de velden (invoer) */
  --gf-color-in-ctrl:               var(--brk-white) !important;
  --gf-color-in-ctrl-rgb:           255, 255, 255 !important;
  --gf-color-in-ctrl-contrast:      var(--brk-dark) !important;
  --gf-color-in-ctrl-contrast-rgb:  var(--brk-dark-rgb) !important;
  --gf-color-in-ctrl-darker:        var(--brk-paper) !important;
  --gf-color-in-ctrl-lighter:       var(--brk-paper) !important;
  --gf-color-in-ctrl-dark:          var(--brk-muted) !important;
  --gf-color-in-ctrl-dark-rgb:      107, 107, 107 !important;
  --gf-color-in-ctrl-dark-darker:   var(--brk-dark) !important;
  --gf-color-in-ctrl-dark-lighter:  var(--brk-line) !important;
  --gf-color-in-ctrl-light:         var(--brk-line-soft) !important;
  --gf-color-in-ctrl-light-rgb:     230, 225, 219 !important;
  --gf-color-in-ctrl-light-darker:  #D6D0C8 !important;
  --gf-color-in-ctrl-light-lighter: var(--brk-paper) !important;
  --gf-color-in-ctrl-primary:               var(--brk-orange) !important;
  --gf-color-in-ctrl-primary-rgb:           var(--brk-orange-rgb) !important;
  --gf-color-in-ctrl-primary-contrast:      var(--brk-white) !important;
  --gf-color-in-ctrl-primary-contrast-rgb:  255, 255, 255 !important;
  --gf-color-in-ctrl-primary-darker:        var(--brk-orange-dark) !important;
  --gf-color-in-ctrl-primary-lighter:       #F0774D !important;

  --gf-color-danger:                var(--brk-error) !important;
  --gf-color-danger-rgb:            var(--brk-error-rgb) !important;
  --gf-color-success:               var(--brk-success) !important;
  --gf-color-success-rgb:           var(--brk-success-rgb) !important;

  /* ---- Iconen (select-pijl en number-spinner in antraciet) ---- */
  --gf-icon-ctrl-select: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%231C1C1C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  --gf-icon-ctrl-number: url("data:image/svg+xml,%3Csvg width='8' height='14' viewBox='0 0 8 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z' fill='%231C1C1C'/%3E%3C/svg%3E") !important;
  --gf-icon-ctrl-search: url("data:image/svg+xml,%3Csvg width='640' height='640' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M256 128c-70.692 0-128 57.308-128 128 0 70.691 57.308 128 128 128 70.691 0 128-57.309 128-128 0-70.692-57.309-128-128-128zM64 256c0-106.039 85.961-192 192-192s192 85.961 192 192c0 41.466-13.146 79.863-35.498 111.248l154.125 154.125c12.496 12.496 12.496 32.758 0 45.254s-32.758 12.496-45.254 0L367.248 412.502C335.862 434.854 297.467 448 256 448c-106.039 0-192-85.962-192-192z' fill='%236B6B6B'/%3E%3C/svg%3E") !important;
  --gf-ctrl-select-icon-size:       12px !important;

  /* ---- Afstanden ---- */
  --gf-padding-x:                   18px !important;
  --gf-padding-y:                   14px !important;
  --gf-form-gap-x:                  24px !important;   /* tussen kolommen */
  --gf-form-gap-y:                  28px !important;   /* tussen velden */
  --gf-form-footer-margin-y-start:  20px !important;
  --gf-form-footer-gap:             12px !important;
  --gf-field-gap-x:                 16px !important;   /* binnen samengestelde velden (naam, adres) */
  --gf-field-gap-y:                 14px !important;
  --gf-label-space-primary:         10px !important;   /* label → veld */
  --gf-label-choice-field-space-primary: 14px !important;
  --gf-label-space-tertiary:        6px !important;    /* sublabel → veld */
  --gf-label-req-gap:               6px !important;
  --gf-desc-space:                  8px !important;
  --gf-desc-choice-field-space:     12px !important;
  --gf-transition-duration:         0.18s !important;

  /* ---- Typografie ---- */
  --gf-font-family-base:            var(--brk-font-body) !important;
  --gf-font-family-primary:         var(--brk-font-body) !important;   /* invoer */
  --gf-font-size-primary:           17px !important;
  --gf-font-weight-primary:         400 !important;
  --gf-line-height-primary:         1.5 !important;
  --gf-font-family-secondary:       var(--brk-font-body) !important;   /* keuzelabels, bestandsnamen */
  --gf-font-size-secondary:         16px !important;
  --gf-font-weight-secondary:       500 !important;
  --gf-line-height-secondary:       1.45 !important;
  --gf-font-family-tertiary:        var(--brk-font-body) !important;   /* omschrijvingen, sublabels */
  --gf-font-size-tertiary:          15px !important;
  --gf-font-weight-tertiary:        400 !important;
  --gf-line-height-tertiary:        1.5 !important;

  /* ---- Velden (input, select, textarea) ---- */
  --gf-ctrl-size-sm:                44px !important;
  --gf-ctrl-size-md:                var(--brk-ctrl-height) !important;
  --gf-ctrl-size-lg:                58px !important;
  --gf-ctrl-size-xl:                64px !important;
  --gf-ctrl-size:                   var(--brk-ctrl-height) !important;
  --gf-ctrl-bg-color:               var(--brk-white) !important;
  --gf-ctrl-bg-color-hover:         var(--brk-white) !important;
  --gf-ctrl-bg-color-focus:         var(--brk-white) !important;
  --gf-ctrl-bg-color-disabled:      var(--brk-paper) !important;
  --gf-ctrl-bg-color-error:         #FFF9F8 !important;
  --gf-ctrl-border-color:           var(--brk-line) !important;
  --gf-ctrl-border-color-hover:     var(--brk-line-hover) !important;
  --gf-ctrl-border-color-focus:     var(--brk-orange) !important;
  --gf-ctrl-border-color-disabled:  var(--brk-line-soft) !important;
  --gf-ctrl-border-color-error:     var(--brk-error) !important;
  --gf-ctrl-border-width:           1px !important;
  --gf-ctrl-radius:                 var(--brk-radius) !important;
  --gf-ctrl-outline-color-focus:    rgba(var(--brk-orange-rgb), 0.28) !important;
  --gf-ctrl-outline-width-focus:    3px !important;
  --gf-ctrl-outline-offset:         1px !important;
  --gf-ctrl-color:                  var(--brk-dark) !important;
  --gf-ctrl-color-disabled:         rgba(var(--brk-dark-rgb), 0.5) !important;
  --gf-ctrl-icon-color:             var(--brk-muted-light) !important;
  --gf-ctrl-icon-color-hover:       var(--brk-dark) !important;
  --gf-ctrl-shadow:                 none !important;
  --gf-ctrl-accent-color:           var(--brk-orange) !important;
  --gf-ctrl-placeholder-color:      var(--brk-muted-light) !important;
  --gf-ctrl-placeholder-font-weight: 400 !important;
  --gf-ctrl-readonly-color:         var(--brk-text) !important;
  --gf-ctrl-readonly-font-weight:   500 !important;

  /* Textarea & multiselect */
  --gf-ctrl-textarea-height:        170px !important;
  --gf-ctrl-textarea-radius:        6px !important;
  --gf-ctrl-textarea-line-height:   1.55 !important;
  --gf-ctrl-textarea-padding-y:     14px !important;
  --gf-ctrl-multiselect-height:     150px !important;
  --gf-ctrl-multiselect-radius:     6px !important;
  --gf-ctrl-multiselect-selected-item-bg-color: var(--brk-orange) !important;
  --gf-ctrl-multiselect-selected-item-color:    var(--brk-white) !important;
  --gf-ctrl-multiselect-selected-item-remove-icon-color: var(--brk-white) !important;
  --gf-ctrl-multiselect-selected-item-font-weight: 500 !important;
  --gf-ctrl-multiselect-selected-item-radius:   var(--brk-radius-pill) !important;

  /* Select dropdown (Enhanced UI / Chosen, telefoon-landenlijst) */
  --gf-ctrl-select-dropdown-border-color:        var(--brk-line-soft) !important;
  --gf-ctrl-select-dropdown-radius:              6px !important;
  --gf-ctrl-select-dropdown-shadow:              var(--brk-shadow-pop) !important;
  --gf-ctrl-select-dropdown-option-bg-color-hover: var(--brk-paper) !important;
  --gf-ctrl-select-dropdown-option-shadow-hover: inset 3px 0 0 var(--brk-orange) !important;

  /* ---- Labels ---- */
  /* primair = veldlabel */
  --gf-ctrl-label-color-primary:          var(--brk-dark) !important;
  --gf-ctrl-label-font-family-primary:    var(--brk-font-heading) !important;
  --gf-ctrl-label-font-size-primary:      16px !important;
  --gf-ctrl-label-font-weight-primary:    600 !important;
  --gf-ctrl-label-letter-spacing-primary: 0.01em !important;
  --gf-ctrl-label-line-height-primary:    1.4 !important;
  /* secundair = keuzelabels (radio/checkbox/consent) */
  --gf-ctrl-label-color-secondary:        var(--brk-dark) !important;
  --gf-ctrl-label-font-family-secondary:  var(--brk-font-body) !important;
  --gf-ctrl-label-font-size-secondary:    16px !important;
  --gf-ctrl-label-font-weight-secondary:  400 !important;
  --gf-ctrl-label-line-height-secondary:  1.45 !important;
  /* tertiair = sublabels (Voornaam, Straat, Land …) */
  --gf-ctrl-label-color-tertiary:         var(--brk-muted) !important;
  --gf-ctrl-label-font-family-tertiary:   var(--brk-font-body) !important;
  --gf-ctrl-label-font-size-tertiary:     14px !important;
  --gf-ctrl-label-font-weight-tertiary:   500 !important;
  --gf-ctrl-label-line-height-tertiary:   1.4 !important;
  /* quaternair = kolomkoppen lijstveld, inline labels */
  --gf-ctrl-label-color-quaternary:       var(--brk-text) !important;
  --gf-ctrl-label-font-family-quaternary: var(--brk-font-body) !important;
  --gf-ctrl-label-font-size-quaternary:   14px !important;
  --gf-ctrl-label-font-weight-quaternary: 600 !important;
  /* "(Vereist)" */
  --gf-ctrl-label-color-req:              var(--brk-orange) !important;
  --gf-ctrl-label-font-family-req:        var(--brk-font-body) !important;
  --gf-ctrl-label-font-size-req:          12px !important;
  --gf-ctrl-label-font-weight-req:        500 !important;
  --gf-ctrl-label-letter-spacing-req:     0.02em !important;

  /* ---- Omschrijvingen & validatieteksten ---- */
  --gf-ctrl-desc-color:                 var(--brk-muted) !important;
  --gf-ctrl-desc-font-family:           var(--brk-font-body) !important;
  --gf-ctrl-desc-font-size:             15px !important;
  --gf-ctrl-desc-line-height:           1.5 !important;
  --gf-ctrl-desc-color-error:           var(--brk-error) !important;
  --gf-ctrl-desc-font-size-error:       14px !important;
  --gf-ctrl-desc-font-weight-error:     500 !important;
  --gf-ctrl-desc-border-color-consent:  var(--brk-line-soft) !important;
  --gf-ctrl-desc-border-color-consent-focus: var(--brk-orange) !important;
  --gf-ctrl-desc-max-height-consent:    320px !important;

  /* ---- Keuzevelden (radio / checkbox) ---- */
  --gf-ctrl-choice-size:                22px !important;
  --gf-ctrl-choice-check-color:         var(--brk-orange) !important;
  --gf-ctrl-choice-check-color-disabled: rgba(var(--brk-dark-rgb), 0.25) !important;
  --gf-ctrl-checkbox-check-radius:      3px !important;
  --gf-ctrl-radio-check-size:           8px !important;
  --gf-field-choice-gap:                12px !important;
  --gf-field-choice-align-x-gap-x:      24px !important;
  --gf-field-choice-align-x-gap-y:      12px !important;

  /* Afbeeldingskeuze */
  --gf-field-img-choice-radius-square:  6px !important;
  --gf-field-img-choice-shadow:         0 1px 2px rgba(28, 28, 28, 0.08), 0 4px 12px -6px rgba(28, 28, 28, 0.18) !important;
  --gf-field-img-choice-shadow-hover:   var(--brk-shadow-pop) !important;
  --gf-field-img-choice-card-check-ind-bg-color:     var(--brk-orange) !important;
  --gf-field-img-choice-card-check-ind-icon-color:   var(--brk-white) !important;
  --gf-field-img-choice-no-card-check-ind-bg-color:  var(--brk-orange) !important;
  --gf-field-img-choice-no-card-check-ind-icon-color: var(--brk-white) !important;
  --gf-field-img-choice-card-placeholder-bg-color:   var(--brk-paper) !important;
  --gf-field-img-choice-card-placeholder-color:      var(--brk-muted-light) !important;

  /* ---- Knoppen (algemeen: verzenden, volgende, vorige, bestand kiezen …) ---- */
  --gf-ctrl-btn-radius:               var(--brk-radius-pill) !important;
  --gf-ctrl-btn-shadow:               none !important;
  --gf-ctrl-btn-shadow-hover:         var(--brk-shadow-btn) !important;
  --gf-ctrl-btn-shadow-focus:         none !important;
  --gf-ctrl-btn-opacity-disabled:     0.55 !important;
  --gf-ctrl-btn-size-md:              var(--brk-btn-height) !important;
  --gf-ctrl-btn-size-lg:              60px !important;
  --gf-ctrl-btn-size-xl:              64px !important;
  --gf-ctrl-btn-size:                 var(--brk-btn-height) !important;
  --gf-ctrl-btn-padding-x-md:         36px !important;
  --gf-ctrl-btn-padding-x-lg:         40px !important;
  --gf-ctrl-btn-padding-x-xl:         44px !important;
  --gf-ctrl-btn-padding-x:            36px !important;
  --gf-ctrl-btn-font-family:          var(--brk-font-heading) !important;
  --gf-ctrl-btn-font-size-sm:         13px !important;
  --gf-ctrl-btn-font-size-md:         15px !important;
  --gf-ctrl-btn-font-size-lg:         16px !important;
  --gf-ctrl-btn-font-size-xl:         16px !important;
  --gf-ctrl-btn-font-size:            15px !important;
  --gf-ctrl-btn-font-weight:          600 !important;
  --gf-ctrl-btn-letter-spacing:       1px !important;
  --gf-ctrl-btn-text-transform:       uppercase !important;
  --gf-ctrl-btn-icon-gap:             10px !important;

  /* Primair (Verzenden / Volgende) — oranje pil met navy tekst, zoals header-CTA */
  --gf-ctrl-btn-bg-color-primary:           var(--brk-orange) !important;
  --gf-ctrl-btn-bg-color-hover-primary:     var(--brk-dark) !important;
  --gf-ctrl-btn-bg-color-focus-primary:     var(--brk-orange-dark) !important;
  --gf-ctrl-btn-bg-color-disabled-primary:  var(--brk-orange) !important;
  --gf-ctrl-btn-border-color-primary:       transparent !important;
  --gf-ctrl-btn-border-color-hover-primary: transparent !important;
  --gf-ctrl-btn-border-color-focus-primary: var(--brk-orange-dark) !important;
  --gf-ctrl-btn-border-width-primary:       0 !important;
  --gf-ctrl-btn-color-primary:              var(--brk-navy) !important;
  --gf-ctrl-btn-color-hover-primary:        var(--brk-white) !important;
  --gf-ctrl-btn-color-focus-primary:        var(--brk-white) !important;
  --gf-ctrl-btn-color-disabled-primary:     var(--brk-navy) !important;
  --gf-ctrl-btn-icon-color-hover-primary:   var(--brk-white) !important;
  --gf-ctrl-btn-icon-color-focus-primary:   var(--brk-white) !important;

  /* Secundair (Vorige) — omlijnde pil */
  --gf-ctrl-btn-bg-color-secondary:           transparent !important;
  --gf-ctrl-btn-bg-color-hover-secondary:     var(--brk-dark) !important;
  --gf-ctrl-btn-bg-color-focus-secondary:     transparent !important;
  --gf-ctrl-btn-bg-color-disabled-secondary:  transparent !important;
  --gf-ctrl-btn-border-color-secondary:       var(--brk-dark) !important;
  --gf-ctrl-btn-border-color-hover-secondary: var(--brk-dark) !important;
  --gf-ctrl-btn-border-color-focus-secondary: var(--brk-orange) !important;
  --gf-ctrl-btn-border-width-secondary:       2px !important;
  --gf-ctrl-btn-color-secondary:              var(--brk-dark) !important;
  --gf-ctrl-btn-color-hover-secondary:        var(--brk-white) !important;
  --gf-ctrl-btn-color-focus-secondary:        var(--brk-dark) !important;
  --gf-ctrl-btn-icon-color-secondary:         var(--brk-dark) !important;
  --gf-ctrl-btn-icon-color-hover-secondary:   var(--brk-white) !important;

  /* Tertiair (Opslaan & later verder e.d.) — zachte pil */
  --gf-ctrl-btn-bg-color-tertiary:            var(--brk-paper) !important;
  --gf-ctrl-btn-bg-color-hover-tertiary:      var(--brk-paper-deep) !important;
  --gf-ctrl-btn-border-color-tertiary:        transparent !important;
  --gf-ctrl-btn-border-color-hover-tertiary:  transparent !important;
  --gf-ctrl-btn-color-tertiary:               var(--brk-dark) !important;
  --gf-ctrl-btn-shadow-tertiary:              none !important;

  /* Control-knoppen (lijstveld +/−, herhaalveld) */
  --gf-ctrl-btn-bg-color-ctrl:                var(--brk-orange) !important;
  --gf-ctrl-btn-bg-color-hover-ctrl:          var(--brk-dark) !important;
  --gf-ctrl-btn-color-ctrl:                   var(--brk-white) !important;

  /* Simpele icoonknoppen (wachtwoord tonen, bestand annuleren, datumkiezer) */
  --gf-ctrl-btn-color-simple:                 var(--brk-muted-light) !important;
  --gf-ctrl-btn-color-hover-simple:           var(--brk-dark) !important;
  --gf-ctrl-btn-icon-color-simple:            var(--brk-muted-light) !important;

  /* ---- Bestand uploaden ---- */
  --gf-ctrl-file-btn-radius:            var(--brk-radius-pill) !important;
  --gf-ctrl-file-btn-font-family:       var(--brk-font-heading) !important;
  --gf-ctrl-file-btn-font-size:         13px !important;
  --gf-ctrl-file-btn-font-weight:       600 !important;
  --gf-ctrl-file-btn-letter-spacing:    0.06em !important;
  --gf-ctrl-file-btn-text-transform:    uppercase !important;
  --gf-ctrl-file-btn-padding-x:         18px !important;
  --gf-ctrl-file-zone-border-style:     dashed !important;
  --gf-ctrl-file-zone-radius:           var(--brk-radius-lg) !important;
  --gf-ctrl-file-zone-color:            var(--brk-text) !important;
  --gf-ctrl-file-zone-padding-x:        32px !important;
  --gf-ctrl-file-zone-padding-y:        36px !important;
  --gf-ctrl-file-zone-font-weight:      500 !important;
  --gf-ctrl-file-zone-icon-color:       var(--brk-orange) !important;
  --gf-ctrl-file-zone-icon-font-size:   40px !important;
  --gf-ctrl-file-prog-bar-bg-color:     var(--brk-line-soft) !important;
  --gf-ctrl-file-prog-bar-bg-color-loading: var(--brk-orange) !important;
  --gf-ctrl-file-prog-bar-height:       6px !important;
  --gf-ctrl-file-prog-bar-radius:       var(--brk-radius-pill) !important;
  --gf-ctrl-file-prog-btn-icon-color-complete: var(--brk-success) !important;
  --gf-ctrl-file-prev-name-color:       var(--brk-dark) !important;
  --gf-ctrl-file-prev-size-color:       var(--brk-muted) !important;

  /* ---- Datumkiezer (kalender) ---- */
  --gf-ctrl-date-picker-bg-color:       var(--brk-white) !important;
  --gf-ctrl-date-picker-shadow:         var(--brk-shadow-pop) !important;
  --gf-ctrl-date-picker-radius:         6px !important;
  --gf-ctrl-date-picker-head-cell-font-weight: 600 !important;
  --gf-ctrl-date-picker-cell-content-bg-color-hover:    var(--brk-orange-tint) !important;
  --gf-ctrl-date-picker-cell-content-bg-color-selected: var(--brk-orange) !important;
  --gf-ctrl-date-picker-cell-content-border: 1px solid var(--brk-orange) !important;
  --gf-ctrl-date-picker-cell-content-radius: var(--brk-radius) !important;
  --gf-ctrl-date-picker-cell-content-color:  var(--brk-dark) !important;
  --gf-ctrl-date-picker-cell-content-color-disabled: #C9C3BB !important;
  --gf-ctrl-date-picker-cell-content-color-selected: var(--brk-white) !important;
  --gf-ctrl-date-picker-helptext-font-family: var(--brk-font-heading) !important;
  --gf-ctrl-date-picker-helptext-font-weight: 600 !important;
  --gf-field-date-icon-color:           var(--brk-muted-light) !important;
  --gf-field-date-icon-color-active:    var(--brk-orange) !important;

  /* ---- Lijstveld ---- */
  --gf-field-list-btn-size:             22px !important;
  --gf-field-list-btns-gap:             8px !important;

  /* ---- Pagina's: stappen & voortgangsbalk ---- */
  --gf-field-pg-prog-color:             var(--brk-dark) !important;
  --gf-field-pg-prog-font-family:       var(--brk-font-heading) !important;
  --gf-field-pg-prog-font-size:         13px !important;
  --gf-field-pg-prog-font-weight:       600 !important;
  --gf-field-pg-prog-letter-spacing:    1px !important;
  --gf-field-pg-prog-text-transform:    uppercase !important;
  --gf-field-pg-prog-margin-y-end:      36px !important;
  --gf-field-pg-prog-bar-bg-color:      var(--brk-line-soft) !important;
  --gf-field-pg-prog-bar-bg-color-blue: var(--brk-orange) !important;   /* standaardkleur in GF → huisstijl */
  --gf-field-pg-prog-bar-bg-color-orange: var(--brk-orange) !important;
  --gf-field-pg-prog-bar-bg-color-gray: var(--brk-dark) !important;
  --gf-field-pg-prog-bar-bg-color-green: var(--brk-success) !important;
  --gf-field-pg-prog-bar-bg-color-red:  var(--brk-error) !important;
  --gf-field-pg-prog-bar-radius:        var(--brk-radius-pill) !important;
  --gf-field-pg-prog-bar-height:        8px !important;
  --gf-field-pg-steps-number-bg-color:  var(--brk-white) !important;
  --gf-field-pg-steps-number-bg-color-active:   var(--brk-dark) !important;
  --gf-field-pg-steps-number-bg-color-complete: var(--brk-orange) !important;
  --gf-field-pg-steps-number-border-color:      var(--brk-line) !important;
  --gf-field-pg-steps-number-border-color-active:   var(--brk-dark) !important;
  --gf-field-pg-steps-number-border-color-complete: var(--brk-orange) !important;
  --gf-field-pg-steps-number-color:             var(--brk-muted) !important;
  --gf-field-pg-steps-number-color-active:      var(--brk-white) !important;
  --gf-field-pg-steps-number-color-complete:    var(--brk-white) !important;
  --gf-field-pg-steps-number-size:      36px !important;
  --gf-field-pg-steps-gap-x:            28px !important;

  /* ---- Wachtwoord-sterkte ---- */
  --gf-field-pwd-str-color:             var(--brk-muted) !important;
  --gf-field-pwd-str-color-bad:         var(--brk-orange) !important;
  --gf-field-pwd-str-color-good:        #8B6C32 !important;
  --gf-field-pwd-str-color-strong:      var(--brk-success) !important;
  --gf-field-pwd-str-ind-bg-color:      var(--brk-line-soft) !important;
  --gf-field-pwd-str-ind-radius:        var(--brk-radius-pill) !important;

  /* ---- Producten / prijzen ---- */
  --gf-field-prod-price-color:          var(--brk-dark) !important;

  /* ---- Herhaalveld & sectie ---- */
  --gf-field-repeater-separator-color:      var(--brk-line-soft) !important;
  --gf-field-repeater-nested-border-color:  var(--brk-line-soft) !important;
  --gf-field-repeater-nested-border-radius: 6px !important;
  --gf-field-repeater-nested-padding:       24px !important;
  --gf-field-section-border-color:          var(--brk-line-soft) !important;
  --gf-field-section-padding-y-end:         10px !important;

  /* ---- Formulier-validatie (foutmelding bovenaan) ---- */
  --gf-form-validation-bg-color:        rgba(var(--brk-error-rgb), 0.04) !important;
  --gf-form-validation-border-color:    rgba(var(--brk-error-rgb), 0.28) !important;
  --gf-form-validation-border-color-focus: var(--brk-error) !important;
  --gf-form-validation-radius:          6px !important;
  --gf-form-validation-shadow:          none !important;
  --gf-form-validation-color:           var(--brk-error) !important;
  --gf-form-validation-font-family:     var(--brk-font-body) !important;
  --gf-form-validation-font-size:       15px !important;
  --gf-form-validation-padding-y:       20px !important;
  --gf-form-validation-padding-x:       20px !important;
  --gf-form-validation-heading-font-family: var(--brk-font-heading) !important;
  --gf-form-validation-heading-font-size:   16px !important;
  --gf-form-validation-heading-font-weight: 600 !important;
  --gf-form-validation-heading-icon-bg-color: rgba(var(--brk-error-rgb), 0.08) !important;
  --gf-form-validation-heading-icon-border-color: rgba(var(--brk-error-rgb), 0.35) !important;

  /* ---- Spinner (verzenden) ---- */
  --gf-form-spinner-fg-color:           var(--brk-navy) !important;
  --gf-form-spinner-bg-color:           rgba(1, 19, 45, 0.15) !important;
  --gf-form-spinner-fg-color-secondary: var(--brk-orange) !important;
  --gf-form-spinner-bg-color-secondary: rgba(var(--brk-orange-rgb), 0.15) !important;
}


/* --------------------------------------------------------------------------
   3. WRAPPER & KOP (optionele kaart)
   -------------------------------------------------------------------------- */

/* Formulier staat direct op de pagina (geen achtergrond). */
.gform_wrapper.gform-theme--orbital {
  position: relative;
  box-sizing: border-box;
  background: transparent;
  padding: 0;
  color: var(--brk-text);
  font-family: var(--brk-font-body);
  -webkit-font-smoothing: antialiased;
}
/* Optioneel: kaart met warme achtergrond en oranje toplijn (echo van de
   hero-onderrand). Zet klasse .brk-form--card op de Divi-module. */
.brk-form--card .gform_wrapper.gform-theme--orbital,
.gform_wrapper.gform-theme--orbital.brk-form--card,
.brk-form--card .gform_confirmation_wrapper {
  background: var(--brk-paper);
  border-top: 4px solid var(--brk-orange);
  border-radius: var(--brk-radius-lg);
  padding: clamp(28px, 4.5vw, 56px) clamp(20px, 4.5vw, 56px);
}

/* Formulierkop (titel + omschrijving) — kop met korte oranje streep, zoals de footerkoppen */
.gform_wrapper.gform-theme--orbital .gform_heading {
  margin: 0 0 32px;
}
.gform_wrapper.gform-theme--orbital .gform_title {
  font-family: var(--brk-font-heading);
  font-weight: 700;
  font-size: clamp(24px, 2.4vw, 30px);
  line-height: 1.2;
  color: var(--brk-dark);
  margin: 0 0 14px;
  padding: 0 0 14px;
  position: relative;
}
.gform_wrapper.gform-theme--orbital .gform_title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 3px;
  background: var(--brk-orange);
  border-radius: 2px;
}
.gform_wrapper.gform-theme--orbital .gform_description {
  display: block;
  font-family: var(--brk-font-body);
  font-size: 17px;
  line-height: 1.65;
  color: var(--brk-text);
  margin: 0;
}
.gform_wrapper.gform-theme--orbital .gform_required_legend {
  font-size: 13px;
  color: var(--brk-muted);
  margin: 12px 0 0;
}
.gform_wrapper.gform-theme--orbital .gform_required_legend .gfield_required {
  color: var(--brk-orange);
}


/* --------------------------------------------------------------------------
   4. LABELS, OMSCHRIJVINGEN, TELLERS
   -------------------------------------------------------------------------- */

/* "(Vereist)"-indicator: klein, oranje, subtiel */
.gform_wrapper.gform-theme--orbital .gfield_required {
  font-family: var(--brk-font-body);
  text-transform: none;
}

/* Sublabels boven het veld iets meer lucht */
.gform_wrapper.gform-theme--orbital .field_sublabel_above .gform-field-label--type-sub {
  margin-bottom: 6px;
}

/* Tekenteller onder textarea */
.gform_wrapper.gform-theme--orbital .ginput_counter {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--brk-muted-light);
  text-align: right;
}
.gform_wrapper.gform-theme--orbital .ginput_counter.warningTextareaInfo { color: var(--brk-muted-light); }
.gform_wrapper.gform-theme--orbital .ginput_counter_error,
.gform_wrapper.gform-theme--orbital .ginput_counter.ginput_counter_error { color: var(--brk-error); }


/* --------------------------------------------------------------------------
   5. VELDEN — verfijningen buiten het variabelensysteem
   -------------------------------------------------------------------------- */

/* Overgangen op focus */
.gform_wrapper.gform-theme--orbital input:where(:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button])),
.gform_wrapper.gform-theme--orbital select,
.gform_wrapper.gform-theme--orbital textarea {
  transition: border-color var(--gf-transition-duration) ease,
              background-color var(--gf-transition-duration) ease,
              box-shadow var(--gf-transition-duration) ease;
}

/* Radio- en checkbox-labels: hele regel klikbaar, nette hover */
.gform_wrapper.gform-theme--orbital .gchoice {
  align-items: flex-start;
}
.gform_wrapper.gform-theme--orbital .gchoice label {
  cursor: pointer;
}
.gform_wrapper.gform-theme--orbital .gfield-choice-input {
  cursor: pointer;
  flex-shrink: 0;
}
.gform_wrapper.gform-theme--orbital .gfield-choice-input:hover:not(:disabled) {
  border-color: var(--brk-orange);
}

/* Sectiekop — Roboto Slab met korte oranje streep, geen lange lijn */
.gform_wrapper.gform-theme--orbital .gsection,
.gform_wrapper.gform-theme--orbital .gfield--type-section {
  border-bottom: 0;
  padding-bottom: 0;
  margin-top: 8px;
}
.gform_wrapper.gform-theme--orbital .gsection_title {
  font-family: var(--brk-font-heading);
  font-weight: 700;
  font-size: 22px;
  line-height: 1.25;
  color: var(--brk-dark);
  margin: 0;
  padding: 0 0 12px;
  position: relative;
}
.gform_wrapper.gform-theme--orbital .gsection_title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48px;
  height: 3px;
  background: var(--brk-orange);
  border-radius: 2px;
}
.gform_wrapper.gform-theme--orbital .gsection .gsection_description,
.gform_wrapper.gform-theme--orbital .gfield--type-section .gfield_description {
  margin-top: 12px;
  font-size: 15px;
  color: var(--brk-muted);
}

/* HTML-veld: tekst in huisstijl; GF-alerts met ronde hoeken */
.gform_wrapper.gform-theme--orbital .gfield_html {
  font-family: var(--brk-font-body);
  font-size: 17px;
  line-height: 1.65;
  color: var(--brk-text);
}
.gform_wrapper.gform-theme--orbital .gfield_html h2,
.gform_wrapper.gform-theme--orbital .gfield_html h3,
.gform_wrapper.gform-theme--orbital .gfield_html h4 {
  font-family: var(--brk-font-heading);
  color: var(--brk-dark);
  line-height: 1.25;
  margin: 0 0 12px;
}
.gform_wrapper.gform-theme--orbital .gfield_html h2 { font-size: 26px; font-weight: 700; }
.gform_wrapper.gform-theme--orbital .gfield_html h3 { font-size: 22px; font-weight: 700; }
.gform_wrapper.gform-theme--orbital .gfield_html h4 { font-size: 18px; font-weight: 600; }
.gform_wrapper.gform-theme--orbital .gfield_html p { margin: 0 0 1em; }
.gform_wrapper.gform-theme--orbital .gfield_html p:last-child { margin-bottom: 0; }
.gform_wrapper.gform-theme--orbital .gfield_html a,
.gform_wrapper.gform-theme--orbital .gfield_description a,
.gform_wrapper.gform-theme--orbital .gfield_consent_description a,
.gform_wrapper.gform-theme--orbital .gchoice label a {
  color: var(--brk-orange);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.gform_wrapper.gform-theme--orbital .gfield_html a:hover,
.gform_wrapper.gform-theme--orbital .gfield_description a:hover,
.gform_wrapper.gform-theme--orbital .gfield_consent_description a:hover,
.gform_wrapper.gform-theme--orbital .gchoice label a:hover {
  color: var(--brk-dark);
}
.gform_wrapper.gform-theme--orbital .gfield_html.gf_alert_green,
.gform_wrapper.gform-theme--orbital .gfield_html.gf_alert_red,
.gform_wrapper.gform-theme--orbital .gfield_html.gf_alert_yellow,
.gform_wrapper.gform-theme--orbital .gfield_html.gf_alert_gray,
.gform_wrapper.gform-theme--orbital .gfield_html.gf_alert_blue {
  border-radius: 6px;
  border-width: 1px;
  padding: 16px 20px;
  font-size: 15px;
}

/* Consent (AVG-akkoord): omschrijvingskader in huisstijl */
.gform_wrapper.gform-theme--orbital .gfield_consent_description {
  background: var(--brk-paper);
  border-radius: var(--brk-radius);
  font-size: 14px;
  line-height: 1.55;
  color: var(--brk-muted);
  margin-top: 12px;
}
.gform_wrapper.gform-theme--orbital .gfield_consent_description_text {
  padding: 14px 16px;
}

/* Telefoonveld met landenkiezer (GF 3)
   - De sublabels "Land" en "Telefoonnummer" zijn visueel verborgen (het
     hoofdlabel volstaat), zodat het veld op één lijn ligt met buurvelden.
     Ze blijven beschikbaar voor schermlezers.
   - De vlag-knop is technisch een "tertiary button"; hij krijgt hier
     veldhoogte, veldrand, witte achtergrond en kleine radius zodat knop en
     invoerveld als één veld met een dunne scheidingslijn lezen. */
.gform_wrapper.gform-theme--orbital .gfield--type-phone .gform-phone .gform-field-label--type-sub {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.gform_wrapper.gform-theme--orbital .gform-phone__country-selector {
  --gf-ctrl-btn-size:                       var(--gf-ctrl-size);
  --gf-ctrl-btn-padding-x:                  12px;
  --gf-ctrl-btn-radius:                     var(--gf-ctrl-radius);
  --gf-ctrl-btn-font-family:                var(--brk-font-body);
  --gf-ctrl-btn-font-size:                  15px;
  --gf-ctrl-btn-font-weight:                500;
  --gf-ctrl-btn-letter-spacing:             0;
  --gf-ctrl-btn-text-transform:             none;
  --gf-ctrl-btn-bg-color-tertiary:          var(--brk-white);
  --gf-ctrl-btn-bg-color-hover-tertiary:    var(--brk-paper);
  --gf-ctrl-btn-bg-color-focus-tertiary:    var(--brk-white);
  --gf-ctrl-btn-border-color-tertiary:      var(--gf-ctrl-border-color);
  --gf-ctrl-btn-border-color-hover-tertiary: var(--gf-ctrl-border-color-hover);
  --gf-ctrl-btn-border-color-focus-tertiary: var(--brk-orange);
  --gf-ctrl-btn-border-width-tertiary:      var(--gf-ctrl-border-width);
  --gf-ctrl-btn-shadow-tertiary:            none;
  --gf-ctrl-btn-shadow-hover-tertiary:      none;
  --gf-ctrl-btn-color-tertiary:             var(--brk-dark);
}
/* Pijltje van de landkeuze: gedempt, donker bij hover/open */
.gform_wrapper.gform-theme--orbital .gform-phone__country-selector::after {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%239B948C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.gform_wrapper.gform-theme--orbital .gform-phone__country-selector:hover::after,
.gform_wrapper.gform-theme--orbital .gform-phone__country-selector:focus-visible::after,
.gform_wrapper.gform-theme--orbital .gform-phone__country-selector[aria-expanded=true]::after {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%231C1C1C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
/* Landenlijst (zoekveld + lijst) */
.gform_wrapper.gform-theme--orbital .gform-phone__dropdown {
  border-radius: 6px;
  box-shadow: var(--brk-shadow-pop);
}
.gform_wrapper.gform-theme--orbital .gform-phone__country-item--focused,
.gform_wrapper.gform-theme--orbital .gform-phone__country-item:hover {
  background: var(--brk-paper);
  box-shadow: inset 3px 0 0 var(--brk-orange);
}
.gform_wrapper.gform-theme--orbital .gform-phone__country-item--active {
  color: var(--brk-orange);
  font-weight: 600;
}

/* Datumkiezer: de kalender-knop in het veld nooit als gekleurde knop tonen */
.gform_wrapper.gform-theme--orbital .gform-datepicker-toggle {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: var(--brk-muted-light);
  cursor: pointer;
}
.gform_wrapper.gform-theme--orbital .gform-datepicker-toggle:hover,
.gform_wrapper.gform-theme--orbital .gform-datepicker-toggle:focus-visible {
  color: var(--brk-orange);
}

/* Datum-/tijdveld: losse dropdowns en tijd-velden op één lijn */
.gform_wrapper.gform-theme--orbital .ginput_container_date .gfield_date_dropdown_month,
.gform_wrapper.gform-theme--orbital .ginput_container_date .gfield_date_dropdown_day,
.gform_wrapper.gform-theme--orbital .ginput_container_date .gfield_date_dropdown_year {
  min-width: 0;
}
.gform_wrapper.gform-theme--orbital .ginput_container_time .hour_minute_colon {
  color: var(--brk-muted);
  font-weight: 600;
  align-self: center;
}

/* Bestand uploaden — witte zone met gestippelde rand, oranje bij hover/drag */
.gform_wrapper.gform-theme--orbital .gform_drop_area {
  background: var(--brk-white);
  border-color: var(--brk-line);
  transition: border-color var(--gf-transition-duration) ease, background-color var(--gf-transition-duration) ease;
}
.gform_wrapper.gform-theme--orbital .gform_drop_area:hover,
.gform_wrapper.gform-theme--orbital .gform_drop_area.gform_drag_over,
.gform_wrapper.gform-theme--orbital .gform_drop_area:has(:focus-visible) {
  border-color: var(--brk-orange);
  background: #FFFBF9;
}
.gform_wrapper.gform-theme--orbital .gform_drop_instructions {
  font-family: var(--brk-font-body);
  font-size: 16px;
  color: var(--brk-text);
}
.gform_wrapper.gform-theme--orbital .gform_fileupload_rules {
  font-size: 13px;
  color: var(--brk-muted);
  margin-top: 8px;
}
.gform_wrapper.gform-theme--orbital .ginput_preview {
  background: var(--brk-white);
  border: 1px solid var(--brk-line-soft);
  border-radius: var(--brk-radius);
  padding: 12px 14px;
}
.gform_wrapper.gform-theme--orbital .gform_delete_file {
  color: var(--brk-muted-light);
}
.gform_wrapper.gform-theme--orbital .gform_delete_file:hover {
  color: var(--brk-error);
}
/* Enkele upload zonder dropzone: "Bestand kiezen"-knop */
.gform_wrapper.gform-theme--orbital input[type=file]::file-selector-button {
  background: var(--brk-dark);
  color: var(--brk-white);
  border: 0;
  cursor: pointer;
  transition: background-color var(--gf-transition-duration) ease;
}
.gform_wrapper.gform-theme--orbital input[type=file]:hover::file-selector-button {
  background: var(--brk-orange);
}

/* Lijstveld (tabel met rijen) */
.gform_wrapper.gform-theme--orbital .gfield_list_group {
  background: transparent;
}
.gform_wrapper.gform-theme--orbital .gfield_header_item {
  font-family: var(--brk-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--brk-text);
}
.gform_wrapper.gform-theme--orbital .gfield_list_icons button {
  transition: background-color var(--gf-transition-duration) ease, transform var(--gf-transition-duration) ease;
}
.gform_wrapper.gform-theme--orbital .gfield_list_icons button:hover {
  transform: scale(1.08);
}

/* Herhaalveld */
.gform_wrapper.gform-theme--orbital .gfield_repeater_item {
  background: var(--brk-white);
}
.gform_wrapper.gform-theme--orbital .gfield_repeater_buttons .gform-theme-button,
.gform_wrapper.gform-theme--orbital .gfield_repeater_buttons button {
  font-family: var(--brk-font-heading);
}

/* Producten, aantal, verzendkosten, totaal */
.gform_wrapper.gform-theme--orbital .ginput_product_price,
.gform_wrapper.gform-theme--orbital .ginput_shipping_price,
.gform_wrapper.gform-theme--orbital .ginput_total {
  font-family: var(--brk-font-heading);
  font-weight: 600;
  font-size: 18px;
  color: var(--brk-dark);
}
.gform_wrapper.gform-theme--orbital .gfield--type-total .ginput_total {
  font-size: 24px;
  color: var(--brk-orange);
}
.gform_wrapper.gform-theme--orbital .ginput_product_price_label,
.gform_wrapper.gform-theme--orbital .ginput_quantity_label {
  font-family: var(--brk-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--brk-muted);
}
.gform_wrapper.gform-theme--orbital .gfield_option .gchoice label .ginput_price,
.gform_wrapper.gform-theme--orbital .gfield_checkbox .ginput_price,
.gform_wrapper.gform-theme--orbital .gfield_radio .ginput_price {
  color: var(--brk-muted);
  font-weight: 500;
}
.gform_wrapper.gform-theme--orbital .gform_card_icon_container {
  margin-top: 8px;
}
.gform_wrapper.gform-theme--orbital .gfield_creditcard_warning_message {
  color: var(--brk-error);
  font-size: 14px;
}

/* Handtekening (Signature add-on) */
.gform_wrapper.gform-theme--orbital .gfield_signature_container {
  background: var(--brk-white);
  border: 1px solid var(--brk-line);
  border-radius: var(--brk-radius);
  overflow: hidden;
}
.gform_wrapper.gform-theme--orbital .gfield_signature_container canvas {
  background: var(--brk-white);
}
.gform_wrapper.gform-theme--orbital .gform_signature_reset,
.gform_wrapper.gform-theme--orbital .gfield_signature_reset a {
  font-family: var(--brk-font-body);
  font-size: 13px;
  color: var(--brk-muted);
  text-decoration: underline;
}

/* reCAPTCHA / Turnstile / hCaptcha: links uitlijnen met velden */
.gform_wrapper.gform-theme--orbital .gfield--type-captcha .ginput_container,
.gform_wrapper.gform-theme--orbital .gfield--type-captcha iframe {
  margin: 0;
}

/* Verborgen velden, honeypot en admin-only nooit tonen */
.gform_wrapper.gform-theme--orbital .gform_hidden,
.gform_wrapper.gform-theme--orbital .gf_hidden,
.gform_wrapper.gform-theme--orbital .gform_validation_container,
.gform_wrapper.gform-theme--orbital .gfield_visibility_hidden,
.gform_wrapper.gform-theme--orbital .gfield_visibility_administrative {
  display: none !important;
}


/* --------------------------------------------------------------------------
   6. KNOPPEN & FOOTER
   -------------------------------------------------------------------------- */
.gform_wrapper.gform-theme--orbital .gform_footer,
.gform_wrapper.gform-theme--orbital .gform_page_footer {
  align-items: center;
  flex-wrap: wrap;
}
.gform_wrapper.gform-theme--orbital .gform_footer .gform_button,
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_button,
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_next_button,
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_previous_button,
.gform_wrapper.gform-theme--orbital .gform-theme-button {
  cursor: pointer;
  transition: background-color var(--gf-transition-duration) ease,
              color var(--gf-transition-duration) ease,
              border-color var(--gf-transition-duration) ease,
              box-shadow var(--gf-transition-duration) ease,
              transform var(--gf-transition-duration) ease;
}
.gform_wrapper.gform-theme--orbital .gform_footer .gform_button:hover:not(:disabled),
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_next_button:hover:not(:disabled) {
  transform: translateY(-1px);
}
.gform_wrapper.gform-theme--orbital .gform_footer .gform_button:active,
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_next_button:active {
  transform: translateY(0);
}

/* Opslaan & later verder — als tekstlink met oranje onderstreping */
.gform_wrapper.gform-theme--orbital .gform_save_link {
  font-family: var(--brk-font-body);
  font-size: 15px;
  font-weight: 500;
  color: var(--brk-dark);
  text-decoration: underline;
  text-decoration-color: var(--brk-orange);
  text-underline-offset: 4px;
  text-decoration-thickness: 2px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.gform_wrapper.gform-theme--orbital .gform_save_link:hover {
  color: var(--brk-orange);
}
.gform_wrapper.gform-theme--orbital .form_saved_message,
.gform_wrapper.gform-theme--orbital .form_saved_message_sent {
  background: var(--brk-white);
  border: 1px solid var(--brk-line-soft);
  border-left: 4px solid var(--brk-orange);
  border-radius: 6px;
  padding: 24px 28px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--brk-text);
}
.gform_wrapper.gform-theme--orbital .form_saved_message .form_saved_message_emailform input[type=email] {
  margin-bottom: 12px;
}

/* Ajax-spinner (oude img-variant) */
.gform_wrapper.gform-theme--orbital .gform_ajax_spinner {
  width: 24px;
  height: 24px;
  margin-left: 12px;
}


/* --------------------------------------------------------------------------
   7. VALIDATIE & BEVESTIGING
   -------------------------------------------------------------------------- */

/* Foutmelding per veld */
.gform_wrapper.gform-theme--orbital .gfield_validation_message,
.gform_wrapper.gform-theme--orbital .validation_message {
  font-family: var(--brk-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--brk-error);
  background: transparent;
  border: 0;
  padding: 0;
  margin-top: 8px;
}
.gform_wrapper.gform-theme--orbital .gfield_error .gfield_label,
.gform_wrapper.gform-theme--orbital .gfield_error .gform-field-label:where(:not([class*=gform-field-label--type-])) {
  color: var(--brk-dark);
}

/* Formulierbrede foutmelding bovenaan */
.gform_wrapper.gform-theme--orbital .gform_validation_errors {
  margin-bottom: 32px;
}
.gform_wrapper.gform-theme--orbital .gform_validation_errors .gform_submission_error {
  font-family: var(--brk-font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--brk-error);
}
.gform_wrapper.gform-theme--orbital .gform_validation_errors ol a {
  color: var(--brk-error);
}

/* Bevestigingsbericht na verzenden */
.gform_confirmation_wrapper {
  position: relative;
  box-sizing: border-box;
  background: transparent;
  padding: 0;
}
.gform_confirmation_wrapper .gform_confirmation_message {
  font-family: var(--brk-font-body);
  font-size: 18px;
  line-height: 1.65;
  color: var(--brk-dark);
  padding-left: 56px;
  position: relative;
}
.gform_confirmation_wrapper .gform_confirmation_message::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--brk-orange) url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 7.5l5 5L16.5 1.5' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 14px no-repeat;
}
.gform_confirmation_wrapper .gform_confirmation_message h2,
.gform_confirmation_wrapper .gform_confirmation_message h3 {
  font-family: var(--brk-font-heading);
  font-weight: 700;
  color: var(--brk-dark);
  margin: 0 0 8px;
  line-height: 1.25;
}
.gform_confirmation_wrapper .gform_confirmation_message h2 { font-size: 26px; }
.gform_confirmation_wrapper .gform_confirmation_message h3 { font-size: 22px; }
.gform_confirmation_wrapper .gform_confirmation_message p { margin: 0 0 0.8em; }
.gform_confirmation_wrapper .gform_confirmation_message p:last-child { margin-bottom: 0; }
.gform_confirmation_wrapper .gform_confirmation_message a {
  color: var(--brk-orange);
  text-decoration: underline;
  text-underline-offset: 3px;
}
/* GF's eigen gekleurde bevestigingsvarianten (formulierklasse) neutraliseren */
.gform_confirmation_wrapper.gf_confirmation_simple_yellow,
.gform_confirmation_wrapper.gf_confirmation_simple_gray,
.gform_confirmation_wrapper.gf_confirmation_yellow_gradient,
.gform_confirmation_wrapper.gf_confirmation_green_gradient {
  background: transparent;
  border: 0;
  padding: 0;
}
.gform_confirmation_wrapper.gf_confirmation_green_gradient::after,
.gform_confirmation_wrapper.gf_confirmation_yellow_gradient::after {
  display: none;
}


/* --------------------------------------------------------------------------
   8. DIVI & DIVI PIXEL — conflicten opheffen
      De verzendknop krijgt door de Divi Pixel-module de klasse .et_pb_button;
      Divi's knopstijl (pijl-icoon, padding, 2px rand, line-height !important)
      wordt hier volledig teruggezet naar de GF-huisstijl.
   -------------------------------------------------------------------------- */
/* 8a. Basis: alle knoppen in footer/paginafooter terug naar de GF-huisstijl
       (rand en kleur worden per variant hieronder gezet) */
.gform_wrapper.gform-theme--orbital :is(.gform_footer, .gform_page_footer) .et_pb_button,
.dipi_gravity_forms_styler .gform_wrapper :is(.gform_footer, .gform_page_footer) :is(input[type=submit], input[type=button], button) {
  font-family: var(--brk-font-heading) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  height: var(--brk-btn-height) !important;
  padding: 0 36px !important;
  border-radius: var(--brk-radius-pill) !important;
  background-image: none !important;
  box-shadow: none !important;
  transition: background-color var(--gf-transition-duration) ease,
              color var(--gf-transition-duration) ease,
              border-color var(--gf-transition-duration) ease,
              box-shadow var(--gf-transition-duration) ease !important;
}
/* 8b. Primair: verzenden / volgende — oranje pil, navy tekst (zoals header-CTA)
       (.gform_button.button erbij: Divi Pixel zet zijn eigen !important-achtergrond
       met hoge specificiteit; deze selector wint daarvan, ook op hover) */
.gform_wrapper.gform-theme--orbital :is(.gform_footer, .gform_page_footer) .et_pb_button:not(.gform_previous_button),
.dipi_gravity_forms_styler .gform_wrapper .gform_footer :is(input[type=submit], button[type=submit]).gform_button.button,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_next_button {
  border: 0 !important;
  background-color: var(--brk-orange) !important;
  color: var(--brk-navy) !important;
}
.gform_wrapper.gform-theme--orbital :is(.gform_footer, .gform_page_footer) .et_pb_button:not(.gform_previous_button):hover,
.gform_wrapper.gform-theme--orbital :is(.gform_footer, .gform_page_footer) .et_pb_button:not(.gform_previous_button):focus-visible,
.dipi_gravity_forms_styler .gform_wrapper .gform_footer :is(input[type=submit], button[type=submit]).gform_button.button:hover,
.dipi_gravity_forms_styler .gform_wrapper .gform_footer :is(input[type=submit], button[type=submit]).gform_button.button:focus-visible,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_next_button:hover,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_next_button:focus-visible {
  background-color: var(--brk-dark) !important;
  color: var(--brk-white) !important;
  padding: 0 36px !important;
  box-shadow: var(--brk-shadow-btn) !important;
}
/* 8c. Secundair: vorige — omlijnde pil */
.gform_wrapper.gform-theme--orbital .gform_page_footer .et_pb_button.gform_previous_button,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_previous_button {
  border: 2px solid var(--brk-dark) !important;
  background-color: transparent !important;
  color: var(--brk-dark) !important;
}
.gform_wrapper.gform-theme--orbital .gform_page_footer .et_pb_button.gform_previous_button:hover,
.gform_wrapper.gform-theme--orbital .gform_page_footer .et_pb_button.gform_previous_button:focus-visible,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_previous_button:hover,
.dipi_gravity_forms_styler .gform_wrapper .gform_page_footer :is(input, button).gform_previous_button:focus-visible {
  background-color: var(--brk-dark) !important;
  color: var(--brk-white) !important;
}
/* 8d. Divi's pijl-icoon op knoppen uit */
.gform_wrapper .et_pb_button::after,
.gform_wrapper .et_pb_button::before,
.dipi_gravity_forms_styler .gform_wrapper :is(.gform_footer, .gform_page_footer) button::after,
.dipi_gravity_forms_styler .gform_wrapper :is(.gform_footer, .gform_page_footer) button::before {
  display: none !important;
  content: none !important;
}
/* 8e. Uitgeschakelde knop */
.gform_wrapper.gform-theme--orbital :is(.gform_footer, .gform_page_footer) .et_pb_button:disabled,
.dipi_gravity_forms_styler .gform_wrapper :is(.gform_footer, .gform_page_footer) :is(input, button):disabled {
  opacity: 0.55 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
/* Divi Pixel zet vaste hoogte/padding op de landkeuze van het adresveld */
.dipi_gravity_forms_styler .gform_wrapper .ginput_address_country select {
  height: var(--gf-ctrl-size, var(--brk-ctrl-height)) !important;
  padding: 0 44px 0 var(--gf-padding-x, 18px) !important;
  box-shadow: none !important;
}
/* Divi-reset: geen extra marges/randen van het thema op form-elementen */
.gform_wrapper.gform-theme--orbital ul.gform_fields,
.gform_wrapper.gform-theme--orbital ul.gform_fields li.gfield {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.gform_wrapper.gform-theme--orbital ul.gform_fields li.gfield::marker {
  content: "";
}
/* Divi's globale link-kleur (#2ea3f2) nooit in het formulier */
.gform_wrapper.gform-theme--orbital a:where(:not(.gform-theme-button)) {
  color: var(--brk-orange);
}


/* --------------------------------------------------------------------------
   9. VARIANTEN
   -------------------------------------------------------------------------- */

/* 9a. Donkere sectie (bv. formulier in footer of op #1C1C1C-achtergrond)
       Klasse .brk-form--dark op de Divi-module of de sectie. */
.brk-form--dark .gform_wrapper.gform-theme--orbital,
.gform_wrapper.gform-theme--orbital.brk-form--dark {
  --brk-paper:           #262626;
  --brk-paper-deep:      #303030;
  --brk-line:            #4A4A4A;
  --brk-line-hover:      #6B6B6B;
  --brk-line-soft:       #3A3A3A;
  --brk-text:            #D9D9D9;
  --brk-muted:           #B0B0B0;
  --brk-muted-light:     #8A8A8A;
  --gf-color-in-ctrl:                 #1C1C1C !important;
  --gf-color-in-ctrl-rgb:             28, 28, 28 !important;
  --gf-color-in-ctrl-contrast:        #FFFFFF !important;
  --gf-color-in-ctrl-contrast-rgb:    255, 255, 255 !important;
  --gf-color-in-ctrl-darker:          #262626 !important;
  --gf-color-in-ctrl-lighter:         #262626 !important;
  --gf-color-in-ctrl-light-lighter:   #303030 !important;
  --gf-color-out-ctrl-dark-darker:    #FFFFFF !important;
  --gf-ctrl-bg-color:                 #1C1C1C !important;
  --gf-ctrl-bg-color-hover:           #1C1C1C !important;
  --gf-ctrl-bg-color-focus:           #1C1C1C !important;
  --gf-ctrl-bg-color-disabled:        #303030 !important;
  --gf-ctrl-bg-color-error:           #2A1F1E !important;
  --gf-ctrl-color:                    #FFFFFF !important;
  --gf-ctrl-placeholder-color:        #8A8A8A !important;
  --gf-ctrl-label-color-primary:      #FFFFFF !important;
  --gf-ctrl-label-color-secondary:    #FFFFFF !important;
  --gf-ctrl-label-color-tertiary:     #B0B0B0 !important;
  --gf-ctrl-label-color-quaternary:   #D9D9D9 !important;
  --gf-ctrl-desc-color:               #B0B0B0 !important;
  --gf-color-secondary:               #262626 !important;
  --gf-color-secondary-contrast:      #FFFFFF !important;
  --gf-color-secondary-darker:        #303030 !important;
  --gf-ctrl-btn-bg-color-hover-primary:       #FFFFFF !important;
  --gf-ctrl-btn-color-hover-primary:          var(--brk-dark) !important;
  --gf-ctrl-btn-border-color-secondary:       #FFFFFF !important;
  --gf-ctrl-btn-color-secondary:              #FFFFFF !important;
  --gf-ctrl-btn-bg-color-hover-secondary:     #FFFFFF !important;
  --gf-ctrl-btn-color-hover-secondary:        var(--brk-dark) !important;
  --gf-ctrl-select-dropdown-option-bg-color-hover: #303030 !important;
  --gf-ctrl-date-picker-bg-color:     #262626 !important;
  --gf-ctrl-date-picker-cell-content-color: #FFFFFF !important;
  --gf-ctrl-date-picker-cell-content-bg-color-hover: #3A3A3A !important;
  --gf-field-pg-steps-number-bg-color: #1C1C1C !important;
  --gf-field-pg-steps-number-bg-color-active: #FFFFFF !important;
  --gf-field-pg-steps-number-color-active: var(--brk-dark) !important;
  --gf-field-pg-steps-number-border-color-active: #FFFFFF !important;
  --gf-form-validation-bg-color:      rgba(179, 38, 30, 0.12) !important;
  --gf-form-validation-color:         #FF8A80 !important;
  --gf-ctrl-desc-color-error:         #FF8A80 !important;
  --gf-ctrl-border-color-error:       #FF8A80 !important;
  --gf-ctrl-label-color-req:          #F0774D !important;
  color: #D9D9D9;
}
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_title,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gsection_title,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_html h2,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_html h3,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_html h4,
.brk-form--dark .gform_wrapper.gform-theme--orbital .ginput_product_price,
.brk-form--dark .gform_wrapper.gform-theme--orbital .ginput_shipping_price,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_save_link,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_error .gform-field-label {
  color: #FFFFFF;
}
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_description,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_html,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_drop_instructions {
  color: #D9D9D9;
}
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_drop_area,
.brk-form--dark .gform_wrapper.gform-theme--orbital .ginput_preview,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_consent_description,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_repeater_item,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gfield_signature_container {
  background: #1C1C1C;
  border-color: #4A4A4A;
}
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_drop_area:hover,
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_drop_area.gform_drag_over {
  background: #231E1C;
}
.brk-form--dark .gform_wrapper.gform-theme--orbital .gform_footer .et_pb_button:hover,
.brk-form--dark .dipi_gravity_forms_styler .gform_wrapper .gform_footer button[type=submit]:hover {
  background-color: #FFFFFF !important;
  color: var(--brk-dark) !important;
}
.brk-form--dark .gform_confirmation_wrapper .gform_confirmation_message {
  color: #FFFFFF;
}

/* 9b. Compact (sidebar, popup, kleine kolom) */
.brk-form--compact .gform_wrapper.gform-theme--orbital,
.gform_wrapper.gform-theme--orbital.brk-form--compact {
  --brk-ctrl-height:              46px;
  --brk-btn-height:               50px;
  --gf-form-gap-y:                20px !important;
  --gf-form-gap-x:                16px !important;
  --gf-padding-x:                 14px !important;
  --gf-font-size-primary:         16px !important;
  --gf-ctrl-label-font-size-primary: 15px !important;
  --gf-ctrl-desc-font-size:       14px !important;
  --gf-ctrl-textarea-height:      130px !important;
  --gf-ctrl-btn-padding-x-md:     28px !important;
}

/* 9c. Nieuwsbrief-strook: GF formulierklasse "gf_simple_horizontal"
       (veld + knop op één regel) — knop op veldhoogte */
.gform_wrapper.gform-theme--orbital .gf_simple_horizontal .gform_footer .gform_button {
  height: var(--brk-ctrl-height) !important;
  padding: 0 28px !important;
  white-space: nowrap;
}
.gform_wrapper.gform-theme--orbital .gf_simple_horizontal .gform_body {
  flex: 1 1 auto;
}


/* --------------------------------------------------------------------------
   10. RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 980px) {
  .gform_wrapper.gform-theme--orbital {
    --gf-form-gap-y: 24px !important;
    --gf-form-gap-x: 20px !important;
  }
}
@media (max-width: 640px) {
  .gform_wrapper.gform-theme--orbital {
    --brk-ctrl-height: 50px;
    --gf-form-gap-y: 22px !important;
    --gf-font-size-primary: 16px !important;      /* ≥16px voorkomt inzoomen op iOS */
    --gf-ctrl-label-font-size-primary: 15px !important;
    --gf-ctrl-textarea-height: 140px !important;
    --gf-field-pg-steps-gap-x: 16px !important;
    --gf-field-pg-steps-number-size: 32px !important;
  }
  .brk-form--card .gform_wrapper.gform-theme--orbital,
  .gform_wrapper.gform-theme--orbital.brk-form--card,
  .brk-form--card .gform_confirmation_wrapper {
    padding: 24px 18px 28px;
    border-radius: 6px;
  }
  .gform_wrapper.gform-theme--orbital .gform_heading { margin-bottom: 24px; }
  .gform_wrapper.gform-theme--orbital .gform_title { font-size: 24px; }
  .gform_wrapper.gform-theme--orbital .gform_description { font-size: 16px; }

  /* Knoppen volle breedte op mobiel */
  .gform_wrapper.gform-theme--orbital .gform_footer,
  .gform_wrapper.gform-theme--orbital .gform_page_footer {
    flex-direction: column;
    align-items: stretch;
  }
  .gform_wrapper.gform-theme--orbital .gform_footer .gform_button,
  .gform_wrapper.gform-theme--orbital .gform_page_footer .gform_button,
  .gform_wrapper.gform-theme--orbital .gform_page_footer .gform_next_button,
  .gform_wrapper.gform-theme--orbital .gform_page_footer .gform_previous_button,
  .dipi_gravity_forms_styler .gform_wrapper .gform_footer button[type=submit],
  .dipi_gravity_forms_styler .gform_wrapper .gform_footer input[type=submit] {
    width: 100% !important;
    text-align: center;
  }
  .gform_wrapper.gform-theme--orbital .gform_save_link {
    text-align: center;
    margin-top: 8px;
  }
  .gform_confirmation_wrapper .gform_confirmation_message {
    padding-left: 0;
    padding-top: 52px;
    font-size: 17px;
  }
  /* Nieuwsbrief-strook stapelt op mobiel */
  .gform_wrapper.gform-theme--orbital .gf_simple_horizontal .gform_footer .gform_button {
    height: var(--brk-btn-height) !important;
  }
}


/* --------------------------------------------------------------------------
   11. TOEGANKELIJKHEID & AFWERKING
   -------------------------------------------------------------------------- */

/* Zichtbare focusring op knoppen en links (toetsenbord) */
.gform_wrapper.gform-theme--orbital .gform_footer .gform_button:focus-visible,
.gform_wrapper.gform-theme--orbital .gform_page_footer .gform_button:focus-visible,
.gform_wrapper.gform-theme--orbital .gform-theme-button:focus-visible,
.gform_wrapper.gform-theme--orbital .gform_save_link:focus-visible,
.gform_wrapper.gform-theme--orbital a:focus-visible {
  outline: 3px solid rgba(var(--brk-orange-rgb), 0.45);
  outline-offset: 3px;
}

/* Tekstselectie in huisstijl */
.gform_wrapper.gform-theme--orbital ::selection {
  background: rgba(var(--brk-orange-rgb), 0.25);
}

/* Autofill (Chrome) niet geel/blauw maken */
.gform_wrapper.gform-theme--orbital input:-webkit-autofill,
.gform_wrapper.gform-theme--orbital input:-webkit-autofill:hover,
.gform_wrapper.gform-theme--orbital input:-webkit-autofill:focus,
.gform_wrapper.gform-theme--orbital textarea:-webkit-autofill,
.gform_wrapper.gform-theme--orbital select:-webkit-autofill {
  -webkit-text-fill-color: var(--brk-dark);
  -webkit-box-shadow: 0 0 0 1000px var(--brk-white) inset;
  transition: background-color 9999s ease-out;
}

/* Minder beweging voor wie dat instelt */
@media (prefers-reduced-motion: reduce) {
  .gform_wrapper.gform-theme--orbital *,
  .gform_wrapper.gform-theme--orbital *::before,
  .gform_wrapper.gform-theme--orbital *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
  .gform_wrapper.gform-theme--orbital .gform_footer .gform_button:hover {
    transform: none;
  }
}

/* Printen: geen achtergrond, geen schaduwen */
@media print {
  .gform_wrapper.gform-theme--orbital,
  .gform_confirmation_wrapper {
    background: none;
    border: 0;
    padding: 0;
  }
}
