/**
 * Carat range inside range-value-wrapper — slider track + stepped input pills.
 *
 * Target layout (per input group):
 *   [ − ] [ + ] [ 0 ct ]     [ − ] [ + ] [ 15 ct ]
 */

.range-value-wrapper .jet-range {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.range-value-wrapper .jet-range__inputs__container {
	display: flex;
	justify-content: space-between;
	gap: 0.5rem;
	border: none;
	margin: 0;
	padding: 0;
}

.range-value-wrapper .jet-range__inputs__group {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.5rem 1rem;
	height: 2rem;
	max-width: 7rem;
	background-color: #ebefff;
	border: none;
	border-radius: 0.5rem;
	color: var(--wp--preset--color--rich-black, #1a1a1a);
}

.range-value-wrapper .jet-range__inputs__group > span {
	background: none;
	border: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

.range-value-wrapper .jet-range__inputs__group .jet-range__inputs__min,
.range-value-wrapper .jet-range__inputs__group .jet-range__inputs__max,
.range-value-wrapper .jet-range__inputs__group input[min-range],
.range-value-wrapper .jet-range__inputs__group input[max-range] {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	text-align: right;
	color: inherit;
	font: inherit;
	-webkit-appearance: textfield;
	-moz-appearance: textfield;
	appearance: textfield;
}

.range-value-wrapper .jet-range__inputs__group input::-webkit-outer-spin-button,
.range-value-wrapper .jet-range__inputs__group input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.range-value-wrapper .step-down,
.range-value-wrapper .step-up {
	flex: 0 0 auto;
	cursor: pointer;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 1.2rem;
	height: 1.2rem;
	padding: 0;
	border: none;
	font-size: 1.2rem;
	line-height: 1;
	vertical-align: baseline;
	background: transparent;
	color: var(--wp--preset--color--rich-black, #1a1a1a);
	position: relative;
	z-index: 2;
}

.range-value-wrapper .step-down {
	margin-top: -1px;
}

.range-value-wrapper .step-down:hover::before,
.range-value-wrapper .step-up:hover::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 0.6rem;
	background-color: rgba(136, 136, 136, 0.53);
	filter: blur(3px);
	z-index: 1;
}

/* Hide Jet’s text-only range readout when stepped inputs are active */
.range-value-wrapper .jet-range__inputs + .jet-range__values,
.range-value-wrapper .jet-range__inputs ~ .jet-range__values,
.range-value-wrapper .jet-range:has(.jet-range__inputs__group) .jet-range__values {
	display: none;
}

body:not(.dark-mode-on) .range-value-wrapper .jet-range .jet-range__slider__track {
	background: #ebefff !important;
}

body:not(.dark-mode-on) .range-value-wrapper .jet-range .jet-range__slider__track__range {
	background: linear-gradient(
			90deg,
			transparent var(--low),
			rgb(194, 198, 218) 0,
			rgb(194, 198, 218) var(--high),
			transparent 0
		)
		no-repeat 0 100% / 100% 100%;
}
