.vck-melding-form .gf_page_steps {
display: flex !important;
flex-wrap: wrap !important;
gap: 24px 16px !important;
justify-content: space-between !important;
padding: 24px 0 40px !important;
border: none !important;
}
.vck-melding-form .gf_step {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
text-align: center !important;
gap: 8px !important;
flex: 1 1 0 !important;
min-width: 0 !important;
max-width: 160px !important;
}
.vck-melding-form .gf_step_number {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 56px !important;
height: 56px !important;
border-radius: 14px !important;
border: none !important;
background: #dbeafe !important;
color: #4054B2 !important;
font-weight: 700 !important;
font-size: 20px !important;
flex: 0 0 56px !important;
line-height: 1 !important;
position: relative !important;
}
.vck-melding-form .gf_step_active .gf_step_number {
background: #4054B2 !important;
border-color: #4054B2 !important;
color: #fff !important;
}
.vck-melding-form .gf_step_completed .gf_step_number {
background: #dbeafe !important;
border-color: transparent !important;
color: transparent !important;
font-size: 0 !important;
}
.vck-melding-form .gf_step_completed .gf_step_number::before {
content: "✓" !important;
background: none !important;
border: none !important;
width: auto !important;
height: auto !important;
top: auto !important;
left: auto !important;
right: auto !important;
bottom: auto !important;
position: static !important;
display: inline-block !important;
font-family: inherit !important;
font-size: 20px !important;
color: #4054B2 !important;
font-weight: 700 !important;
line-height: 1 !important;
}
.vck-melding-form .gf_step_completed .gf_step_number::after {
content: none !important;
display: none !important;
}
.vck-melding-form .gf_step_label {
text-transform: none !important;
letter-spacing: 0 !important;
font-weight: 500 !important;
color: #9ca3af !important;
font-size: 13px !important;
line-height: 1.35 !important;
}
.vck-melding-form .gf_step_active .gf_step_label,
.vck-melding-form .gf_step_completed .gf_step_label {
color: #111827 !important;
font-weight: 600 !important;
}
.vck-melding-form .gform_footer {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
gap: 16px !important;
margin-top: 24px !important;
}
.vck-melding-form .gform_previous_button {
background: #f3f4f6 !important;
color: #374151 !important;
border: none !important;
border-radius: 10px !important;
padding: 12px 32px !important;
font-weight: 500 !important;
}
.vck-melding-form .gform_next_button,
.vck-melding-form .gform_button[type=submit] {
background: #4054B2 !important;
color: #fff !important;
border: none !important;
border-radius: 10px !important;
padding: 12px 32px !important;
font-weight: 600 !important;
}
.vck-melding-form .gform_next_button:hover,
.vck-melding-form .gform_button[type=submit]:hover {
background: #2c3d8a !important;
}
.vck-melding-form .gfield_label {
font-weight: 500 !important;
color: #374151 !important;
font-size: 15px !important;
}
.vck-melding-form .gfield_required_text {
display: none !important;
}
.vck-melding-form .gfield_label > .gfield_required {
font-size: 0 !important;
color: transparent !important;
display: inline-block !important;
}
.vck-melding-form .gfield_label > .gfield_required::after {
content: "*";
color: #dc2626;
font-weight: 700;
font-size: 16px;
margin-left: 4px;
}
.vck-melding-form .vck-step-title {
font-size: 32px !important;
font-weight: 600 !important;
color: #111827 !important;
margin: 0 0 4px !important;
line-height: 1.2 !important;
}
.vck-melding-form .vck-step-subtitle {
font-size: 14px !important;
color: #6b7280 !important;
margin: 0 0 24px !important;
font-weight: 400 !important;
}
.vck-melding-form .gfield .ginput_container,
.vck-melding-form .gfield .ginput_complex {
width: 100% !important;
max-width: 100% !important;
}
.vck-melding-form .gfield input[type=text],
.vck-melding-form .gfield input[type=email],
.vck-melding-form .gfield input[type=tel],
.vck-melding-form .gfield input[type=number],
.vck-melding-form .gfield input[type=date],
.vck-melding-form .gfield input[type=url],
.vck-melding-form .gfield textarea,
.vck-melding-form .gfield select {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box;
}
.vck-melding-form .gfield .ginput_container_date {
display: block !important;
position: relative !important;
width: 100% !important;
}
.vck-melding-form .gfield .ginput_container_date input {
padding-right: 40px !important;
width: 100% !important;
}
.vck-melding-form .gfield .ginput_container_date button.gform-datepicker-toggle {
position: absolute !important;
right: 6px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: auto !important;
min-width: 0 !important;
height: auto !important;
min-height: 0 !important;
padding: 4px 6px !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
margin: 0 !important;
z-index: 2 !important;
cursor: pointer !important;
color: #6b7280 !important;
}
.vck-melding-form .gfield .ginput_container_date button.gform-datepicker-toggle:hover,
.vck-melding-form .gfield .ginput_container_date button.gform-datepicker-toggle:focus {
background: transparent !important;
color: #4054B2 !important;
}
.vck-melding-form .gfield .ginput_container_date .gform-calendar-icon {
color: inherit !important;
font-size: 18px !important;
width: 18px !important;
height: 18px !important;
line-height: 1 !important;
} .vck-melding-form .gfield .ginput_container_date img.ui-datepicker-trigger,
.vck-melding-form .gfield .ginput_container_date .ui-datepicker-trigger,
.vck-melding-form .gfield .ginput_container_date .gform-datepicker-icon,
.vck-melding-form .gfield .ginput_container_date .gform-datepicker__icon {
position: absolute !important;
right: 12px !important;
top: 50% !important;
transform: translateY(-50%) !important;
margin: 0 !important;
cursor: pointer !important;
z-index: 2 !important;
}
.vck-melding-form .gfield {
display: flex;
flex-direction: column;
}
.vck-melding-form .gfield .ginput_container {
margin-top: auto !important;
}
.vck-melding-form .gform_validation_container,
.vck-melding-form .gfield--type-honeypot {
display: none !important;
}
.vck-melding-form .gfield_instruction,
.vck-melding-form .gfield_description.instruction,
.vck-melding-form [id^=gfield_instruction_] {
display: none !important;
}
.vck-melding-form .vck-summary {
margin-top: 8px;
}
.vck-melding-form .vck-summary h3 {
margin: 32px 0 8px;
font-size: 18px;
color: #111827;
font-weight: 600;
}
.vck-melding-form #field_1_2 p,
.vck-melding-form #field_1_2 ul,
.vck-melding-form #field_1_2 li {
margin: 0;
}
.vck-melding-form #field_1_2 h3 {
margin: 16px 0 6px;
}
.vck-melding-form #field_1_2 h3:first-child {
margin-top: 0;
}
.vck-melding-form #field_1_2 h4 {
margin: 28px 0 6px;
}