@layer clickui {/* stylelint-disable custom-property-pattern -- design tokens use camelCase (e.g. iconBackground) */

.alert__7cYyI {
  display: flex;
  width: 100%;
  overflow: hidden;
  justify-content: start;
  border-radius: var(--click-alert-radii-end);
  background-color: var(--click-alert-color-background-neutral);
  color: var(--click-alert-color-text-neutral);
}

.alert_type_default__PnVyJ {
  justify-content: start;
  border-radius: var(--click-alert-radii-end);
}

.alert_type_banner__NjYrK {
  justify-content: center;
  border-radius: 0;
}

.alert_state_neutral__655E4 {
  background-color: var(--click-alert-color-background-neutral);
  color: var(--click-alert-color-text-neutral);
}

.alert_state_success__VUtee {
  background-color: var(--click-alert-color-background-success);
  color: var(--click-alert-color-text-success);
}

.alert_state_warning__kNUTL {
  background-color: var(--click-alert-color-background-warning);
  color: var(--click-alert-color-text-warning);
}

.alert_state_danger__DLuZk {
  background-color: var(--click-alert-color-background-danger);
  color: var(--click-alert-color-text-danger);
}

.alert_state_info__-2HHz {
  background-color: var(--click-alert-color-background-info);
  color: var(--click-alert-color-text-info);
}

.alert__icon-wrapper__q9T-7 {
  display: flex;
  align-items: center;
  background-color: var(--click-alert-color-iconBackground-neutral);
  color: var(--click-alert-color-iconForeground-neutral);
}

.alert__icon-wrapper_state_neutral__gIGl5 {
  background-color: var(--click-alert-color-iconBackground-neutral);
  color: var(--click-alert-color-iconForeground-neutral);
}

.alert__icon-wrapper_state_success__9C1yD {
  background-color: var(--click-alert-color-iconBackground-success);
  color: var(--click-alert-color-iconForeground-success);
}

.alert__icon-wrapper_state_warning__oJByv {
  background-color: var(--click-alert-color-iconBackground-warning);
  color: var(--click-alert-color-iconForeground-warning);
}

.alert__icon-wrapper_state_danger__afPBa {
  background-color: var(--click-alert-color-iconBackground-danger);
  color: var(--click-alert-color-iconForeground-danger);
}

.alert__icon-wrapper_state_info__YI3qz {
  background-color: var(--click-alert-color-iconBackground-info);
  color: var(--click-alert-color-iconForeground-info);
}

.alert__icon-wrapper_size_small__E4NZL {
  padding: var(--click-alert-small-space-y) 0 var(--click-alert-small-space-y)
    var(--click-alert-small-space-x);
}

.alert__icon-wrapper_size_medium__3bDZN {
  padding: var(--click-alert-medium-space-y) 0 var(--click-alert-medium-space-y)
    var(--click-alert-medium-space-x);
}

/* The styled-components original emitted `background-color: none` for banners,
   which is an invalid value the browser drops, leaving the icon wrapper
   transparent. `transparent` reproduces that rendering exactly. */
.alert__icon-wrapper_type_banner__4Zl-g {
  background-color: transparent;
}

/* stylelint-disable-next-line block-no-empty -- base element required by BEM */
.alert__icon__2dyva {
}

.alert__spacer__kSuvG {
  margin-left: auto;
}

.alert__icon_size_small__BGX9V {
  width: var(--click-alert-small-icon-width);
  height: var(--click-alert-small-icon-height);
}

.alert__icon_size_medium__-9nLT {
  width: var(--click-alert-medium-icon-width);
  height: var(--click-alert-medium-icon-height);
}

.alert__text-wrapper__-KJUV {
  display: flex;
  /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated -- preserves the styled-components original verbatim for byte-for-byte parity */
  word-break: break-word;
  flex-flow: column;
}

.alert__text-wrapper_size_small__Ahm-8 {
  padding: var(--click-alert-small-space-y) var(--click-alert-small-space-x);
  gap: var(--click-alert-small-space-gap);
}

.alert__text-wrapper_size_medium__FIX1N {
  padding: var(--click-alert-medium-space-y) var(--click-alert-medium-space-x);
  gap: var(--click-alert-medium-space-gap);
}

.alert__text-wrapper__-KJUV a,
.alert__text-wrapper__-KJUV a:focus,
.alert__text-wrapper__-KJUV a:visited,
.alert__text-wrapper__-KJUV a:hover {
  color: inherit;
  font: inherit;
  text-decoration: underline;
}

.alert__title__R9v8v {
  margin: 0;
}

.alert__title_size_small__UngXF {
  font: var(--click-alert-small-typography-title-default);
}

.alert__title_size_medium__Uqu2N {
  font: var(--click-alert-medium-typography-title-default);
}

.alert__text__-MlWp {
  margin: 0;
}

.alert__text_size_small__7fH-5 {
  font: var(--click-alert-small-typography-text-default);
}

.alert__text_size_medium__-2r2Z {
  font: var(--click-alert-medium-typography-text-default);
}

.alert__dismiss__btduW {
  display: flex;
  margin-left: auto;
  align-items: center;
  border: none;
  background-color: transparent;
  color: inherit;
  cursor: pointer;
}
}