/* Popovers */

.popover-static-demo {
	.popover {
		width: 185px;
		position: relative;
		display: block;
		float: left;
		margin: 1rem .5rem;
		&.bs-popover-bottom-demo,
		&.bs-popover-top-demo {
			.arrow {
				left: 50%;
			}
		}
		&.bs-popover-left-demo,
		&.bs-popover-right-demo{
			.arrow {
				top: 50%;
			}
		}
	}
}

.popover {
	z-index: 1029;
	&.bs-popover-top-demo {
		.arrow {
			&:before{
				border-top-color: $popover-arrow-color;
			}
			&:after{
				border-top-color: $popover-arrow-color;
			}
		}
	}
	&.bs-popover-right-demo{
		.arrow {
			&:before{
				border-right-color: $popover-arrow-color;
			}
			&:after{
				border-right-color: $popover-arrow-color;
			}
		}
	}
	&.bs-popover-bottom-demo{
		.arrow {
			&:before{
				border-bottom-color: $popover-arrow-color;
			}
			&:after{
				border-bottom-color: $popover-arrow-color;
			}
		}
		.popover-header {
			&:before {
				border-bottom: 0;
			}
		}
	}
	&.bs-popover-left-demo{
		.arrow {
			&:before{
				border-left-color: $popover-arrow-color;
			}
			&:after{
				border-left-color: $popover-arrow-color;
			}
		}
	}
	.popover-header {
		font-size: .9375rem;
		border-bottom: 0;
		color: theme-color(primary);
		background: $popover-bg;
	}
	.popover-body{
		color: $popover-text-color;
		background: $popover-bg;
	}
	&.left{
		.arrow{
			&:after{
				border-left-color: $popover-arrow-color;
			}
		}
	}
	&.right{
		.arrow{
			&:after{
				border-right-color: $popover-arrow-color;
			}
		}
	}
}

@each $color, $value in $theme-colors {
	.popover-#{$color} {
	  @include popover-variant(theme-color($color));
	}
}