.btn {
  white-space: pre;
  height: 100%;
}

.call-me-input :deep(input) {
  min-width: 13.5rem;
  color: var(--color-gray-dark);
}

.call-me-input :deep(.ma-text-field__error-message) {
  display: none;
}

.call-me-input :deep(.ma-text-field__input--error > .icon) {
  right: 3.4rem;
}

.hasLightTheme {
  & .hl-link {
    color: var(--color-white-base);
  }
  & .call-me-input :deep(label) {
    color: var(--color-white-base);
  }
  & :deep(.indicator) {
    border: var(--color-white-base);
  }
  & .btn {
    background-color: var(--color-gray-dark);

    &:active,
    &:focus,
    &:hover {
      &:not(:disabled) {
        background-color: var(--color-gray-darker);
      }
    }
  }
}

.success {
  position: relative;
  top: -3rem;
}

.error-checkbox :deep(.indicator) {
  border: 1px solid var(--color-red-base) !important;
}

.shake-horizontal {
  animation: shake 0.8s alternate;
}

@keyframes shake {
  0%,
  100% {
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {
    transform: translateX(-10px);
  }
  20%,
  40%,
  60% {
    transform: translateX(10px);
  }
  80% {
    transform: translateX(8px);
  }
  90% {
    transform: translateX(-8px);
  }
}
