/* xl - DESKTOP STYLES */
.confirmation-wrapper {
  display: flex;
  flex-direction: column;
  align-items: left;
  margin: 2rem 0;
}
.circle-loader {
  position: relative;
  display: inline-block;
  width: 5em;
  height: 5em;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-left-color: #5cb85c;
  border-radius: 50%;
  animation: loader-spin 1.2s linear forwards, hide-border 0s forwards;
  animation-delay: 0s, 1.2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.circle-loader::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid #5cb85c;
  opacity: 0;
  animation: show-border 0s forwards;
  animation-delay: 1.2s;
}
.checkmark {
  display: block;
}
.checkmark.draw::after {
  animation: checkmark 800ms ease forwards;
  animation-delay: 1.2s;
  content: "";
  position: absolute;
  top: 2.5em;
  left: 1.25em;
  height: 0;
  width: 0;
  opacity: 0;
  transform: scaleX(-1) rotate(135deg);
  transform-origin: left top;
  border-right: 2px solid #5cb85c;
  border-top: 2px solid #5cb85c;
}
.confirmation-message {
  opacity: 0;
  transform: translateY(10px);
  animation: show-message 0.6s ease forwards;
  animation-delay: calc(1.2s + 0.6s);
  font-size: 17px;
  padding-top: 15px;
}
@keyframes loader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(720deg);
  }
}
@keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 1.25em;
    opacity: 1;
  }
  40% {
    height: 2.5em;
    width: 1.25em;
    opacity: 1;
  }
  100% {
    height: 2.5em;
    width: 1.25em;
    opacity: 1;
  }
}
@keyframes show-border {
  to {
    opacity: 1;
  }
}
@keyframes hide-border {
  to {
    border-color: transparent;
  }
}
@keyframes show-message {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fill-circle {
  to {
    background-color: #5cb85c;
  }
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sourceRoot%22%3A%22%2F%22%2C%22sources%22%3A%5B%22(stdin)%22%2C%22wp-content%2Fcustom_codes%2F52-scss-desktop.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAAA%3BACeA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaF%3BAAAA%3BAAAA%3BAAGE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAkBF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAUA%3BAACE%3BAAAA%3BAAAA%3BAACA%3BAAAA%3BAAAA%3BAAAA%3BAAGF%3BAACE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAACA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAACA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAACA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAGF%3BAACE%3BAAAA%3BAAAA%3BAAAA%3BAAGF%3BAACE%3BAAAA%3BAAAA%3BAAAA%3BAAGF%3BAACE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMF%3BAACE%3BAAAA%3BAAAA%3BAAAA%22%7D */