@layer components.form-row{.form-row__input-container.is-valid{--input-focus-color:var(--green)}.is-invalid>.form-row__label{color:var(--error-color)}.form-row__hint,.form-row__errors{font-size:var(--font-size-xs);margin-block-start:.5em}.form-row__hint:has(~.form-row__errors:not(:empty)){display:none}.form-row__errors{color:var(--error-color);list-style-type:disc;list-style-position:inside}.form-row__errors:has(li:only-child){list-style:none}.form-row__unit{justify-content:center;align-items:center;gap:1ch;display:flex}.form-row__unit-icon,.form-row__icon{inline-size:var(--input-status-icon-size);block-size:var(--input-status-icon-size)}.form-row__icon{pointer-events:none;grid-area:label-input-icon;position:absolute;inset-block-start:50%!important;inset-inline-end:calc(var(--input-icon-padding) / 2)!important;translate:50% -50%!important}.form-row__icon--valid{color:var(--green)}.form-row__icon--invalid{color:var(--error-color)}.form-row__input-container:not(.is-valid) .form-row__icon--valid,.form-row__input-container:not(.is-invalid) .form-row__icon--invalid{display:none!important}}
