.bx-im-elements-loader__container {
	position: relative;
}

.bx-im-elements-spinner__scope {
	--im-elements-spinner__border-color_spinner-blue: #00ace3;
	--im-elements-spinner__border-color_spinner-grey: #c0c3c8;
	--im-elements-spinner__border-color_spinner-copilot: #8e52ec;
	--im-elements-spinner__border-color_spinner-white: #fff;
	--im-elements-spinner__border-color_spinner-main-primary: #0075ff;
}

.bx-im-elements-spinner__container {
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1 0 auto;
}

.bx-im-elements-spinner__spinner {
	opacity: 0.2;
	border-radius: 50%;
	border-style: solid;
	border-color:
		var(--im-elements-spinner__border-color_spinner-blue)
		var(--im-elements-spinner__border-color_spinner-blue)
		var(--im-elements-spinner__border-color_spinner-blue)
		transparent
;
	animation: spinner-animation 1s infinite linear;
}

.bx-im-elements-spinner__spinner.--color-grey {
	opacity: 1;
	border-top-color: var(--im-elements-spinner__border-color_spinner-grey);
	border-right-color: var(--im-elements-spinner__border-color_spinner-grey);
	border-bottom-color: var(--im-elements-spinner__border-color_spinner-grey);
}

.bx-im-elements-spinner__spinner.--color-white {
	opacity: 1;
	border-top-color: var(--im-elements-spinner__border-color_spinner-white);
	border-right-color: var(--im-elements-spinner__border-color_spinner-white);
	border-bottom-color: var(--im-elements-spinner__border-color_spinner-white);
}

.bx-im-elements-spinner__spinner.--color-copilot {
	opacity: 1;
	border-top-color: var(--im-elements-spinner__border-color_spinner-copilot);
	border-right-color: var(--im-elements-spinner__border-color_spinner-copilot);
	border-bottom-color: var(--im-elements-spinner__border-color_spinner-copilot);
}

.bx-im-elements-spinner__spinner.--color-main-primary {
	opacity: 1;
	border-top-color: var(--im-elements-spinner__border-color_spinner-main-primary);
	border-right-color: var(--im-elements-spinner__border-color_spinner-main-primary);
	border-bottom-color: var(--im-elements-spinner__border-color_spinner-main-primary);
}

.bx-im-elements-spinner__spinner.--size-xxs {
	width: 16px;
	height: 16px;
	border-width: 2px;
}

.bx-im-elements-spinner__spinner.--size-xs {
	width: 22px;
	height: 22px;
	border-width: 2px;
}

.bx-im-elements-spinner__spinner.--size-m {
	width: 38px;
	height: 38px;
	border-width: 3px;
}

.bx-im-elements-spinner__spinner.--size-s {
	width: 60px;
	height: 60px;
	border-width: 4px;
}

.bx-im-elements-spinner__spinner.--size-l {
	width: 106px;
	height: 106px;
	border-width: 5px;
}

@keyframes spinner-animation {
	to {
		transform: rotate(1turn)
	}
}

.bx-im-elements-line-loader__container {
	width: 50px;
	height: 16px;
	display: flex;
	align-items: center;
}

.bx-im-elements-line-loader__content {
	position: relative;

	width: 100%;
	height: 5px;
	border-radius: 98px;
	overflow: hidden;
}
.bx-im-elements-line-loader__content::after {
	content: '';
	width: 40%;
	height: 5px;
	background: var(--im-color-palette-gray-10);
	position: absolute;
	top: calc(50% - 3px);
	left: 0;
	border-radius: 10px;
	animation: line-loader 1s ease-in-out infinite;
}

@keyframes line-loader {
	0% {
		left: 0;
		transform: translateX(-100%);
	}
	100% {
		left: 100%;
		transform: translateX(0);
	}
}
.bx-im-elements-loader-shimmer__container {
	--im-elements-loader-shimmer__background: linear-gradient(
		90deg,
		rgba(237, 238, 240, 0) 0%,
		rgba(210, 216, 227, 0.68) 50%,
		rgba(221, 225, 233, 0) 100%
	);

	width: 100%;
	height: 100%;
	border-radius: 6px;
	pointer-events: none;
	background: var(--im-elements-loader-shimmer__background);
	background-size: 200% 100%;
	animation: bx-im-elements-loader-shimmer 3s linear infinite;
}

@keyframes bx-im-elements-loader-shimmer {
	0% { background-position: -200% 0; }
	100% { background-position: 200% 0; }
}
