:root {
  --visage-popover-padding: 16px;
  --visage-popover-background-color: #fff;
  --visage-popover-border-color: var(--visage-color-border);
  --visage-popover-border-radius: 0
}
@keyframes popover-slide-top {
  0% {
    opacity: 0;
    transform: translateY(-15%)
  }
  100% {
    opacity: 1;
    transform: translateY(0)
  }
}
@keyframes popover-slide-right {
  0% {
    opacity: 0;
    transform: translateX(15%)
  }
  100% {
    opacity: 1;
    transform: translateX(0)
  }
}
@keyframes popover-slide-bottom {
  0% {
    opacity: 0;
    transform: translateY(15%)
  }
  100% {
    opacity: 1;
    transform: translateY(0)
  }
}
@keyframes popover-slide-left {
  0% {
    opacity: 0;
    transform: translateX(-15%)
  }
  100% {
    opacity: 1;
    transform: translateX(0)
  }
}
.popover {
  position: fixed;
  z-index: 10;
  box-sizing: border-box;
  min-height: 30px;
  max-width: 375px;
  padding: var(--visage-popover-padding);
  background: var(--visage-popover-background-color);
  border: 1px solid var(--visage-popover-border-color);
  border-radius: var(--visage-popover-border-radius);
  filter: var(--visage-popover-filter, drop-shadow(0 2px 8px rgba(0, 17, 26, 0.1)))
}
.popover::after,
.popover::before {
  content: "";
  position: absolute;
  border: 12px solid transparent
}
.popover-position-top {
  margin-top: -20px;
  animation: 0.4s popover-slide-top
}
.popover-position-top::after,
.popover-position-top::before {
  top: 100%;
  left: 50%;
  margin-left: -12px;
  border-top-color: var(--visage-popover-background-color)
}
.popover-position-top::before {
  margin-top: 1px;
  border-top-color: var(--visage-color-border)
}
.popover-position-right {
  margin-left: 20px;
  animation: 0.4s popover-slide-right
}
.popover-position-right::after,
.popover-position-right::before {
  top: 50%;
  right: 100%;
  margin-top: -12px;
  border-right-color: var(--visage-popover-background-color)
}
.popover-position-right::before {
  margin-right: 1px;
  border-right-color: var(--visage-color-border)
}
.popover-position-bottom {
  margin-top: 20px;
  animation: 0.4s popover-slide-bottom
}
.popover-position-bottom::after,
.popover-position-bottom::before {
  bottom: 100%;
  left: 50%;
  margin-left: -12px;
  border-bottom-color: var(--visage-popover-background-color)
}
.popover-position-bottom::before {
  margin-bottom: 1px;
  border-bottom-color: var(--visage-color-border)
}
.popover-position-left {
  margin-left: -20px;
  animation: 0.4s popover-slide-left
}
.popover-position-left::after,
.popover-position-left::before {
  top: 50%;
  left: 100%;
  margin-top: -12px;
  border-left-color: var(--visage-popover-background-color)
}
.popover-position-left::before {
  margin-left: 1px;
  border-left-color: var(--visage-color-border)
}
.popover.popover-hide-arrow::after,
.popover.popover-hide-arrow::before {
  display: none
}
.popover-content {
  display: none
}
.popover.popover-skin-full-bleed {
  padding: 0
}