/**
 * Loop Counter for Elementor – Frontend Styles
 *
 * Intentionally minimal – all visual customisation is handled by
 * Elementor's style controls. This file provides only the structural
 * defaults so the widget is usable out-of-the-box.
 */

/* ------------------------------------------------------------------ */
/* Wrapper                                                              */
/* ------------------------------------------------------------------ */
.lce-loop-counter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	line-height: 1.2;

	/* Prevent layout shifts while JS resolves the count */
	min-width: 1ch;
}

/* ------------------------------------------------------------------ */
/* Inner spans                                                           */
/* ------------------------------------------------------------------ */
.lce-loop-counter__prefix,
.lce-loop-counter__number,
.lce-loop-counter__suffix {
	display: inline;
}

/* Small gap between prefix/number/suffix */
.lce-loop-counter__prefix {
	margin-right: 0.1em;
}

.lce-loop-counter__suffix {
	margin-left: 0.1em;
}