@use 'exports' as *;

.gauge {
	@layer components {
		@include vars;
		@include component;
	}

	@layer mods {
		&.mod-thin {
			@include thin;
		}

		&:has(.gauge-circleBackground) {
			@include circular;
		}

		// .mod-vertical is deprecated
		&.mod-vertical {
			@include vertical;

			&.mod-thin {
				@include verticalThin;
			}
		}

		&.is-zero,
		&:not([style]),
		&[style*='--components-gauge-value: 0%'] {
			@include zero;
		}

		&.is-animated {
			@include animated;
		}
	}
}