:root {
	--gsuiSlider-lineColor: #fff;
	--gsuiSlider-lineBgColor: #000;
}

.gsuiSlider {
	width: 100%;
	height: 100%;
	position: relative;
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.gsuiSlider .gsui-eventCatcher {
	position: absolute;
	top: -10px;
	left: -10px;
	right: -10px;
	bottom: -10px;
	border-radius: 9999px; /* not 50% */
}

.gsuiSlider input,
.gsuiSlider.gsui-linear svg,
.gsuiSlider.gsui-circular .gsui-line {
	display: none;
}

.gsuiSlider.gsui-x .gsui-lineColor { height: 100% !important; top: 0 !important; }
.gsuiSlider.gsui-y .gsui-lineColor { width: 100% !important; left: 0 !important; }
.gsuiSlider.gsui-x .gsui-thumb { bottom: 50% !important; }
.gsuiSlider.gsui-y .gsui-thumb { left: 50% !important; }

.gsuiSlider .gsui-line {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: var( --gsuiSlider-lineBgColor );
}
.gsuiSlider .gsui-lineColor {
	position: absolute;
	background-color: var( --gsuiSlider-lineColor );
}

.gsuiSlider svg {
	width: 100%;
	height: 100%;
}
.gsuiSlider .gsui-svgLine,
.gsuiSlider .gsui-svgLineColor {
	fill: none;
	transform-origin: center;
}
.gsuiSlider .gsui-svgLine { stroke: var( --gsuiSlider-lineBgColor ); }
.gsuiSlider .gsui-svgLineColor { stroke: var( --gsuiSlider-lineColor ); }