/**
 * Advanced Progress Bar — Style 3: Inline Gradient
 *
 * A slim, pill track with a smooth gradient fill ( accent → secondary ) and a
 * glowing knob that rides the leading edge of the fill. Modern and minimal.
 *
 * @package captain-widgets-kit
 * @since   1.6.0
 */

.captwiki-progress.captwiki-style-3 {
	--captwiki-pb-height: 8px;
}

.captwiki-progress.captwiki-style-3 .captwiki-progress__head {
	margin-bottom: 10px;
}

.captwiki-progress.captwiki-style-3 .captwiki-progress__track {
	overflow: visible;
}

.captwiki-progress.captwiki-style-3 .captwiki-progress__fill {
	background: linear-gradient( 90deg, var( --captwiki-pb-accent ), var( --captwiki-pb-accent-2 ) );
	overflow: visible;
}

.captwiki-progress.captwiki-style-3 .captwiki-progress__fill-glow {
	display: block;
	position: absolute;
	top: 50%;
	right: 0;
	width: calc( var( --captwiki-pb-height ) + 6px );
	height: calc( var( --captwiki-pb-height ) + 6px );
	transform: translate( 50%, -50% );
	background: #ffffff;
	border: 2px solid var( --captwiki-pb-accent-2 );
	border-radius: 50%;
	box-shadow: 0 0 10px 1px color-mix( in srgb, var( --captwiki-pb-accent-2 ) 65%, transparent );
}
