/* Variants */
/* Define maps for feedback-related variables */
nv-alert {
  display: flex !important;
  align-items: flex-start;
  position: relative;
  gap: var(--alert-gap-x);
  border-radius: var(--alert-radius);
  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;
}
nv-alert > nv-icon {
  margin-left: var(--alert-icon-position-x);
  margin-top: var(--alert-icon-position-y);
}
nv-alert.hidden {
  display: none !important;
}
nv-alert.feedback-information {
  background-color: var(--components-alert-information-background);
  border: 1px solid var(--components-alert-information-border) !important;
}
nv-alert.feedback-information > .close:focus, nv-alert.feedback-information > .close:focus-within {
  outline: none;
}
nv-alert.feedback-information > .close:focus-visible, nv-alert.feedback-information > .close:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-information-border);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-alert.feedback-warning {
  background-color: var(--components-alert-warning-background);
  border: 1px solid var(--components-alert-warning-border) !important;
}
nv-alert.feedback-warning > .close:focus, nv-alert.feedback-warning > .close:focus-within {
  outline: none;
}
nv-alert.feedback-warning > .close:focus-visible, nv-alert.feedback-warning > .close:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-warning-border);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-alert.feedback-error {
  background-color: var(--components-alert-error-background);
  border: 1px solid var(--components-alert-error-border) !important;
}
nv-alert.feedback-error > .close:focus, nv-alert.feedback-error > .close:focus-within {
  outline: none;
}
nv-alert.feedback-error > .close:focus-visible, nv-alert.feedback-error > .close:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-error-border);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-alert.feedback-success {
  background-color: var(--components-alert-success-background);
  border: 1px solid var(--components-alert-success-border) !important;
}
nv-alert.feedback-success > .close:focus, nv-alert.feedback-success > .close:focus-within {
  outline: none;
}
nv-alert.feedback-success > .close:focus-visible, nv-alert.feedback-success > .close:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-success-border);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-alert.feedback-neutral {
  background-color: var(--components-alert-neutral-background);
  border: 1px solid var(--components-alert-neutral-border) !important;
}
nv-alert.feedback-neutral > .close:focus, nv-alert.feedback-neutral > .close:focus-within {
  outline: none;
}
nv-alert.feedback-neutral > .close:focus-visible, nv-alert.feedback-neutral > .close:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-neutral-border);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-alert > nv-icon.icon-information {
  color: var(--components-alert-information-icon);
}
nv-alert > nv-icon.icon-warning {
  color: var(--components-alert-warning-icon);
}
nv-alert > nv-icon.icon-error {
  color: var(--components-alert-error-icon);
}
nv-alert > nv-icon.icon-success {
  color: var(--components-alert-success-icon);
}
nv-alert > nv-icon.icon-neutral {
  color: var(--components-alert-neutral-icon);
}
nv-alert > .content {
  display: flex;
  padding: var(--alert-padding);
  padding-right: calc(var(--alert-padding) + var(--spacing-5) + var(--spacing-1));
  padding-left: 0;
  flex-direction: column;
  gap: var(--alert-gap-y);
}
nv-alert > .content > .heading {
  color: var(--components-alert-content-title);
  font-size: var(--alert-heading-font-size);
  line-height: var(--alert-heading-line-height);
  font-weight: var(--alert-heading-font-weight);
}
nv-alert > .content > .message {
  color: var(--components-alert-content-description);
  font-size: var(--alert-message-font-size);
  line-height: var(--alert-message-line-height);
}
nv-alert > .close {
  border-radius: var(--alert-radius);
  position: absolute;
  display: flex;
  top: var(--alert-icon-position-y);
  right: var(--alert-icon-position-x);
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}