$popover-action-border-color: rgba(0, 0, 0, 0.1);
$popover-background-color: $white;
$popover-border-color: $gray-200;

.popover {
  background: $popover-background-color;
  z-index: 10001;
  box-shadow: 0 0.0625rem 0.1875rem 0 $shadow;
  border-color: $gray-150;
  max-width: rem(320);
  padding: 0.75rem 1rem;

  .popovers-actions {
    border-top: 0.0625rem solid $popover-action-border-color;
    margin: 0 -0.9375rem;
    width: calc(100% + 1.875rem);

    .popovers-link {
      color: $gray-500;
      box-sizing: border-box;
      display: block;
      float: left;
      margin: 0;
      padding: 0.875rem 0;
      text-align: center;
      width: 50%;
      font-size: 1rem;

      &:hover, &:active, &:focus {
        text-decoration: none;
      }

      &:hover {
        background-color: $gray-50;
      }

      &.primary-action {
        border-left: 0.0625rem solid $popover-action-border-color;
        color: $blue-700;
        width: calc(50% - 0.0625rem);
      }
    }
  }
}

.popover:after {
  border-width: 0.6875rem;
}

.popover.bs-popover-bottom .arrow::after,
.popover.bs-tether-element-attached-top::after {
  border-bottom-color: $gray-25;
}

.popover.bs-popover-top .arrow::after,
.popover.bs-tether-element-attached-bottom::after {
  border-top-color: $gray-25;
}

.popover.bs-popover-right .arrow::after,
.popover.bs-tether-element-attached-left::after {
  border-right-color: $gray-25;
}

.popover.bs-popover-left .arrow::after,
.popover.bs-tether-element-attached-right::after {
  border-left-color: $gray-25;
}

.popover.bs-popover-bottom .arrow::before,
.popover.bs-tether-element-attached-top::before {
  border-bottom-color: $popover-border-color;
}

.popover.bs-popover-top .arrow::before,
.popover.bs-tether-element-attached-bottom::before {
  border-top-color: $popover-border-color;
}

.popover.bs-popover-right .arrow::before,
.popover.bs-tether-element-attached-left::before {
  border-right-color: $popover-border-color;
}

.popover.bs-popover-left .arrow::before,
.popover.bs-tether-element-attached-right::before {
  border-left-color: $popover-border-color;
}

.popover-close {
  display: block;
  float: right;
  margin: 0.375rem 0.625rem 0;

  i {
    color: $blue-800;
    font-size: 1.5em;
  }
}

.popover-header {
  background: none;
  color: $gray-700;
  border-bottom: none;
  margin-top: 0 !important;
}

.wide-toggle + .popover {
  max-width: 23.125rem;
  width: 23.125rem;
}

.popover-body .card-links {
  width: 320px;
  margin: 1rem 0 rem(-22) rem(-30);
}
