/* =============================================================================
 * Convixo Low Stock Bar — Frontend Styles
 * Scoped under .convixo-stock-scarcity
 * ============================================================================= */

.convixo-stock-scarcity {
	--szss-bar:      #f59e0b;
	--szss-text:     #92400e;
	--szss-bg:       #fffbeb;

	background: var(--szss-bg);
	border: 1px solid color-mix(in srgb, var(--szss-bar) 30%, transparent);
	border-left: 3px solid var(--szss-bar);
	border-radius: 6px;
	padding: 12px 14px;
	margin: 0 0 18px;
	font-family: inherit;
	font-size: 13px;
	line-height: 1.4;
	color: var(--szss-text);
	box-sizing: border-box;
}

.convixo-stock-scarcity *,
.convixo-stock-scarcity *::before,
.convixo-stock-scarcity *::after {
	box-sizing: border-box;
}

/* Message */
.convixo-stock-scarcity__message {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 500;
	color: var(--szss-text);
	margin-bottom: 8px;
}

.convixo-stock-scarcity__icon {
	font-size: 16px;
	line-height: 1;
	flex-shrink: 0;
	animation: szss-pulse 2s ease-in-out infinite;
}

@keyframes szss-pulse {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.15); }
}

@media (prefers-reduced-motion: reduce) {
	.convixo-stock-scarcity__icon { animation: none; }
}

.convixo-stock-scarcity__text { flex: 1; }
.convixo-stock-scarcity__text strong {
	color: var(--szss-bar);
	font-weight: 700;
	font-size: 1.05em;
}

/* Progress track */
.convixo-stock-scarcity__progress {
	width: 100%;
	height: 6px;
	background: rgba(0, 0, 0, 0.08);
	border-radius: 99px;
	overflow: hidden;
}

.convixo-stock-scarcity__progress-fill {
	height: 100%;
	background: var(--szss-bar);
	border-radius: 99px;
	transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Critical state — more aggressive */
.convixo-stock-scarcity.is-critical {
	border-color: color-mix(in srgb, var(--szss-bar) 40%, transparent);
	animation: szss-flash 1.5s ease-in-out infinite;
}

@keyframes szss-flash {
	0%, 100% { box-shadow: 0 0 0 0 transparent; }
	50%      { box-shadow: 0 0 0 3px color-mix(in srgb, var(--szss-bar) 25%, transparent); }
}

@media (prefers-reduced-motion: reduce) {
	.convixo-stock-scarcity.is-critical { animation: none; }
}

/* Compact loop variant */
.convixo-stock-scarcity--compact {
	padding: 6px 10px;
	margin: 6px 0;
	font-size: 11px;
	border-radius: 4px;
	border-left-width: 2px;
}

.convixo-stock-scarcity--compact .convixo-stock-scarcity__message {
	margin-bottom: 0;
	font-size: 11px;
}

.convixo-stock-scarcity--compact .convixo-stock-scarcity__icon {
	font-size: 13px;
}

/* Variable product container */
.convixo-stock-scarcity-wrap {
	margin: 0 0 18px;
}