/*
 * Pasek przewijania w karuzelach konfiguratora (papiery, ilość, optymalizacja).
 * Oryginalnie 2 px i tylko wskaźnik – tu: grubszy, z dużym polem chwytu.
 * Logika przeciągania: public/js/scroll-line-drag.js
 */
#gcl-configurator-root .gcl-scroll-line {
	height: 0.375rem; /* 6 px */
	border-radius: 999px;
	cursor: pointer;
	touch-action: none;
	transition: height 0.15s ease;
}

/* Niewidoczne pole chwytu ok. 32 px wysokości – bez zmiany układu strony. */
#gcl-configurator-root .gcl-scroll-line::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -0.8125rem;
	bottom: -0.8125rem;
}

#gcl-configurator-root .gcl-scroll-line:hover,
#gcl-configurator-root .gcl-scroll-line.is-dragging {
	height: 0.5rem; /* 8 px */
}

#gcl-configurator-root .gcl-scroll-line__thumb {
	border-radius: 999px;
	cursor: grab;
	transition: background-color 0.15s ease;
}

#gcl-configurator-root .gcl-scroll-line:hover .gcl-scroll-line__thumb {
	background-color: #555;
}

#gcl-configurator-root .gcl-scroll-line.is-dragging .gcl-scroll-line__thumb {
	background-color: #333;
	cursor: grabbing;
}

/* Gdy wszystko się mieści (suwak = 100%), pasek nie zaprasza do klikania. */
#gcl-configurator-root .gcl-scroll-line.is-full {
	cursor: default;
}

#gcl-configurator-root .gcl-scroll-line.is-full .gcl-scroll-line__thumb {
	cursor: default;
}

html.gcl-scroll-line-dragging,
html.gcl-scroll-line-dragging * {
	cursor: grabbing !important;
	user-select: none !important;
}