@use './mixins' as mix;

mat-icon.gm {
	&-icon {
	color: var(--form-icon-color);
	flex-shrink: 0;

    --mat-icon-button-icon-size: 20px;
		@include mix.image-size(20px);

		&-12 {
      --mat-icon-button-icon-size: 12px;
			@include mix.image-size(12px);
		}

		&-16 {
      --mat-icon-button-icon-size: 16px;
			@include mix.image-size(16px);
		}

		&-24 {
      --mat-icon-button-icon-size: 24px;
			@include mix.image-size(24px);
		}

		&-30 {
      --mat-icon-button-icon-size: 30px;
			@include mix.image-size(30px);
		}

		&-pointer {
			&:hover {
				cursor: pointer;
				color: var(--color-400);
			}
		}

		&-danger {
			color: var(--color-error-850);
			&.gm-icon-pointer {
				&:hover {
					color: var(--color-error-900);
				}
			}
		}

		&-success {
			color: var(--color-success-400);
			&.gm-icon-pointer {
				&:hover {
					color: var(--color-success-500);
				}
			}
		}

		&.p-r-10 {
			padding-right: 10px;
		}

		&.p-l-10 {
			padding-left: 10px;
		}

		&.p-r-5 {
			padding-right: 5px;
		}

		&.p-l-5 {
			padding-left: 5px;
		}
	}
}

.gm-logo-icon {
	color: var(--logo-color);
}

.svg-icon-rollup {
  transform: rotate(180deg);
}

#mask1_2179_1511, #mask0_3090_1865, #progressMask, #mask0_3840_29428, #mask0_4288_613 {
  mask-type: alpha;
}

#mask0_6561_1975 {
  mask-type: luminance;
}
