@use "../../wc";


:host {
  display: contents;
}

.tooltip {
  --arrow-size: 6px;
}

.tooltip[placement^='top']::part(popup) {
  transform-origin: bottom;
}

.tooltip[placement^='bottom']::part(popup) {
  transform-origin: top;
}

.tooltip[placement^='left']::part(popup) {
  transform-origin: right;
}

.tooltip[placement^='right']::part(popup) {
  transform-origin: left;
}

.tooltip__body {
  display: block;
  width: max-content;
  max-width: max-content;
  border-radius: 5px;
  background-color: var(--arrow-color);
  font-size: 12px;
  text-align: start;
  white-space: normal;
  color: white;
  padding: 5px;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}