.form-state{align-items:flex-start;background-color:var(--color-accent);display:flex;gap:.8rem;padding:3.2rem;text-align:left;width:100%}.form-state--success{border-bottom:1px solid var(--color-success)}.form-state--success .form-state__icon{background-color:var(--color-success)}.form-state--error{border-bottom:1px solid var(--color-error)}.form-state--error .form-state__icon{background-color:var(--color-error)}.form-state--warning{border-bottom:1px solid var(--color-warning)}.form-state--warning .form-state__icon{background-color:var(--color-warning)}.form-state p{margin:0}.form-state__icon{align-items:center;display:flex;grid-area:icon;justify-content:center}.form-state__icon,.form-state__icon .icon{height:1.4rem;min-width:1.4rem;width:1.4rem}.form-state__icon .icon,.form-state__title{color:var(--color-text)}.form-state__title{display:flex;font-size:1.6rem;font-weight:400;gap:.8rem;grid-area:title;text-transform:uppercase}.form-state__title span{max-width:20rem;width:-moz-max-content;width:max-content}.form-state__message{color:var(--color-text-80);display:flex;flex-direction:column;font-size:1.4rem;gap:.8rem;grid-area:message;line-height:1.1}.form-state__message-wrapper{align-items:center;display:grid;gap:1.9rem .8rem;grid-template-areas:"icon title" "message message";grid-template-columns:max-content 1fr;grid-template-rows:1fr 1fr}