[hidden] {
  display: none !important;
}

:host {
	--pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg, 0 0.5rem 1rem 0 rgba(3, 3, 3, 0.16), 0 0 0.375rem 0 rgba(3, 3, 3, 0.08));
	--pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100, #fff);
	--pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
	--pf-c-alert--GridTemplateAreas: "icon title close" ". description description" ". action action";
	--pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md, 2px);
	--pf-c-alert--BorderTopColor: var(--pf-global--default-color--200, #009596);
	--pf-c-alert--PaddingTop: var(--pf-global--spacer--md, 1rem);
	--pf-c-alert--PaddingRight: var(--pf-global--spacer--md, 1rem);
	--pf-c-alert--PaddingBottom: var(--pf-global--spacer--md, 1rem);
	--pf-c-alert--PaddingLeft: var(--pf-global--spacer--md, 1rem);
	--pf-c-alert__FontSize: var(--pf-global--FontSize--sm, 0.875rem);
	--pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element, 0.375rem) - 0.0625rem);
	--pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element, 0.375rem));
	--pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md, 1rem));
	--pf-c-alert__toggle-icon--Rotate: 0;
	--pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition, all 250ms cubic-bezier(0.42, 0, 0.58, 1));
	--pf-c-alert__icon--Color: var(--pf-global--default-color--200, #009596);
	--pf-c-alert__icon--MarginTop: 0.0625rem;
	--pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm, 0.5rem);
	--pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md, 1.125rem);
	--pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold, 700);
	--pf-c-alert__title--Color: var(--pf-global--default-color--300, #003737);
	--pf-c-alert__title--max-lines: 1;
	--pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element, 0.375rem) * -1);
	--pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element, 0.375rem) * -1);
	--pf-c-alert__action--TranslateY: 0.125rem;
	--pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm, 0.5rem) * -1);
	--pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs, 0.25rem);
	--pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs, 0.25rem);
	--pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
	--pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md, 1rem);
	--pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
	--pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg, 1.5rem);
	--pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100, #3e8635);
	--pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100, #3e8635);
	--pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200, #1e4f18);
	--pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100, #c9190b);
	--pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100, #c9190b);
	--pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200, #a30000);
	--pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100, #f0ab00);
	--pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100, #f0ab00);
	--pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200, #795600);
	--pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100, #2b9af3);
	--pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100, #2b9af3);
	--pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200, #002952);
	--pf-c-alert--m-inline--BoxShadow: none;
	--pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50, #f2f9f9);
	--pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50, #f3faf2);
	--pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50, #faeae8);
	--pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50, #fdf7e7);
	--pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50, #e7f1fa);
	--pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
	--pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
	--pf-c-alert--m-inline--m-plain--PaddingTop: 0;
	--pf-c-alert--m-inline--m-plain--PaddingRight: 0;
	--pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
	--pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
	--pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
	--pf-c-alert--m-expandable--GridTemplateAreas: "toggle icon title close" ". . description description" ". . action action";
	--pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
	--pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
	--pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
	color: var(--pf-global--Color--100, #151515);
	position: relative;
	display: grid;
	padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
	font-size: var(--pf-c-alert__FontSize);
	background-color: var(--pf-c-alert--BackgroundColor);
	border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
	box-shadow: var(--pf-c-alert--BoxShadow);
	grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
	grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
}

:host([variant="success"]) {
  --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
  --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
  --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
  --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
}

:host([variant="danger"]) {
  --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
  --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
  --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
  --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
}

:host([variant="warning"]) {
  --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
  --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
  --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
  --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
}

:host([variant="info"]) {
  --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
  --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
  --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
  --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
}

:host([inline]) {
  --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
  --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
}

:host([plain]) {
  --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
  --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
  --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
  --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
  --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
  --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
}

:host([expandable]) {
  --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
  --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
  --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
}

:host([expanded]) {
  --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
  --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
}

#toggle {
  margin-top: var(--pf-c-alert__toggle--MarginTop);
  margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
  margin-left: var(--pf-c-alert__toggle--MarginLeft);
}

#icon {
  grid-area: icon;
  display: flex;
  margin-top: var(--pf-c-alert__icon--MarginTop);
  margin-right: var(--pf-c-alert__icon--MarginRight);
  font-size: var(--pf-c-alert__icon--FontSize);
  --pf-icon--size: var(--pf-c-alert__icon--FontSize);
  color: var(--pf-c-alert__icon--Color);
  pf-icon,
  ::slotted(pf-icon) {
    translate: 0 0.125em;
  }
}

#title {
  grid-area: title;
  font-weight: var(--pf-c-alert__title--FontWeight);
  color: var(--pf-c-alert__title--Color);
  word-break: break-word;
  ::slotted(*) {
    color: inherit;
    font-weight: inherit;
  }
  :is(h1,h2,h3,h4,h5,h6),
  ::slotted(:is(h1,h2,h3,h4,h5,h6)) {
    margin-block: 0 !important;
  }
}

#close {
  grid-area: close;
}

#description {
  grid-area: description;
  padding-top: var(--pf-c-alert__description--PaddingTop);
  word-break: break-word;
}

#actions {
  grid-area: action;
  --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);

  & ::slotted(a) {
    text-decoration: none;
    color: #06c;
    margin-inline-end: 1rem;
  }

  & ::slotted(a:hover),
  & ::slotted(a:focus),
  & ::slotted(a:active) {
    color: #004080;
  }
}
