@patternfly/react-core

@charset "UTF-8"; .pf-v6-c-popover[data-popper-reference-hidden=true] { visibility: hidden; pointer-events: none; } .pf-v6-c-action-list { --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical); --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default); --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default); --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain); } .pf-v6-c-action-list, .pf-v6-c-action-list__group { display: flex; align-items: start; } .pf-v6-c-action-list { row-gap: var(--pf-v6-c-action-list--RowGap); column-gap: var(--pf-v6-c-action-list--ColumnGap); } .pf-v6-c-action-list.pf-m-icons { --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap); column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap); } .pf-v6-c-action-list__group { row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap)); column-gap: var(--pf-v6-c-action-list__group--ColumnGap); } .pf-v6-c-action-list__group.pf-m-icons { column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap); } .pf-v6-c-accordion { --pf-v6-c-accordion--BackgroundColor: var(--pf-t--global--background--color--primary--default); --pf-v6-c-accordion--RowGap: var(--pf-t--global--spacer--xs); --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200); --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked); --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default); --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md); --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md); --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default); --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover); --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small); --pf-v6-c-accordion__toggle--ZIndex: var(--pf-t--global--z-index--xs); --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default); --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default); --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold); --pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading--default); --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default); --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default); --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction); --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg; --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md); --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md); --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md); --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default); --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small); --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default); --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem; --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short); --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade); --pf-v6-c-accordion__item--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default); --pf-v6-c-accordion__item--before--Opacity: 0; --pf-v6-c-accordion__item--m-expanded--before--Opacity: 1; --pf-v6-c-accordion__item--m-expanded--before--TranslateY: 0; --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: 0s; --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short); --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: 0s; --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide); --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade); --pf-v6-c-accordion__expandable-content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default); --pf-v6-c-accordion__expandable-content--Opacity: 0; --pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity: 1; --pf-v6-c-accordion__expandable-content--TranslateY: 0; --pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY: 0; --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__expandable-content-body--PaddingInlineStart: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart: 0; --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart: var(--pf-t--global--spacer--md); --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md); --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md); --pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md); --pf-v6-c-accordion--m-display-lg__toggle--FontFamily: var(--pf-t--global--font--family--heading); --pf-v6-c-accordion--m-display-lg__toggle--FontSize: var(--pf-t--global--font--size--heading--sm); --pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading--default); --pf-v6-c-accordion--m-display-lg__expandable-content--FontSize: var(--pf-t--global--font--size--body--lg); --pf-v6-c-accordion--m-display-lg__expandable-content--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-accordion--m-bordered--RowGap: 0; --pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default); --pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor: var(--pf-t--global--border--color--default); } @media screen and (prefers-reduced-motion: no-preference) { .pf-v6-c-accordion { --pf-v6-c-accordion__item--before--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-accordion__item--before--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short); --pf-v6-c-accordion__item--before--TranslateY: -.5rem; --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short); --pf-v6-c-accordion__expandable-content--TranslateY: -.5rem; } } .pf-v6-c-accordion { display: flex; flex-direction: column; row-gap: var(--pf-v6-c-accordion--RowGap); background-color: var(--pf-v6-c-accordion--BackgroundColor); } .pf-v6-c-accordion.pf-m-toggle-start { --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap); } .pf-v6-c-accordion.pf-m-display-lg { --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart); --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd); --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd); --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd); --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart); --pf-v6-c-accordion__toggle--FontFamily: var(--pf-v6-c-accordion--m-display-lg__toggle--FontFamily); --pf-v6-c-accordion__toggle--FontSize: var(--pf-v6-c-accordion--m-display-lg__toggle--FontSize); --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight); --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight); --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-v6-c-accordion--m-display-lg__expandable-content--FontSize); --pf-v6-c-accordion__expandable-content--Color: var(--pf-v6-c-accordion--m-display-lg__expandable-content--Color); } .pf-v6-c-accordion.pf-m-bordered { --pf-v6-c-accordion--RowGap: var(--pf-v6-c-accordion--m-bordered--RowGap); --pf-v6-c-accordion__item--BorderRadius: 0; --pf-v6-c-accordion__toggle--BorderRadius: 0; } .pf-v6-c-accordion.pf-m-bordered .pf-v6-c-accordion__item { border-block-end: var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth) solid var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor); } .pf-v6-c-accordion__item { position: relative; } .pf-v6-c-accordion__item::before { position: absolute; inset: 0; pointer-events: none; content: ""; background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor); border-radius: var(--pf-v6-c-accordion__item--BorderRadius); opacity: var(--pf-v6-c-accordion__item--before--Opacity); transition-timing-function: var(--pf-v6-c-accordion__item--before--TransitionTimingFunction); transition-duration: var(--pf-v6-c-accordion__item--before--TransitionDuration--fade); transition-property: opacity; } .pf-v6-c-accordion__item.pf-m-expanded { --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd); --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight); --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide); --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade); --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity); --pf-v6-c-accordion__item--before--TranslateY: var(--pf-v6-c-accordion__item--m-expanded--before--TranslateY); --pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide); --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade); --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity); --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY); } .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon { transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate)); } .pf-v6-c-accordion__toggle { position: relative; z-index: var(--pf-v6-c-accordion__toggle--ZIndex); display: flex; column-gap: var(--pf-v6-c-accordion__toggle--ColumnGap); align-items: center; width: 100%; padding-block-start: var(--pf-v6-c-accordion__toggle--PaddingBlockStart); padding-block-end: var(--pf-v6-c-accordion__toggle--PaddingBlockEnd); padding-inline-start: var(--pf-v6-c-accordion__toggle--PaddingInlineStart); padding-inline-end: var(--pf-v6-c-accordion__toggle--PaddingInlineEnd); font-family: var(--pf-v6-c-accordion__toggle--FontFamily, inherit); font-size: var(--pf-v6-c-accordion__toggle--FontSize, inherit); text-align: start; background-color: var(--pf-v6-c-accordion__toggle--BackgroundColor); border: 0; border-radius: var(--pf-v6-c-accordion__toggle--BorderRadius); } .pf-v6-c-accordion__toggle:is(:hover, :focus) { --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-v6-c-accordion__toggle--hover--BackgroundColor); } .pf-v6-c-accordion__toggle-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1; font-weight: var(--pf-v6-c-accordion__toggle-text--FontWeight); color: var(--pf-v6-c-accordion__toggle-text--Color); } .pf-v6-c-accordion__toggle-icon { transition: var(--pf-v6-c-accordion__toggle-icon--Transition); } :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon { scale: -1 1; } .pf-v6-c-accordion__expandable-content:where([hidden]) { display: revert; } .pf-v6-c-accordion__expandable-content { max-height: 0; margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart); margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd); font-size: var(--pf-v6-c-accordion__expandable-content--FontSize); color: var(--pf-v6-c-accordion__expandable-content--Color); visibility: hidden; background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor); border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius); opacity: var(--pf-v6-c-accordion__expandable-content--Opacity); transition-delay: 0s, 0s, var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade); transition-timing-function: var(--pf-v6-c-accordion__expandable-content--TransitionTimingFunction); transition-duration: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--slide), 0s, 0s, 0s; transition-property: opacity, translate, visibility, max-height, margin-block-end; translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY); } .pf-v6-c-accordion__expandable-content.pf-m-fixed { overflow-y: auto; } .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content { max-height: 99999px; margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd); visibility: revert; transition-delay: 0s; } .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content.pf-m-fixed { max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight); } .pf-v6-c-accordion__expandable-content-body { padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart); padding-block-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd); padding-inline-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineStart); padding-inline-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd); } .pf-v6-c-accordion__expandable-content-body + .pf-v6-c-accordion__expandable-content-body { --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart); } .pf-v6-c-alert-group { --pf-v6-c-alert-group__item--MarginBlockStart: var(--pf-t--global--spacer--gap--group--vertical); --pf-v6-c-alert-group--m-toast--InsetBlockStart: var(--pf-t--global--spacer--2xl); --pf-v6-c-alert-group--m-toast--InsetInlineEnd: var(--pf-t--global--spacer--xl); --pf-v6-c-alert-group--m-toast--MaxWidth: 37.5rem; --pf-v6-c-alert-group--m-toast--ZIndex: var(--pf-t--global--z-index--2xl); --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--Transition--opacity--default: var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default) 0s; --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--TransitionDelay--opacity: var(--pf-t--global--motion--delay--none); --pf-v6-c-alert-group--m-toast__item--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default); --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--TransitionDelay--transform: var(--pf-t--global--motion--delay--none); --pf-v6-c-alert-group--m-toast__item--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--default); --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--slide-in--default); --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default); --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate); --pf-v6-c-alert-group--m-toast__item--c-alert--Transition: all var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration) var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction) 0s; --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default); --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: initial; --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short); --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: initial; --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short); --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate); --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition: all var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration) var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction) var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration); --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial; --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial; --pf-v6-c-alert-group__overflow-button--BorderWidth: 0; --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium); --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md); --pf-v6-c-alert-group__overflow-button--PaddingInlineEnd: var(--pf-t--global--spacer--md); --pf-v6-c-alert-group__overflow-button--PaddingBlockEnd: var(--pf-t--global--spacer--md); --pf-v6-c-alert-group__overflow-button--PaddingInlineStart: var(--pf-t--global--spacer--md); --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default); --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg); --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default); --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover); --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover); --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom); --pf-v6-c-alert-group__overflow-button--focus--Color: var(--pf-t--global--text--color--link--hover); --pf-v6-c-alert-group__overflow-button--focus--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom); --pf-v6-c-alert-group__overflow-button--active--Color: var(--pf-t--global--text--color--link--hover); --pf-v6-c-alert-group__overflow-button--active--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom); } .pf-v6-c-alert-group > * + * { margin-block-start: var(--pf-v6-c-alert-group__item--MarginBlockStart); } .pf-v6-c-alert-group.pf-m-toast { position: fixed; inset-block-start: var(--pf-v6-c-alert-group--m-toast--InsetBlockStart); inset-inline-end: var(--pf-v6-c-alert-group--m-toast--InsetInlineEnd); z-index: var(--pf-v6-c-alert-group--m-toast--ZIndex); width: calc(100% - var(--pf-v6-c-alert-group--m-toast--InsetInlineEnd) * 2); max-width: var(--pf-v6-c-alert-group--m-toast--MaxWidth); } .pf-v6-c-alert-group__overflow-button { position: relative; width: 100%; padding-block-start: var(--pf-v6-c-alert-group__overflow-button--PaddingBlockStart); padding-block-end: var(--pf-v6-c-alert-group__overflow-button--PaddingBlockEnd); padding-inline-start: var(--pf-v6-c-alert-group__overflow-button--PaddingInlineStart); padding-inline-end: var(--pf-v6-c-alert-group__overflow-button--PaddingInlineEnd); color: var(--pf-v6-c-alert-group__overflow-button--Color); background-color: var(--pf-v6-c-alert-group__overflow-button--BackgroundColor); border-width: var(--pf-v6-c-alert-group__overflow-button--BorderWidth); border-radius: var(--pf-v6-c-alert-group__overflow-button--BorderRadius); box-shadow: var(--pf-v6-c-alert-group__overflow-button--BoxShadow); } .pf-v6-c-alert-group__item { display: grid; grid-template-rows: 1fr; opacity: 1; transition: opacity var(--pf-v6-c-alert-group--m-toast__item--Transition--opacity--default); transform: translateX(0) translateY(0); } @media screen and (prefers-reduced-motion: no-preference) { .pf-v6-c-alert-group__item { transition: opacity var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity) var(--pf-v6-c-alert-group--m-toast__item--TransitionDelay--opacity), transform var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--transform) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--transform) var(--pf-v6-c-alert-group--m-toast__item--TransitionDelay--transform), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--grid-template-rows), margin-block var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--margin-block) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--margin-block); } .pf-v6-c-alert-group__item .pf-v6-c-alert { transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition); } } .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child, .pf-v6-c-alert-group__item.pf-m-incoming:first-child { grid-template-rows: 0fr; margin-block: 0; overflow: hidden; opacity: 0; transform: translateY(-100%); } .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-incoming:first-child .pf-v6-c-alert { min-height: 0; padding-block-start: 0; padding-block-end: 0; border-width: 0; } .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing { grid-template-rows: 0fr; margin-block: 0; overflow: hidden; opacity: 0; transition: grid-template-rows 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default)), margin-block 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default)), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default)); } .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert { min-height: 0; padding-block-start: 0; padding-block-end: 0; border-width: 0; transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default)); } @media screen and (prefers-reduced-motion: no-preference) { .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing { transition: transform var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform)), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity)), margin-block var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block)), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows)); transform: translateX(100%); } :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing { transform: translateX(calc(100% * var(--pf-v6-global--inverse--multiplier))); } .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert { transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition)); } } .pf-v6-c-alert-group__item:hover { --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color); --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor); --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--hover--BoxShadow); } .pf-v6-c-alert-group__item:focus { --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--focus--Color); --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--focus--BoxShadow); } .pf-v6-c-alert-group__item:active { --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--active--Color); --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow); } .pf-v6-c-alert { --pf-v6-c-alert--BoxShadow: var(--pf-t--global--box-shadow--lg); --pf-v6-c-alert--BackgroundColor: var(--pf-t--global--background--color--floating--default); --pf-v6-c-alert--GridTemplateColumns: max-content 1fr max-content; --pf-v6-c-alert--GridTemplateAreas: "icon title action" ". description description" ". actiongroup actiongroup"; --pf-v6-c-alert--BorderWidth: var(--pf-t--global--border--width--box--status--default); --pf-v6-c-alert--BorderColor: transparent; --pf-v6-c-alert--BorderRadius: var(--pf-t--global--border--radius--medium); --pf-v6-c-alert--PaddingBlockStart: var(--pf-t--global--spacer--md); --pf-v6-c-alert--PaddingInlineEnd: var(--pf-t--global--spacer--md); --pf-v6-c-alert--PaddingBlockEnd: var(--pf-t--global--spacer--md); --pf-v6-c-alert--PaddingInlineStart: var(--pf-t--global--spacer--md); --pf-v6-c-alert--FontSize: var(--pf-t--global--font--size--body--default); --pf-v6-c-alert__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default)); --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default)); --pf-v6-c-alert__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default)); --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-alert__toggle-icon--Rotate: 0; --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default); --pf-v6-c-alert__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long); --pf-v6-c-alert__icon--Color: var(--pf-t--global--icon--color--regular); --pf-v6-c-alert__icon--MarginBlockStart: 0.25rem; --pf-v6-c-alert__icon--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default); --pf-v6-c-alert__icon--FontSize: var(--pf-t--global--icon--size--md); --pf-v6-c-alert__title--FontWeight: var(--pf-t--global--font--weight--body--bold); --pf-v6-c-alert__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert__title--max-lines: 1; --pf-v6-c-alert__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1); --pf-v6-c-alert__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1); --pf-v6-c-alert__action--TranslateY: 0.125rem; --pf-v6-c-alert__action--MarginInlineEnd: calc(var(--pf-t--global--spacer--sm) * -1); --pf-v6-c-alert__description--PaddingBlockStart: var(--pf-t--global--spacer--xs); --pf-v6-c-alert__action-group--PaddingBlockStart-base: var(--pf-t--global--spacer--sm); --pf-v6-c-alert__action-group--PaddingBlockStart: var(--pf-v6-c-alert__action-group--PaddingBlockStart-base); --pf-v6-c-alert__description--action-group--PaddingBlockStart-base: var(--pf-t--global--spacer--sm); --pf-v6-c-alert__description--action-group--PaddingBlockStart: var(--pf-v6-c-alert__description--action-group--PaddingBlockStart-base); --pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default); --pf-v6-c-alert--m-custom--BorderColor: var(--pf-t--global--border--color--status--custom--default); --pf-v6-c-alert--m-custom__icon--Color: var(--pf-t--global--icon--color--status--custom--default); --pf-v6-c-alert--m-custom__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default); --pf-v6-c-alert--m-success__icon--Color: var(--pf-t--global--icon--color--status--success--default); --pf-v6-c-alert--m-success__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default); --pf-v6-c-alert--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default); --pf-v6-c-alert--m-danger__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default); --pf-v6-c-alert--m-warning__icon--Color: var(--pf-t--global--icon--color--status--warning--default); --pf-v6-c-alert--m-warning__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert--m-info--BorderColor: var(--pf-t--global--border--color--status--info--default); --pf-v6-c-alert--m-info__icon--Color: var(--pf-t--global--icon--color--status--info--default); --pf-v6-c-alert--m-info__title--Color: var(--pf-t--global--text--color--regular); --pf-v6-c-alert--m-inline--BackgroundColor: var(--pf-t--global--background--color--primary--default); --pf-v6-c-alert--m-inline--BoxShadow: none; --pf-v6-c-alert--m-inline--m-plain--BorderWidth: 0; --pf-v6-c-alert--m-inline--m-plain--BackgroundColor: transparent; --pf-v6-c-alert--m-inline--m-plain--PaddingBlockStart: 0; --pf-v6-c-alert--m-inline--m-plain--PaddingInlineEnd: 0; --pf-v6-c-alert--m-inline--m-plain--PaddingBlockEnd: 0; --pf-v6-c-alert--m-inline--m-plain--PaddingInlineStart: 0; --pf-v6-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content; --pf-v6-c-alert--m-expandable--GridTemplateAreas: "toggle icon title action" ". . description description" ". . actiongroup actiongroup"; --pf-v6-c-alert--m-expandable__description--action-group--PaddingBlockStart: var(--pf-v6-c-alert__action-group--PaddingBlockStart-base); --pf-v6-c-alert--m-expanded__toggle-icon--Rotate: 90deg; --pf-v6-c-alert--m-expanded__description--action-group--PaddingBlockStart: var(--pf-v6-c-alert__description--action-group--PaddingBlockStart-base); } .pf-v6-c-alert { position: relative; display: grid; grid-template-areas: var(--pf-v6-c-alert--GridTemplateAreas); grid-template-columns: var(--pf-v6-c-alert--GridTemplateColumns); padding-block-start: var(--pf-v6-c-alert--PaddingBlockStart); padding-block-end: var(--pf-v6-c-alert--PaddingBlockEnd); padding-inline-start: var(--pf-v6-c-alert--PaddingInlineStart); padding-inline-end: var(--pf-v6-c-alert--PaddingInlineEnd); font-size: var(--pf-v6-c-alert--FontSize); background-color: var(--pf-v6-c-alert--BackgroundColor); border: var(--pf-v6-c-alert--BorderWidth) solid var(--pf-v6-c-alert--BorderColor); border-radius: var(--pf-v6-c-alert--BorderRadius); box-shadow: var(--pf-v6-c-alert--BoxShadow); } .pf-v6-c-alert.pf-m-custom { --pf-v6-c-alert--BorderColor: var(--pf-v6-c-alert--m-custom--BorderColor); --pf-v6-c-alert__icon--Color: var(--pf-v6-c-alert--m-custom__icon--Color); --pf-v6-c-alert__title--Color: var(--pf-v6-c-alert--m-custom__title--Color); } .pf-v6-c-alert.pf-m-success { --pf-v6-c-alert--BorderColor: var(--pf-v6-c-alert--m-success--BorderColor); --pf-v6-c-alert__icon--Color: var(--pf-v6-c-alert--m-success__icon--Color); --pf-v6-c-alert__title--Color: var(--pf-v6-c-alert--m-success__title--Color); } .pf-v6-c-alert.pf-m-danger { --pf-v6-c-alert--BorderColor: var(--pf-v6-c-alert--m-danger--BorderColor); --pf-v6-c-alert__icon--Color: var(--pf-v6-c-alert--m-danger__icon--Color); --pf-v6-c-alert__title--Color: var(--pf-v6-c-alert--m-danger__title--Color); } .pf-v6-c-alert.pf-m-warning { --pf-v6-c-alert--BorderColor: var(--pf-v6-c-alert--m-warning--BorderColor); --pf-v6-c-alert__icon--Color: var(--pf-v6-c-alert--m-warning__icon--Color); --pf-v6-c-alert__title--Color: var(--pf-v6-c-alert--m-warning__title--Color); } .pf-v6-c-alert.pf-m-info { --pf-v6-c-alert--BorderColor: var(--pf-v6-c-alert--m-info--BorderColor); --pf-v6-c-alert__icon--Color: var(--pf-v6-c-alert--m-info__icon--Color); --pf-v6-c-alert__title--Color: var(--pf-v6-c-alert--m-info__title--Color); } .pf-v6-c-alert.pf-m-inline { --pf-v6-c-alert--BoxShadow: var(--pf-v6-c-alert--m-inline--BoxShadow); --pf-v6-c-alert--BackgroundColor: var(--pf-v6-c-alert--m-inline--BackgroundColor); } .pf-v6-c-alert.pf-m-plain { --pf-v6-c-alert--BorderWidth: var(--pf-v6-c-alert--m-inline--m-plain--BorderWidth); --pf-v6-c-alert--BackgroundColor: var(--pf-v6-c-alert--m-inline--m-plain--BackgroundColor); --pf-v6-c-alert--PaddingBlockStart: var(--pf-v6-c-alert--m-inline--m-plain--PaddingBlockStart); --pf-v6-c-alert--PaddingInlineEnd: var(--pf-v6-c-alert--m-inline--m-plain--PaddingInlineEnd); --pf-v6-c-alert--PaddingBlockEnd: var(--pf-v6-c-alert--m-inline--m-plain--PaddingBlockEnd); --pf-v6-c-alert--PaddingInlineStart: var(--pf-v6-c-alert--m-inline--m-plain--PaddingInlineStart); } .pf-v6-c-alert.pf-m-expandable { --pf-v6-c-alert--GridTemplateColumns: var(--pf-v6-c-alert--m-expandable--GridTemplateColumns); --pf-v6-c-alert--GridTemplateAreas: var(--pf-v6-c-alert--m-expandable--GridTemplateAreas); --pf-v6-c-alert__description--action-group--PaddingBlockStart: var(--pf-v6-c-alert--m-expandable__description--action-group--PaddingBlockStart); } .pf-v6-c-alert.pf-m-expanded { --pf-v6-c-alert__toggle-icon--Rotate: var(--pf-v6-c-alert--m-expanded__toggle-icon--Rotate); --pf-v6-c-alert__description--action-group--PaddingBlockStart: var(--pf-v6-c-alert--m-expanded__description--action-group--PaddingBlockStart); } .pf-v6-c-alert__toggle { margin-block-start: var(--pf-v6-c-alert__toggle--MarginBlockStart); margin-block-end: var(--pf-v6-c-alert__toggle--MarginBlockEnd); margin-inline-start: var(--pf-v6-c-alert__toggle--MarginInlineStart); margin-inline-end: var(--pf-v6-c-alert__toggle--MarginInlineEnd); } .pf-v6-c-alert__toggle-icon { display: inline-block; transition: transform var(--pf-v6-c-alert__toggle-icon--TransitionDuration) var(--pf-v6-c-alert__toggle-icon--TransitionTimingFunction); transform: rotate(var(--pf-v6-c-alert__toggle-icon--Rotate)); } :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert__toggle-icon { scale: -1 1; } .pf-v6-c-alert__icon { grid-area: icon; margin-inline-end: var(--pf-v6-c-alert__icon--MarginInlineEnd); font-size: var(--pf-v6-c-alert__icon--FontSize); color: var(--pf-v6-c-alert__icon--Color); } .pf-v6-c-alert__title { grid-area: title; font-weight: var(--pf-v6-c-alert__title--FontWeight); color: var(--pf-v6-c-alert__title--Color); word-break: break-word; } .pf-v6-c-alert__title.pf-m-truncate { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--pf-v6-c-alert__title--max-lines); overflow: hidden; } .pf-v6-c-alert__description { grid-area: description; padding-block-start: var(--pf-v6-c-alert__description--PaddingBlockStart); word-break: break-word; } .pf-v6-c-alert__description + .pf-v6-c-alert__action-group { --pf-v6-c-alert__action-group--PaddingBlockStart: var(--pf-v6-c-alert__description--action-group--PaddingBlockStart); } .pf-v6-c-alert__action { grid-area: action; margin-block-start: var(--pf-v6-c-alert__action--MarginBlockStart); margin-block-end: var(--pf-v6-c-alert__action--MarginBlockEnd); margin-inline-end: var(--pf-v6-c-alert__action--MarginInlineEnd); } .pf-v6-c-alert__action-group { grid-area: actiongroup; padding-block-start: var(--pf-v6-c-alert__action-group--PaddingBlockStart); } .pf-v6-c-alert__action-group > .pf-v6-c-button:not(:last-child) { margin-inline-end: var(--pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd); } .pf-v6-c-badge { --pf-v6-c-badge--BorderColor: transparent; --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular); --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill); --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm); --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold); --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm); --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm); --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default); --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl); --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs); --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default); --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default); --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default); --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default); --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default); --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default); --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default); --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled); --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled); --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default); } .pf-v6-c-badge { position: relative; display: inline-block; min-width: var(--pf-v6-c-badge--MinWidth); padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart); padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd); font-size: var(--pf-v6-c-badge--FontSize); font-weight: var(--pf-v6-c-badge--FontWeight); color: var(--pf-v6-c-badge--Color); text-align: center; white-space: nowrap; background-color: var(--pf-v6-c-badge--BackgroundColor); border-radius: var(--pf-v6-c-badge--BorderRadius); } .pf-v6-c-badge::after { position: absolute; inset: 0; pointer-events: none; content: ""; border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor); border-radius: inherit; } .pf-v6-c-badge.pf-m-read { --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color); --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor); --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color); } .pf-v6-c-badge.pf-m-unread { --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color); --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor); --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color); } .pf-v6-c-badge.pf-m-disabled { --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color); --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor); } .pf-v6-c-badge.pf-m-disabled::after { border-color: var(--pf-v6-c-badge--m-disabled--BorderColor); } .pf-v6-c-badge__toggle-icon { margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart); color: var(--pf-v6-c-badge__toggle-icon--Color); } .pf-v6-c-avatar { --pf-v6-c-avatar--BorderColor: transparent; --pf-v6-c-avatar--BorderWidth: 0; --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill); --pf-v6-c-avatar--Width: 2.25rem; --pf-v6-c-avatar--Height: 2.25rem; --pf-v6-c-avatar--m-sm--Width: 1.5rem; --pf-v6-c-avatar--m-sm--Height: 1.5rem; --pf-v6-c-avatar--m-md--Width: 2.25rem; --pf-v6-c-avatar--m-md--Height: 2.25rem; --pf-v6-c-avatar--m-lg--Width: 4.5rem; --pf-v6-c-avatar--m-lg--Height: 4.5rem; --pf-v6-c-avatar--m-xl--Width: 8rem; --pf-v6-c-avatar--m-xl--Height: 8rem; --pf-v6-c-avatar--m-bordered--BorderColor: var(--pf-t--global--border--color--default); --pf-v6-c-avatar--m-bordered--BorderWidth: var(--pf-t--global--border--width--box--default); } .pf-v6-c-avatar { width: var(--pf-v6-c-avatar--Width); height: var(--pf-v6-c-avatar--Height); border: var(--pf-v6-c-avatar--BorderWidth) solid var(--pf-v6-c-avatar--BorderColor); border-radius: var(--pf-v6-c-avatar--BorderRadius); } .pf-v6-c-avatar.pf-m-bordered { --pf-v6-c-avatar--BorderColor: var(--pf-v6-c-avatar--m-bordered--BorderColor); --pf-v6-c-avatar--BorderWidth: var(--pf-v6-c-avatar--m-bordered--BorderWidth); } .pf-v6-c-avatar.pf-m-sm { --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-sm--Width)