& {
  .lbaic-tooltip {
    position: absolute;
    transform: var(--lbaic-tooltip-transform);
    pointer-events: none;
    z-index: 2001;

    &-in {
      opacity: 1;
      transform: var(--lbaic-tooltip-show-transform);
      transition: transform 360ms ease-in-out, opacity 360ms ease-in-out;

      &.hide {
        opacity: 0;
      }
    }

    &-inner {
      position: relative;
      width: var(--lbaic-tooltip-width, auto);
      padding: 4px 8px;
      background-color: var(--lbaic-black-100);
      border: 1px solid rgba(var(--lbaic-white-rgb), 0.2);
      border-radius: 6px;

      &:after {
        content: '';
        position: absolute;
        width: 10px;
        height: 10px;
        background-color: var(--lbaic-black-100);
        border-top: var(--lbaic-tooltip-border-t-w, 0) solid rgba(var(--lbaic-white-rgb), 0.2);
        border-right: var(--lbaic-tooltip-border-r-w, 0) solid rgba(var(--lbaic-white-rgb), 0.2);
        border-bottom: var(--lbaic-tooltip-border-b-w, 0) solid rgba(var(--lbaic-white-rgb), 0.2);
        border-left: var(--lbaic-tooltip-border-l-w, 0) solid rgba(var(--lbaic-white-rgb), 0.2);
        border-radius: 2px;
        transform: var(--lbaic-tooltip-arrow-transform);
      }
    }

    &-p {
      &-top {
        --lbaic-tooltip-border-b-w: 1px;
        --lbaic-tooltip-border-r-w: 1px;

        --lbaic-tooltip-show-transform: translate3d(0, 0, 0);

        .hide {
          --lbaic-tooltip-show-transform: #{translate3d(0, 8px, 0)};
        }

        &.lbaic-tooltip-a {
          &-left {
            --lbaic-tooltip-transform: #{translate3d(0, -10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(125%, 50%, 0) rotate(45deg);

            bottom: 100%;
            left: 0;

            .lbaic-tooltip-inner {
              &:after {
                bottom: 0;
                left: 0;
              }
            }
          }

          &-center {
            --lbaic-tooltip-transform: #{translate3d(-50%, -10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(-50%, 50%, 0) rotate(45deg);

            bottom: 100%;
            left: 50%;

            .lbaic-tooltip-inner {
              &:after {
                bottom: 0;
                left: 50%;
              }
            }
          }

          &-right {
            --lbaic-tooltip-transform: #{translate3d(0, -10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(-125%, 50%, 0) rotate(45deg);

            bottom: 100%;
            right: 0;

            .lbaic-tooltip-inner {
              &:after {
                bottom: 0;
                right: 0;
              }
            }
          }
        }
      }

      &-right {
        --lbaic-tooltip-border-b-w: 1px;
        --lbaic-tooltip-border-l-w: 1px;

        --lbaic-tooltip-transform: #{translate3d(10px, -50%, 0)};
        --lbaic-tooltip-arrow-transform: translate3d(-50%, -50%, 0) rotate(45deg);
        --lbaic-tooltip-show-transform: translate3d(0, 0, 0);

        top: 50%;
        left: 100%;

        .hide {
          --lbaic-tooltip-show-transform: #{translate3d(-8px, 0, 0)};
        }

        .lbaic-tooltip-inner {
          &:after {
            top: 50%;
            left: 0;
          }
        }
      }

      &-bottom {
        --lbaic-tooltip-border-t-w: 1px;
        --lbaic-tooltip-border-l-w: 1px;
        --lbaic-tooltip-show-transform: translate3d(0, 0, 0);

        .hide {
          --lbaic-tooltip-show-transform: #{translate3d(0, -8px, 0)};
        }

        &.lbaic-tooltip-a {
          &-left {
            --lbaic-tooltip-transform: #{translate3d(0, 10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(125%, -50%, 0) rotate(45deg);

            top: 100%;
            left: 0;

            .lbaic-tooltip-inner {
              &:after {
                top: 0;
                left: 0;
              }
            }
          }

          &-center {
            --lbaic-tooltip-transform: #{translate3d(-50%, 10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(-50%, -50%, 0) rotate(45deg);

            top: 100%;
            left: 50%;

            .lbaic-tooltip-inner {
              &:after {
                top: 0;
                left: 50%;
              }
            }
          }

          &-right {
            --lbaic-tooltip-transform: #{translate3d(0, 10px, 0)};
            --lbaic-tooltip-arrow-transform: translate3d(-125%, -50%, 0) rotate(45deg);

            top: 100%;
            right: 0;

            .lbaic-tooltip-inner {
              &:after {
                top: 0;
                right: 0;
              }
            }
          }
        }
      }

      &-left {
        --lbaic-tooltip-border-t-w: 1px;
        --lbaic-tooltip-border-r-w: 1px;

        --lbaic-tooltip-transform: #{translate3d(-10px, -50%, 0)};
        --lbaic-tooltip-arrow-transform: translate3d(50%, -50%, 0) rotate(45deg);
        --lbaic-tooltip-show-transform: translate3d(0, 0, 0);

        top: 50%;
        right: 100%;

        .hide {
          --lbaic-tooltip-show-transform: #{translate3d(8px, 0, 0)};
        }

        .lbaic-tooltip-inner {
          &:after {
            top: 50%;
            right: 0;
          }
        }
      }

      &-center {
        .lbaic-tooltip-inner {
          &:after {
            visibility: hidden;
          }
        }

        &.lbaic-tooltip-a {
          &-left {
            --lbaic-tooltip-transform: #{translate3d(0, 50%, 0)};

            bottom: 50%;
            left: 0;
          }

          &-center {
            --lbaic-tooltip-transform: #{translate3d(-50%, 50%, 0)};

            bottom: 50%;
            left: 50%;
          }

          &-right {
            --lbaic-tooltip-transform: #{translate3d(0, 50%, 0)};

            bottom: 50%;
            right: 0;
          }
        }
      }
    }

    &-message {
      position: relative;
      display: block;
      font-size: var(--lbaic-fs-12);
      color: var(--lbaic-white-100);
      text-align: center;
      line-height: var(--lbaic-lh-14);
      white-space: nowrap;
      z-index: 2;
    }
  }
}
