@dnb/eufemia/components/form-status/style/dnb-form-status.min.css

DNB Eufemia Design System UI Library

.dnb-form-status{--form-status-radius:0.25rem;display:flex;opacity:1}.dnb-form-status__shell{--form-status-color-text:var(--token-color-text-neutral);align-items:flex-start;background-color:var(--form-status-color-background);border-radius:var(--form-status-radius);color:var(--form-status-color-text);display:flex;justify-content:flex-start;min-width:inherit}.dnb-form-status__variant--outlined .dnb-form-status__shell{--border-color:var(--form-status-color-outline);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-form-status--error .dnb-form-status__shell{--form-status-color-background:var(
    --token-color-background-error-subtle
  );--form-status-color-icon:var(--token-color-icon-error)}.dnb-form-status--information .dnb-form-status__shell{--form-status-color-background:var(
    --token-color-background-info-subtle
  );--form-status-color-icon:var(--token-color-icon-info)}.dnb-form-status--marketing .dnb-form-status__shell{--form-status-color-background:var(
    --token-color-background-marketing-subtle
  );--form-status-color-icon:var(--token-color-icon-marketing)}.dnb-form-status--warning .dnb-form-status__shell{--form-status-color-background:var(
    --token-color-background-warning-subtle
  );--form-status-color-icon:var(--token-color-icon-warning)}.dnb-form-status__variant--outlined.dnb-form-status--error .dnb-form-status__shell{--form-status-color-outline:var(--token-color-stroke-error)}.dnb-form-status__variant--outlined.dnb-form-status--warning .dnb-form-status__shell{--form-status-color-outline:var(--token-color-stroke-warning)}.dnb-form-status__variant--outlined.dnb-form-status--information .dnb-form-status__shell{--form-status-color-outline:var(--token-color-stroke-info)}.dnb-form-status__variant--outlined.dnb-form-status--marketing .dnb-form-status__shell{--form-status-color-outline:var(--token-color-stroke-marketing)}.dnb-form-status__text{cursor:text;max-width:var(--prose-max-width);padding:.625rem 1rem}button .dnb-form-status__text{cursor:inherit}.dnb-form-status__text{color:inherit;font-size:var(--font-size-small);line-height:var(--line-height-small)}.dnb-form-status__text .dnb-anchor,.dnb-form-status__text .dnb-ul{font-size:inherit}.dnb-form-status__text .dnb-ul:not([class*=dnb-space__left]){padding-left:1rem}.dnb-spacing .dnb-form-status__text .dnb-ul:not([class*=dnb-space__bottom]) .dnb-li{margin-bottom:.5rem;margin-top:.5rem}.dnb-spacing .dnb-form-status__text .dnb-ul:not([class*=dnb-space__bottom]){margin-bottom:.5rem}.dnb-form-status__text{white-space:normal}.dnb-icon+.dnb-form-status__text{padding-left:.5rem}.dnb-form-status__shell>.dnb-icon{align-items:center;border:none;color:var(--form-status-color-icon);display:flex;justify-content:center;margin:.3333333em .3333333em .3333333em .6666666em}.dnb-form-status__size--large .dnb-form-status__text{padding-bottom:1.125rem;padding-top:1.125rem}.dnb-form-status__size--large .dnb-form-status__shell>.dnb-icon{margin-bottom:.6666666em;margin-top:.6666666em}.dnb-form-status--stretch{flex-grow:1}.dnb-form-status--stretch .dnb-form-status__shell{width:100%}.dnb-form-status[hidden]{display:none}.dnb-form-status--error.dnb-form-status--attention-focus .dnb-form-status__shell,.dnb-form-status--error.dnb-form-status--attention-focus .dnb-form-status__shell>.dnb-icon,.dnb-form-status--error.dnb-form-status:focus .dnb-form-status__shell,.dnb-form-status--error.dnb-form-status:focus .dnb-form-status__shell>.dnb-icon{animation:attention-focus 2s ease-in-out .2s 1}@keyframes attention-focus{0%,to{background-color:var(--token-color-background-error-subtle);border-color:var(--token-color-stroke-error);color:var(--token-color-text-destructive)}35%{background-color:var(--token-color-background-error);border-color:var(--token-color-stroke-error);color:var(--token-color-text-neutral-inverse)}}