@import '../../stylesheets/defaults'

+host-styles(mp-custom-event-tooltip)
  display block

.mp-custom-event-tooltip
  height 100%
  width 100%

  mp-tooltip
    left 0
    position absolute
    top 0
    z-index $z-tooltip

    .mp-custom-event-tooltip-content-wrapper
      display flex
      flex-wrap wrap
      line-height 18px
      width 100%

      span
        color $grey-500
        white-space normal

        &.mp-custom-event-tooltip-part-highlight
          color $white

        // use margin-left for spacing between spans
        &:not(:first-child):before
          content '\20 '