//
// Tooltips
// --------------------------------------------------


// Base class
.tooltip {
  position: absolute;
  z-index: $zindex-tooltip;
  display: block;
  // Reset font and text propertes given new insertion method
  font-family: $font-family-base;
  font-size: $font-size-sm;
  font-weight: normal;
  line-height: 1.4;
  visibility: visible;
  opacity: 0;

  &.in { opacity: $tooltip-opacity; }
}

.tooltip-top {
  padding: $tooltip-arrow-width 0;
  margin-top: -3px;
}
.tooltip-right {
  padding: 0 $tooltip-arrow-width;
  margin-left: 3px;
}
.tooltip-bottom {
  padding: $tooltip-arrow-width 0;
  margin-top: 3px;
}
.tooltip-left {
  padding: 0 $tooltip-arrow-width;
  margin-left: -3px;
}

// Wrapper for the tooltip content
.tooltip-inner {
  max-width: $tooltip-max-width;
  padding: 3px 8px;
  color: $tooltip-color;
  text-align: center;
  text-decoration: none;
  background-color: $tooltip-bg;
  @include border-radius($border-radius-base);
}

// Arrows
.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.tooltip-top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -$tooltip-arrow-width;
  border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
  border-top-color: $tooltip-arrow-color;
}
.tooltip-right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -$tooltip-arrow-width;
  border-width: $tooltip-arrow-width $tooltip-arrow-width $tooltip-arrow-width 0;
  border-right-color: $tooltip-arrow-color;
}
.tooltip-left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -$tooltip-arrow-width;
  border-width: $tooltip-arrow-width 0 $tooltip-arrow-width $tooltip-arrow-width;
  border-left-color: $tooltip-arrow-color;
}
.tooltip-bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -$tooltip-arrow-width;
  border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
  border-bottom-color: $tooltip-arrow-color;
}