@use '@lucca-front/scss/src/commons/utils/color';
@use '@lucca-front/scss/src/commons/utils/a11y';

@mixin block {
	--components-loading-display: flex;
	--components-loading-margin: auto;
	--components-loading-spinnerMargin: 0 auto;
	--components-loading-textAlign: center;
	--components-loading-flexDirection: column;
}

@mixin S {
	--components-loading-size: var(--pr-t-spacings-250);
}

@mixin L {
	@include block;

	--components-loading-size: var(--components-loading-size-big);
}

@mixin invert {
	--components-loading-color: var(--palettes-neutral-0);

	&::after {
		--commons-loading-frontground: color.transparentize(var(--palettes-neutral-0), 0.66);
	}
}

@mixin popin {
	@include L;
}

@mixin drawer {
	@include popin;

	// legacy, approximate centering
	--components-loading-transform: translateY(35vh);
}

@mixin fullPage {
	@include L;

	// legacy, approximate centering
	--components-loading-margin: 0 auto;
	--components-loading-transform: translateY(35vh);
}

@mixin hiddenLabel {
	.loading-label {
		@include a11y.mask;
	}
}