/**
 * Product Stock — common widget CSS.
 *
 * The active status colour is exposed through the --captwiki-stock-color custom
 * property (set per state by the Elementor controls), so the per-style sheets can
 * decide how to apply it (text, dot, background, border…).
 *
 * @package captain-widgets-kit
 * @since   1.3.0
 */

.captwiki-stock {
	--captwiki-stock-color: #16a34a;
	display: flex;
}

.captwiki-stock__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	line-height: 1.3;
}

.captwiki-stock__dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var( --captwiki-stock-color );
}

.captwiki-stock__qty {
	opacity: 0.7;
	font-size: 0.9em;
}

/* Editor notice. */
.captwiki-stock--notice {
	display: block;
	padding: 14px 16px;
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	background: #f6f7f7;
	color: #50575e;
	text-align: center;
	font-size: 13px;
}

.captwiki-stock--notice p {
	margin: 0;
}
