.toolbarOverlay
  border 2px solid var(--ui-border-color-dark)
  padding 5px

.tooltip-toolbar-overlay
  margin-top 40px
  background-color: var(--primary-background-color);
  border: 1px solid var(--default-color);
  border-radius: 8px;

  .tooltip-arrow
    display none
  .tooltip-inner
    max-width: unset
    background: none

.tooltip
  position: absolute
  z-index: 1070
  display: block
  font-style: normal
  font-weight: normal
  letter-spacing: normal
  line-break: auto
  line-height: 1.42857143
  text-align: left
  text-align: start
  text-decoration: none
  text-shadow: none
  text-transform: none
  white-space: normal
  word-break: normal
  word-spacing: normal
  word-wrap: normal
  font-size: 12px
  opacity: 0

  &.in
    opacity: 0.9

  &.top
    margin-top: -3px
    padding: 5px 0

    .tooltip-arrow
      bottom: 0
      left: 50%
      margin-left: -5px
      border-width: 5px 5px 0
      border-top-color: #000

  &.right
    margin-left: 3px
    padding: 0 5px

    .tooltip-arrow
      top: 50%
      left: 0
      margin-top: -5px
      border-width: 5px 5px 5px 0
      border-right-color: #000

  &.bottom
    margin-top: 3px
    padding: 5px 0

    .tooltip-arrow
      top: 0
      left: 50%
      margin-left: -5px
      border-width: 0 5px 5px
      border-bottom-color: #000

  &.left
    margin-left: -3px
    padding: 0 5px

    .tooltip-arrow
      top: 50%
      right: 0
      margin-top: -5px
      border-width: 5px 0 5px 5px
      border-left-color: #000

  &.top-left .tooltip-arrow
    bottom: 0
    right: 5px
    margin-bottom: -5px
    border-width: 5px 5px 0
    border-top-color: #000

  &.top-right .tooltip-arrow
    bottom: 0
    left: 5px
    margin-bottom: -5px
    border-width: 5px 5px 0
    border-top-color: #000

  &.bottom-left .tooltip-arrow
    top: 0
    right: 5px
    margin-top: -5px
    border-width: 0 5px 5px
    border-bottom-color: #000

  &.bottom-right .tooltip-arrow
    top: 0
    left: 5px
    margin-top: -5px
    border-width: 0 5px 5px
    border-bottom-color: #000

.tooltip-inner
  max-width: 200px
  padding: 3px 8px
  color: #fff
  text-align: center
  background-color: #000
  border-radius: 4px

.tooltip-arrow
  position: absolute
  width: 0
  height: 0
  border-color: transparent
  border-style: solid

.fade
  opacity: 0
  -webkit-transition: opacity 0.15s linear
  -o-transition: opacity 0.15s linear
  transition: opacity 0.15s linear

.fade.in
  opacity: 1