/*------------------------------------
  Tooltip v2
------------------------------------*/

.u-tooltip {
  &--v2 {
    line-height: 1.4em;
    background-color: $g-color-white;
    border-radius: 4px;
    box-shadow: 1px 3px 6px 0 rgba($g-color-black, .1);
    @include px-to-rem(padding, 5px 10px);
    @include px-to-rem(margin-left, 20px);
    transform: translate(50%, 100%);

    &::before {
      content: '';
      position: absolute;
      top: 50%;
      left: auto;
      right: 100%;
      width: 0;
      height: 0;
      margin-left: 0;
      border: 7px solid transparent;
      border-right-color: $g-color-white;
      transform: translateY(-50%);
    }
  }
}