:global(.code-mirror-wrapper:hover) .saveButtonLoading,
:global(.code-mirror-wrapper:hover) .saveButtonSuccess,
:global(.code-mirror-wrapper:hover) .saveButtonFailure {
  opacity: 1 !important;
}

.saveButtonIcons {
  position: relative;
  width: 1.125rem;
  height: 1.125rem;
}

.saveButtonIcon,
.saveButtonLoadingIcon,
.saveButtonSuccessIcon,
.saveButtonFailureIcon {
  position: absolute;
  top: 0;
  left: 0;
  fill: currentColor;
  opacity: inherit;
  width: inherit;
  height: inherit;
  transition: all 0.15s ease;
}

.saveButtonLoadingIcon {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.33);
  opacity: 0;
}

.saveButtonSuccessIcon {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.33);
  opacity: 0;
  color: #00d600;
}

.saveButtonFailureIcon {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.33);
  opacity: 0;
  color: #d60000;
}

.saveButtonLoading .saveButtonIcon,
.saveButtonSuccess .saveButtonIcon,
.saveButtonFailure .saveButtonIcon {
  transform: scale(0.33);
  opacity: 0;
}

.saveButtonLoading .saveButtonLoadingIcon,
.saveButtonSuccess .saveButtonSuccessIcon,
.saveButtonFailure .saveButtonFailureIcon {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  transition-delay: 0.075s;
}
