:where(.error-wrapper) .error{color:var(--color-red-text);font-size:var(--font-size-xxs);align-items:center;gap:.25rem;padding-block-start:.25rem;display:none}:where(.error-wrapper) .iconify{flex-shrink:0}:where(.show-invalid) .form-field-wrapper:has(:invalid) .input,:where(.show-invalid) .form-field-wrapper:has(:invalid) .select,:where(.show-invalid) .form-field-wrapper:has(:invalid) .textarea{border-color:var(--color-red-graphic)}:where(.show-invalid) .form-field-wrapper:has(:invalid) .error-wrapper .error{display:flex}:where(.form-field-wrapper.show-invalid:has(:invalid)) .input,:where(.form-field-wrapper.show-invalid:has(:invalid)) .select,:where(.form-field-wrapper.show-invalid:has(:invalid)) .textarea{border-color:var(--color-red-graphic)}:where(.form-field-wrapper.show-invalid:has(:invalid)) .error-wrapper .error{display:flex}:is(:where(.show-invalid) .input-variant--krafters:has(:invalid) .input:not(:focus),:where(.show-invalid) .select-variant--krafters:has(:invalid) .select:not(:focus),:where(.show-invalid) .textarea-variant--krafters:has(:invalid) .textarea:not(:focus)){box-shadow:0 1.5px 0 0 var(--color-red)}