$gray-dark:                 #273240 !default;
$brand-primary:             #09f !default;
$brand-success:             #43a147 !default;
$brand-info:                #c7eeff !default;
$brand-warning:             #f0ad4e !default;
$brand-danger:              #e23b3b !default;
$brand-inverse:             $gray-dark !default;

@mixin popover-variant($color) {
  .popover-title {
    background-color: $color;
  }
  &.popover-bottom {
    .popover-arrow {
      border-bottom-color: $color;
    }
    .popover-arrow:after {
      border-bottom-color: $color;
    }
  }
}

.popover {
  min-width: 350px;
  padding: 0;
  .popover-title {
    align-items: center;
    color: #fff;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    padding: 1rem;
    .title-text {
      display: inline-block;
      flex-grow: 99;
    }
    .info-icon {
      line-height: 2rem;
      margin-right: .8rem;
    }
    .close-icon {
      cursor: pointer;
    }
  }

  .popover-content {
    min-height: 100px;
  }
}

.popover-default {
  @include popover-variant($brand-inverse);
}

.popover-success {
  @include popover-variant($brand-success);
}

.popover-warning {
  @include popover-variant($brand-warning);
}

.popover-danger {
  @include popover-variant($brand-danger);
}

.popover-primary {
  @include popover-variant($brand-primary);

}

.popover .virtual-area {
  height: 11px;
  position: absolute;
  width: 100%;
}
.popover.top .virtual-area {
  bottom: -11px;
}
.popover.bottom .virtual-area {
  top: -11px;
}
.popover.left .virtual-area {
  right: -11px;
}
.popover.right .virtual-area {
  left: -11px;
}