.unf-poptip
  display inline-block
  &-popper
    min-width $poptip-min-width
    &[x-placement^=top]
      padding-bottom $poptip-offset-padding
      & ^[1]-content:before
        bottom -7px
        border-top 7px solid $poptip-content-bg
        border-left 7px solid transparent
        border-right 7px solid transparent
        border-bottom 0
    &[x-placement^=bottom]
      padding-top $poptip-offset-padding
      & ^[1]-content:before
        top -7px
        border-top 0
        border-left 7px solid transparent
        border-right 7px solid transparent
        border-bottom 7px solid $poptip-content-bg
    &[x-placement=top-start] ^[1]-content:before
    &[x-placement=bottom-start] ^[1]-content:before
      left 16px
    &[x-placement=top] ^[1]-content:before
    &[x-placement=bottom] ^[1]-content:before
      left 50%
      margin-left -7px
    &[x-placement=top-end] ^[1]-content:before
    &[x-placement=bottom-end] ^[1]-content:before
      right 16px
    &[x-placement^=left]
      padding-right $poptip-offset-padding
      & ^[1]-content:before
        right -7px
        border-top 7px solid transparent
        border-bottom 7px solid transparent
        border-left 7px solid $poptip-content-bg
        border-right 0
    &[x-placement^=right]
      padding-left $poptip-offset-padding
      & ^[1]-content:before
        left -7px
        border-top 7px solid transparent
        border-bottom 7px solid transparent
        border-left 0
        border-right 7px solid $poptip-content-bg
    &[x-placement=left-start] ^[1]-content:before
    &[x-placement=right-start] ^[1]-content:before
      top 8px
    &[x-placement=left] ^[1]-content:before
    &[x-placement=right] ^[1]-content:before
      top 50%
      margin-top -7px
    &[x-placement=left-end] ^[1]-content:before
    &[x-placement=right-end] ^[1]-content:before
      bottom 8px
    &-content
      filter drop-shadow(0 1px 4px rgba(44, 81, 56, 0.35))
      position relative
      s-font-body()
      background-color $poptip-content-bg
      border-radius $poptip-content-radius
      padding $poptip-content-padding
      &:before
        content ''
        position absolute
      & > .unf-btn-default
        margin-top 6px
        color $poptip-content-color
        background-color $poptip-content-btn-bg
        border-color @background-color
        &:hover
          background-color $poptip-content-btn-hover-bg
          border-color @background-color
    &-text
      text-align left
      padding 0 4px
    &-invert
      & ^[1]-content
        color $poptip-content-color
        background-color $poptip-content-invert-bg
      &[x-placement^=top] ^[1]-content:before
      &[x-placement^=bottom] ^[1]-content:before
        border-top-color $poptip-content-invert-bg
        border-bottom-color $poptip-content-invert-bg
      &[x-placement^=left] ^[1]-content:before
      &[x-placement^=right] ^[1]-content:before
        border-left-color $poptip-content-invert-bg
        border-right-color $poptip-content-invert-bg