/* Apply animation when the class is removed */
form, form input, form button {
  transition: opacity 1s ease, pointer-events 1s;
}
.disabledDuringPost {
  opacity: 0.55;
  pointer-events: none;
}

/*als je geen zin hebt in deze css kan je de volgende class toewijzen aan je grid/editform*/
.noAfterIcon td:has(>input):after /*lock icoontje weg*/
,.noAfterIcon td:has(>select):after {
  display: none!important;
}
.noAfterIcon td.zXFormLabel:after { /*sterretje weg*/
  display: none!important;
}
/**/

/*zEditForm begin*/
td:has(input:invalid) .item-input-error-message {
  display: unset;
}

/*fixes default styling, liever weggooien.*/
/*mandatory icoontje start*/
td.zXFormLabel:has(+td>input[required]),
td.zXFormLabel:has(+td>input.zxFormInputMandatoryNumeric),
td.zXFormLabel:has(+td>input.zxFormInputMandatoryMixed),
td.zXFormLabel:has(+td>select[required]),
td.zXFormLabel:has(+td>select.zxFormInputMandatoryNumeric),
td.zXFormLabel:has(+td>select.zxFormInputOptionalNumeric),
td.zXFormLabel:has(+td>textarea[required]),                      
td.zXFormLabel:has(+td>textarea.zxFormInputMandatoryMixed),
td.zXFormLabel:has(+td>textarea.zxFormInputOptionalMixed),
td.zXFormLabel:has(+td>span.zxFormInputLockedMixed),
td.zXFormLabel:has(+td>span.zxFormInputLockedUpper),
td.zXFormLabel:has(+td>span.zxFormInputLockedCapital)
{
  display: inline;
}

td.zXFormLabel:has(+td>input[required]):after,
td.zXFormLabel:has(+td>input.zxFormInputMandatoryNumeric):after,
td.zXFormLabel:has(+td>input.zxFormInputMandatoryMixed):after,
td.zXFormLabel:has(+td>select[required]):after,
td.zXFormLabel:has(+td>select.zxFormInputMandatoryNumeric):after,
td.zXFormLabel:has(+td>textarea[required]):after,
td.zXFormLabel:has(+td>textarea.zxFormInputMandatoryMixed):after,
td.zXFormLabel:has(+td>span.zxFormInputLockedMixed):after,
td.zXFormLabel:has(+td>span.zxFormInputLockedUpper):after,
td.zXFormLabel:has(+td>span.zxFormInputLockedCapital):after
{
  content: " *";
}
/*mandatory icoontje end*/

/*lock icoontje start*/
span.zxFormInputLockedMixed
,span.zxFormInputLockedUpper
,span.zxFormInputLockedCapital {
  opacity: .7;
}

input[disabled="true"] /*locked vanuit enhancer -> disabled*/
,select[disabled="true"] {
  display: inline;
}

td:has(>input[disabled="true"]):not(:has(.zxfklookup)):after /*:not excludes fklookup*/
,td:has(>select[disabled="true"]):after
,td:has(>input[type="hidden"]):not(:has(.zxfklookup)):after {
  font: var(--fa-font-solid);/*duotone werkt anders, er worden dan 2 iconen gebruikt om over elkaar heen te plaatsen.*/
  content: '\f023';
  opacity: .55;
}
/*lock icoontje end*/

/*calendar icoontje start*/
/*input[onchange*="this.value = zXOnChange(this.value, 4);"] {
  display: inline;
}
td:has(>input[onchange*="this.value = zXOnChange(this.value, 4);"]):after {
  font: var(--fa-font-solid);
  content: '\f133';
  opacity: .55;
}*/
/*calendar icoontje end*/

/*calendar clock icoontje start*/
/*input[onchange*="this.value = zXOnChange(this.value, 7);"] {
  display: inline;
}
td:has(>input[onchange*="this.value = zXOnChange(this.value, 7);"]):after {
  font: var(--fa-font-solid);
  content: '\e0d2';
  opacity: .55;
}*/
/*calendar clock icoontje end*/

/*clock icoontje start*/
/*input[onchange*="this.value = zXOnChange(this.value, 6);"] {
  display: inline;
}
td:has(>input[onchange*="this.value = zXOnChange(this.value, 6);"]):after {
  font: var(--fa-font-solid);
  content: '\f017';
  opacity: .55;
}*/
/*clock icoontje end*/

/*zEditForm end*/