.bloom-glp-weight-card {
	box-sizing: border-box;
	width: 100%;
	min-height: 460px;
	padding: 44px 32px 42px;
	display: flex;
	flex-direction: column;
	align-items: center;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 18px;
	background-color: #0000001A;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	box-shadow: 0 18px 48px rgba(5, 32, 48, 0.32);
	backdrop-filter: blur(10px);
}

.bloom-glp-weight-card *,
.bloom-glp-weight-card *::before,
.bloom-glp-weight-card *::after {
	box-sizing: border-box;
}

.bloom-glp-weight-title {
	margin: 0 0 18px;
	color: #fff;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
}

.bloom-glp-weight-value {
	min-width: 170px;
	padding: 10px 24px;
	border: 2px solid rgba(255, 255, 255, 0.32);
	border-radius: 16px;
	background-color: rgba(255, 255, 255, 0.11);
	color: #fff;
	font-size: 31px;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
	box-shadow: inset 0 1px 8px rgba(255, 255, 255, 0.08);
}

.bloom-glp-slider-wrap {
	width: 100%;
	margin: 76px 0 86px;
	position: relative;
}

.bloom-glp-weight-slider {
	--bloom-glp-progress: 0%;
	--bloom-glp-track-height: 7px;
	--bloom-glp-thumb-size: 26px;
	--bloom-glp-track-fill: #fff;
	--bloom-glp-track-empty: rgba(255, 255, 255, 0.35);
	--bloom-glp-thumb-color: #fff;
	width: 100%;
	height: calc(var(--bloom-glp-thumb-size) + 2px);
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	background: transparent;
}

.bloom-glp-weight-slider::-webkit-slider-runnable-track {
	height: var(--bloom-glp-track-height);
	border-radius: 999px;
	background: linear-gradient(
		to right,
		var(--bloom-glp-track-fill) 0%,
		var(--bloom-glp-track-fill) var(--bloom-glp-progress),
		var(--bloom-glp-track-empty) var(--bloom-glp-progress),
		var(--bloom-glp-track-empty) 100%
	);
}

.bloom-glp-weight-slider::-webkit-slider-thumb {
	width: var(--bloom-glp-thumb-size);
	height: var(--bloom-glp-thumb-size);
	margin-top: calc((var(--bloom-glp-track-height) - var(--bloom-glp-thumb-size)) / 2);
	appearance: none;
	-webkit-appearance: none;
	border: 0;
	border-radius: 50%;
	background: var(--bloom-glp-thumb-color);
	box-shadow: 0 0 0 5px rgba(55, 96, 117, 0.34);
}

.bloom-glp-weight-slider::-moz-range-track {
	height: var(--bloom-glp-track-height);
	border-radius: 999px;
	background: var(--bloom-glp-track-empty);
}

.bloom-glp-weight-slider::-moz-range-progress {
	height: var(--bloom-glp-track-height);
	border-radius: 999px;
	background: var(--bloom-glp-track-fill);
}

.bloom-glp-weight-slider::-moz-range-thumb {
	width: var(--bloom-glp-thumb-size);
	height: var(--bloom-glp-thumb-size);
	border: 0;
	border-radius: 50%;
	background: var(--bloom-glp-thumb-color);
	box-shadow: 0 0 0 5px rgba(55, 96, 117, 0.34);
}

.bloom-glp-result-box {
	width: 100%;
	min-height: 93px;
	padding: 24px 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	border-radius: 4px;
	background-color: #fff;
	color: #00645f;
	text-align: center;
	box-shadow: 0 12px 30px rgba(17, 43, 56, 0.14);
}

.bloom-glp-result-label {
	color: #00645f;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
}

.bloom-glp-result-value {
	color: #00645f;
	font-size: 48px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0;
}

@media (max-width: 520px) {
	.bloom-glp-weight-card {
		min-height: 420px;
		padding: 36px 24px 32px;
	}

	.bloom-glp-slider-wrap {
		margin: 64px 0 72px;
	}

	.bloom-glp-result-box {
		flex-direction: column;
		gap: 8px;
	}
}
