/**
 * Auto-generated file. Do not edit directly.
 */
/* stylelint-disable value-keyword-case */
/* stylelint-enable value-keyword-case */
:host {
  display: contents;
}

:host([hidden]) {
  display: none;
}

.tooltip {
  --cat-font-color-head: var(--cat-font-color-tooltip, 255, 255, 255);
  --cat-font-color-body: var(--cat-font-color-tooltip, 255, 255, 255);
  position: fixed;
  width: max-content;
  top: 0;
  left: 0;
  box-sizing: border-box;
  background-color: rgb(var(--cat-bg-tooltip, 0, 0, 0));
  border-radius: var(--cat-border-radius-m, 0.25rem);
  color: rgb(var(--cat-font-color-tooltip, 255, 255, 255));
  transition: opacity 250ms linear, visibility 250ms linear;
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 8px 0;
  z-index: calc(var(--cat-z-index, 1000) + 200);
  max-width: min(100vw - 0.5rem, 20rem);
}
.tooltip-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.tooltip-show {
  opacity: 1;
  visibility: visible;
}
.tooltip p {
  margin: 0;
}

.tooltip-round {
  border-radius: 10rem;
}

.tooltip-s {
  padding: 0.25rem 0.375rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
}
.tooltip-s.tooltip-round {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.tooltip-m {
  padding: 0.375rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.125rem;
  font-weight: 500;
}
.tooltip-m.tooltip-round {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.tooltip-l {
  padding: 0.5rem 0.75rem;
  font-size: 0.9375rem;
  line-height: 1.25rem;
  font-weight: 500;
}
.tooltip-l.tooltip-round {
  padding-left: 1rem;
  padding-right: 1rem;
}