/**
 * Free-shipping notice styles for cart and checkout.
 *
 * @package PCM_Core
 * @since   1.2.5
 */

.pcm-free-shipping-notice {
	--pcm-free-shipping-bg: var(--wp--preset--color--primary, #5344f4);
	--pcm-free-shipping-fg: #ffffff;
	--pcm-free-shipping-track: rgba(255, 255, 255, 0.28);
	--pcm-free-shipping-progress: 0%;

	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 100%);
	margin: 0 0 1.5rem;
	padding: 1rem 1.25rem;
	border-radius: 12px;
	background: var(--pcm-free-shipping-bg);
	color: #ffffff;
}

.pcm-free-shipping-notice[hidden] {
	display: none !important;
}

.pcm-free-shipping-notice__text {
	margin: 0 0 0.75rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	color: #ffffff;
}

.pcm-free-shipping-notice__track {
	display: block;
	width: 100%;
	height: 0.5rem;
	overflow: hidden;
	border-radius: 999px;
	background: var(--pcm-free-shipping-track);
}

.pcm-free-shipping-notice__bar {
	display: block;
	height: 100%;
	width: var(--pcm-free-shipping-progress);
	border-radius: inherit;
	background: var(--pcm-free-shipping-fg);
	transition: width 0.25s ease;
}

@media (min-width: 782px) {
	.pcm-free-shipping-notice {
		padding: 1.125rem 1.5rem;
	}
}