// ============================================================================
// Chatbot Jump Button
// ============================================================================
// importants are temporary until we can find a workaround for the way Backstage is pulling in style sheets
.pf-chatbot__jump {
  position: absolute !important;
  inset-inline-start: 75% !important;
  width: 2rem !important;
  height: 2rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--pf-t--global--spacer--md) !important;
  border-radius: var(--pf-t--global--border--radius--pill) !important;
  --pf-v6-c-button--MinWidth: 2rem !important;
  background-color: var(--pf-t--global--background--color--primary--default) !important;
  border: 1px solid var(--pf-t--global--border--color--default) !important;
  box-shadow: var(--pf-t--global--box-shadow--sm);
  color: var(--pf-t--global--icon--color--subtle) !important;
  transform: translate3d(-50%, 0, 0) !important;
  transition:
    background-color var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--sm),
    box-shadow var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--sm),
    transform var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--md),
    opacity var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--md) !important;
  z-index: var(--pf-t--global--z-index--md) !important;

  .pf-v6-c-button__text {
    line-height: 1rem;
  }

  &:hover,
  &:focus {
    background-color: var(--pf-t--global--background--color--primary--hover) !important;
    box-shadow: var(--pf-t--global--box-shadow--md) !important;
    color: var(--pf-t--global--icon--color--regular) !important;
  }

  &--top {
    inset-block-start: var(--pf-t--global--spacer--md) !important;
  }

  &--bottom {
    inset-block-end: var(--pf-t--global--spacer--md) !important;
  }

  // allows for zoom conditions; try zooming to 200% to see
  @media screen and (max-height: 518px) {
    display: none;
  }
}