/**
 * Content.
 */
.wcpbc-content {
	display: none;
}

/**
 * Price loading
 */
.wcpbc-price.loading *:not(.wcpbc-placeholder) {
	display: none;
}

.wcpbc-price.loading {
	visibility: hidden;
	color: inherit;
}

/**
 * All Products for WooCommerce Subscriptions
 */
.wc-price-based-country-refresh-area[data-area="wcsatt"]:not(.refreshed) {
	visibility: hidden;
}

.wc-price-based-country-refresh-area[data-area="wcsatt"]:not(.refreshed) .wcpbc-price.loading .wcpbc-placeholder {
	display: none;
}

/**
 * Skeleton placeholder.
 */
 @keyframes wcpbc_skeleton_animation {
	100% {
		transform: translateX(100%);
	}
}

.wcpbc-price.loading .wcpbc-placeholder.-skeleton {
	visibility: visible;
	outline: 0 !important;
	border: 0 !important;
	background-color: currentColor !important;
	color: currentColor !important;
	width: 8ch;
	height: 1.2em;
	display: inline-block;
	line-height: 1;
	position: relative !important;
	overflow: hidden !important;
	max-width: 12ch !important;
	pointer-events: none;
	box-shadow: none;
	z-index: 1; /* Necessary for overflow: hidden to work correctly in Safari */
	opacity: 0.15;
}

.wcpbc-price.loading .wcpbc-placeholder.-skeleton::after {
	content: " ";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 100%;
	background-repeat: no-repeat;
	background-image: linear-gradient(90deg, currentColor, #f5f5f54d, currentColor);
	transform: translateX(-100%);
	animation: wcpbc_skeleton_animation 1.5s ease-in-out infinite;
}

@media screen and (prefers-reduced-motion: reduce) {
	.wcpbc-price.loading .wcpbc-placeholder.-skeleton::after {
		animation: none;
	}
}

/**
 * Dots placeholder.
 *
 * @see https://github.com/nzbin/three-dots
 */

 .wcpbc-price.loading .wcpbc-placeholder.-dots {
	visibility: visible;
	position: relative;
	display: inline-block;
	margin: 0.2em 0 0.2em 1.2em;
	overflow: visible;
	animation: dot-flashing 1s infinite linear alternate;
	animation-delay: 0.5s;
}

.wcpbc-price.loading .wcpbc-placeholder.-dots::before, .wcpbc-price.loading .wcpbc-placeholder.-dots::after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 0;
}
.wcpbc-price.loading .wcpbc-placeholder.-dots::before {
	left: -1.2em;
	animation: dot-flashing 1s infinite linear alternate;
	animation-delay: 0s;
}
.wcpbc-price.loading .wcpbc-placeholder.-dots::after {
	left: 1.2em;
	animation: dot-flashing 1s infinite linear alternate;
	animation-delay: 1s;
}

.wcpbc-price.loading .wcpbc-placeholder.-dots, .wcpbc-price.loading .wcpbc-placeholder.-dots::before, .wcpbc-price.loading .wcpbc-placeholder.-dots::after {
	width: 0.8em;
	height: 0.8em;
	border-radius: 50%;
	color: inherit;
	background-color: currentColor;
}

@keyframes dot-flashing {
	0% {
		background-color: currentColor;
	}
	50%, 100% {
		background-color: transparent;
	}
}