[data-rs-form-error-summary] {
display: flex;
flex-direction: column;
gap: var(--form-error-summary-gap);
padding-inline: var(--form-error-summary-padding-x);
padding-block: var(--form-error-summary-padding-y);
background: var(--form-error-summary-bg);
border: var(--form-error-summary-border-width) solid var(--form-error-summary-border-color);
border-radius: var(--form-error-summary-radius);
}
[data-rs-form-error-summary-title] {
font-size: var(--form-error-summary-title-font-size);
font-weight: var(--form-error-summary-title-font-weight);
color: var(--form-error-summary-title-fg);
}
[data-rs-form-error-summary-list] {
display: flex;
flex-direction: column;
gap: var(--form-error-summary-list-gap);
}
[data-rs-form-error-summary-item] {
display: flex;
align-items: flex-start;
gap: var(--form-error-summary-item-gap);
font-size: var(--form-error-summary-item-font-size);
color: var(--form-error-summary-item-fg);
}
[data-rs-form-error-summary-item-icon] {
width: var(--form-error-summary-item-icon-size);
height: var(--form-error-summary-item-icon-size);
color: var(--form-error-summary-item-icon-color);
flex-shrink: 0;
}
[data-rs-form-error-summary-item-link] {
color: var(--form-error-summary-item-fg);
text-decoration: none;
}
[data-rs-form-error-summary-item-link][data-rs-state~="hover"] {
text-decoration: underline;
}
[data-rs-form-error-summary][data-rs-state~="error"] {
border-color: var(--form-error-summary-border-color);
background: var(--form-error-summary-bg);
}