.efrs-range-wrap {
	--efrs-track-color: #d1d5db;
	--efrs-fill-color: #2563eb;
	--efrs-thumb-color: #ffffff;
	--efrs-thumb-border-color: #2563eb;
	--efrs-value-color: #111827;
	--efrs-track-height: 6px;
	--efrs-thumb-size: 22px;
	--efrs-progress: 50%;
	width: 100%;
}

.efrs-range-value-row {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	min-height: 1.75em;
	margin-bottom: 6px;
}

.efrs-range-value {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5em;
	color: var(--efrs-value-color);
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
}

.efrs-range-input {
	width: 100%;
	height: max(var(--efrs-thumb-size), 28px);
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	accent-color: var(--efrs-fill-color);
}

.efrs-range-input::-webkit-slider-runnable-track {
	width: 100%;
	height: var(--efrs-track-height);
	border: 0;
	border-radius: 999px;
	background: linear-gradient(
		to right,
		var(--efrs-fill-color) 0,
		var(--efrs-fill-color) var(--efrs-progress),
		var(--efrs-track-color) var(--efrs-progress),
		var(--efrs-track-color) 100%
	);
}

.efrs-range-input::-webkit-slider-thumb {
	width: var(--efrs-thumb-size);
	height: var(--efrs-thumb-size);
	margin-top: calc((var(--efrs-track-height) - var(--efrs-thumb-size)) / 2);
	border: 2px solid var(--efrs-thumb-border-color);
	border-radius: 50%;
	background: var(--efrs-thumb-color);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
	cursor: grab;
	appearance: none;
	-webkit-appearance: none;
}

.efrs-range-input:active::-webkit-slider-thumb {
	cursor: grabbing;
}

.efrs-range-input::-moz-range-track {
	width: 100%;
	height: var(--efrs-track-height);
	border: 0;
	border-radius: 999px;
	background: var(--efrs-track-color);
}

.efrs-range-input::-moz-range-progress {
	height: var(--efrs-track-height);
	border: 0;
	border-radius: 999px;
	background: var(--efrs-fill-color);
}

.efrs-range-input::-moz-range-thumb {
	width: var(--efrs-thumb-size);
	height: var(--efrs-thumb-size);
	border: 2px solid var(--efrs-thumb-border-color);
	border-radius: 50%;
	background: var(--efrs-thumb-color);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
	cursor: grab;
}

.efrs-range-input:active::-moz-range-thumb {
	cursor: grabbing;
}

.efrs-range-input:focus-visible {
	outline: 2px solid var(--efrs-fill-color);
	outline-offset: 4px;
}

.efrs-range-input:disabled {
	cursor: not-allowed;
	opacity: 0.55;
}

.efrs-range-limits {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 4px;
	color: var(--efrs-value-color);
	font-size: 0.8em;
	line-height: 1.2;
	opacity: 0.68;
}

@media (prefers-reduced-motion: reduce) {
	.efrs-range-input,
	.efrs-range-input::-webkit-slider-thumb,
	.efrs-range-input::-moz-range-thumb {
		transition: none !important;
	}
}

/* ==========================================================
   Optional icons for standard Elementor Pro form fields
   ========================================================== */
.efrs-icon-field {
	--efrs-icon-color: #ffffff;
	--efrs-icon-background: #111111;
	--efrs-icon-size: 13px;
	--efrs-icon-container-size: 28px;
	--efrs-icon-radius: 50%;
	--efrs-icon-inset: 8px;
	--efrs-icon-gap: 10px;
	position: relative;
	width: 100%;
	min-width: 0;
}

.efrs-icon-field > .efrs-field-icon,
.elementor-field-label.efrs-label-with-icon > .efrs-field-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--efrs-icon-container-size);
	height: var(--efrs-icon-container-size);
	min-width: var(--efrs-icon-container-size);
	min-height: var(--efrs-icon-container-size);
	border-radius: var(--efrs-icon-radius);
	background: var(--efrs-icon-background);
	color: var(--efrs-icon-color);
	font-size: var(--efrs-icon-size);
	line-height: 1;
	pointer-events: none;
}

.efrs-field-icon i,
.efrs-field-icon svg,
.efrs-field-icon .elementor-icon {
	display: block;
	width: 1em;
	height: 1em;
	font-size: 1em;
	line-height: 1;
	fill: currentColor;
	color: currentColor;
}

.efrs-icon-field > .efrs-field-icon {
	position: absolute;
	top: 50%;
	z-index: 6;
	transform: translateY(-50%);
}

.efrs-icon-field--start > .efrs-field-icon {
	inset-inline-start: var(--efrs-icon-inset);
}

.efrs-icon-field--end > .efrs-field-icon {
	inset-inline-end: var(--efrs-icon-inset);
}

.efrs-icon-field--start > input.elementor-field,
.efrs-icon-field--start > input.elementor-field-textual,
.efrs-icon-field--start > select.elementor-field,
.efrs-icon-field--start > select.elementor-field-textual,
.efrs-icon-field--start > textarea.elementor-field,
.efrs-icon-field--start > textarea.elementor-field-textual,
.efrs-icon-field--start.elementor-select-wrapper > select,
.efrs-icon-field--start .elementor-field-textual:first-of-type {
	padding-inline-start: calc(var(--efrs-icon-inset) + var(--efrs-icon-container-size) + var(--efrs-icon-gap)) !important;
}

.efrs-icon-field--end > input.elementor-field,
.efrs-icon-field--end > input.elementor-field-textual,
.efrs-icon-field--end > select.elementor-field,
.efrs-icon-field--end > select.elementor-field-textual,
.efrs-icon-field--end > textarea.elementor-field,
.efrs-icon-field--end > textarea.elementor-field-textual,
.efrs-icon-field--end.elementor-select-wrapper > select,
.efrs-icon-field--end .elementor-field-textual:first-of-type {
	padding-inline-end: calc(var(--efrs-icon-inset) + var(--efrs-icon-container-size) + var(--efrs-icon-gap)) !important;
}

/* Leave extra room for Elementor's own select caret when an icon is placed at the end. */
.efrs-icon-field--end.elementor-select-wrapper > select {
	padding-inline-end: calc(var(--efrs-icon-inset) + var(--efrs-icon-container-size) + var(--efrs-icon-gap) + 30px) !important;
}

.efrs-icon-field--textarea > .efrs-field-icon {
	top: var(--efrs-icon-inset);
	transform: none;
}

.elementor-field-label.efrs-label-with-icon {
	--efrs-icon-color: #ffffff;
	--efrs-icon-background: #111111;
	--efrs-icon-size: 13px;
	--efrs-icon-container-size: 28px;
	--efrs-icon-radius: 50%;
	--efrs-icon-gap: 8px;
	display: inline-flex;
	align-items: center;
	gap: var(--efrs-icon-gap);
}

.elementor-field-label.efrs-label-with-icon.efrs-label-icon--end {
	flex-direction: row-reverse;
	justify-content: flex-end;
}

@media (prefers-reduced-motion: reduce) {
	.efrs-field-icon {
		transition: none !important;
	}
}
