/* Typography Usage mixins */
:host {
  position: absolute;
}

.tds-tooltip {
  box-sizing: border-box;
  font-family: var(--detail-05-font-family);
  font-size: var(--detail-05-font-size);
  line-height: var(--detail-05-line-height);
  font-weight: var(--detail-05-font-weight);
  letter-spacing: var(--detail-05-letter-spacing);
  text-transform: var(--detail-05-text-transform);
  color: var(--tds-tooltip-color);
  background-color: var(--tds-tooltip-background);
  border-radius: var(--tds-tooltip-border-radius);
  padding: 8px;
  overflow-wrap: break-word;
  white-space: normal;
  max-width: 192px;
  z-index: 900;
  opacity: 0;
  visibility: hidden;
  transition: opacity 200ms ease-in, visibility 200ms ease-in;
}
.tds-tooltip * {
  box-sizing: border-box;
}
.tds-tooltip.tds-tooltip-top-left {
  border-radius: var(--tds-tooltip-border-radius-none) var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius);
}
.tds-tooltip.tds-tooltip-top-right {
  border-radius: var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius-none) var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius);
}
.tds-tooltip.tds-tooltip-bottom-right {
  border-radius: var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius-none);
}
.tds-tooltip.tds-tooltip-bottom-left {
  border-radius: var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius) var(--tds-tooltip-border-radius-none);
}

.tds-tooltip-show {
  opacity: 1;
  visibility: visible;
}