@import "../../styles/base/__common.scss";

.ub_progress_bar_value {
	padding-left: 5px;
	transform: translateY(5px);

	button {
		display: none;
	}

	.components-range-control__wrapper {
		width: 100px;
	}
}

.ub_progress_bar_range_toolbar_wrapper {
	@extend %flex-center-all;

	.ub_progress_bar_value {
		.components-range-control__thumb-wrapper {
			pointer-events: none !important;

			* {
				pointer-events: none !important;
			}
		}

		.components-range-control__number {
			display: none;
		}
	}

	.ub_progress_bar_range_number_input {
		@extend %flex-center-all;
		height: 100%;
		padding: 5px;

		.components-base-control__field {
			margin-bottom: 0 !important;
		}

		input {
			width: 60px !important;
		}
	}
}
.editor-styles-wrapper {
	div.ub_progress-bar[id^="block-"] {
		&:not(.rounded-circle) {
			.ub_progress-bar-container {
				.ub_progress-bar-circle {
					.ub_progress-bar-circle-path {
						stroke-linecap: butt;
					}
				}
			}
		}
	}
}

[data-type="ub/progress-bar"] .components-dropdown-menu {
	background-color: #ffffff;
	border-top: 1px solid #b5bcc2;
	border-bottom: 1px solid #b5bcc2;
}