/*!*****************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./assets/src/authentication.scss ***!
  \*****************************************************************************************************************************************************/
:root {
  --auth-bg-color: rgba(0, 0, 0, 0.5);
  --auth-container-bg: #ffffff;
  --auth-text-color: #1a1a1a;
  --auth-input-bg: #f5f5f5;
  --auth-input-border: #e0e0e0;
  --auth-input-text: #1a1a1a;
  --auth-input-placeholder: #757575;
  --auth-input-icon: #757575;
  --auth-label-color: #424242;
  --auth-link-color: black;
  --auth-link-hover: lighten(black, 10%);
  --auth-error-bg: #ffebee;
  --auth-error-border: #e53935;
  --auth-error-text: #c62828;
  --auth-success-bg: #e8f5e9;
  --auth-success-border: #43a047;
  --auth-success-text: #2e7d32;
  --auth-info-bg: #e3f2fd;
  --auth-info-border: #2196f3;
  --auth-info-text: #1565c0;
  --auth-checkbox-bg: #ffffff;
  --auth-checkbox-border: #9e9e9e;
  --auth-checkbox-checked-bg: #4caf50;
  --auth-checkbox-checked-border: #2e7d32;
  --auth-checkbox-checkmark: #ffffff;
  --auth-secondary-button-bg: transparent;
  --auth-secondary-button-border: rgba(0, 0, 0, 0.12);
  --auth-secondary-button-hover: rgba(0, 0, 0, 0.04);
  --auth-secondary-button-text: #1a1a1a;
  --auth-primary-spinner-border: rgba(255, 255, 255, 0.5);
  --auth-primary-spinner-border-left: #fff;
  --auth-secondary-spinner-border: rgba(26, 26, 26, 0.2);
  --auth-secondary-spinner-border-left: #1a1a1a;
  --auth-hint-text: #757575;
}

.authentication {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}
.authentication--dark {
  --auth-bg-color: rgba(0, 0, 0, 0.5);
  --auth-container-bg: #14171c;
  --auth-text-color: #ffffff;
  --auth-input-bg: #1e2128;
  --auth-input-border: #1e2128;
  --auth-input-text: #ffffff;
  --auth-input-placeholder: #9da3af;
  --auth-input-icon: #9da3af;
  --auth-label-color: #A1A7B4;
  --auth-link-color: #A1A7B4;
  --auth-link-hover: #ffffff;
  --auth-error-bg: rgba(231, 76, 60, 0.2);
  --auth-error-border: #e74c3c;
  --auth-error-text: #e74c3c;
  --auth-success-bg: rgba(46, 204, 113, 0.2);
  --auth-success-border: #2ecc71;
  --auth-success-text: #2ecc71;
  --auth-info-bg: rgba(52, 152, 219, 0.2);
  --auth-info-border: #3498db;
  --auth-info-text: #3498db;
  --auth-checkbox-bg: #1e2128;
  --auth-checkbox-border: #9da3af;
  --auth-checkbox-checked-bg: #4caf50;
  --auth-checkbox-checked-border: #4caf50;
  --auth-checkbox-checkmark: #ffffff;
  --auth-secondary-button-bg: transparent;
  --auth-secondary-button-border: rgba(255, 255, 255, 0.2);
  --auth-secondary-button-hover: rgba(255, 255, 255, 0.1);
  --auth-secondary-button-text: #ffffff;
  --auth-primary-spinner-border: rgba(255, 255, 255, 0.5);
  --auth-primary-spinner-border-left: #fff;
  --auth-secondary-spinner-border: rgba(255, 255, 255, 0.2);
  --auth-secondary-spinner-border-left: #fff;
  --auth-hint-text: #9da3af;
}
.authentication.is-active {
  display: block;
}
.authentication__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--auth-bg-color);
  z-index: 1001;
}
.authentication__container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 360px;
  background-color: var(--auth-container-bg);
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  z-index: 1002;
  color: var(--auth-text-color);
  padding: 24px;
}
.authentication__header {
  display: flex;
  padding: 0;
  border-bottom: none;
  margin-bottom: 16px;
}
.authentication__title {
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  margin: 0;
  color: var(--auth-text-color);
}
.authentication__close-button {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--auth-input-icon);
  padding: 5px;
  display: flex;
  position: absolute;
  right: 12px;
  top: 12px;
}
.authentication__close-button:hover {
  color: var(--auth-text-color);
}
.authentication__close-button svg {
  width: 24px;
  height: 24px;
}
.authentication__close-button svg path {
  fill: currentColor;
}
.authentication__body {
  padding: 0;
}
.authentication__message-wrapper {
  position: relative;
  margin-bottom: 10px;
}
.authentication__message-container {
  margin-bottom: 15px;
}
.authentication__message {
  padding: 10px 15px;
  border-radius: 4px;
  font-size: 14px;
}
.authentication__message.success {
  background-color: var(--auth-success-bg);
  border: 1px solid var(--auth-success-border);
  color: var(--auth-success-text);
}
.authentication__message.error {
  background-color: var(--auth-error-bg);
  border: 1px solid var(--auth-error-border);
  color: var(--auth-error-text);
}
.authentication__message.info {
  background-color: var(--auth-info-bg);
  border: 1px solid var(--auth-info-border);
  color: var(--auth-info-text);
}
.authentication__resend-link {
  display: block;
  text-align: right;
  color: var(--auth-link-color);
  font-size: 14px;
  margin-top: 5px;
  text-decoration: none;
}
.authentication__resend-link:hover {
  text-decoration: underline;
}
.authentication__form-note {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: var(--auth-label-color);
  margin-bottom: 16px;
}
.authentication__form-group {
  margin-bottom: 16px;
}
.authentication__form-group .help-block {
  color: var(--auth-error-text);
  font-size: 14px;
  margin-top: 6px;
}
.authentication__form-group.has-error .authentication__input {
  background-color: var(--auth-error-bg);
  box-shadow: 0 0 0 1px var(--auth-error-border);
}
.authentication__form-group.has-error .authentication__input:focus {
  box-shadow: 0 0 0 2px var(--auth-error-border);
}
.authentication__form-group.has-error .authentication__input-icon {
  color: var(--auth-error-text);
}
.authentication__input-wrapper {
  position: relative;
  margin-bottom: 16px;
}
.authentication__input-icon {
  position: absolute;
  top: 12px;
  left: 12px;
  color: var(--auth-input-icon);
  display: flex;
  pointer-events: none;
}
.authentication__input-icon svg {
  width: 24px;
  height: 24px;
}
.authentication__input {
  width: 100%;
  padding: 0 16px 0 42px;
  height: 48px;
  background-color: var(--auth-input-bg);
  border: 1px solid var(--auth-input-border);
  border-radius: 8px;
  color: var(--auth-input-text);
  font-size: 16px;
  caret-color: #7CAF00;
}
.authentication__input:focus {
  outline: none;
  box-shadow: 0 0 0 1px #7CAF00;
}
.authentication__input:-webkit-autofill {
  box-shadow: 0 0 0 1000px var(--auth-input-bg) inset !important;
  -webkit-text-fill-color: var(--auth-input-text) !important;
  caret-color: var(--auth-input-text) !important;
}
.authentication__input::placeholder {
  color: var(--auth-input-placeholder);
}
.authentication__password-hint {
  font-size: 12px;
  color: var(--auth-hint-text);
  margin-top: 4px;
  margin-bottom: 12px;
  padding-left: 2px;
}
.authentication__terms-text {
  font-size: 14px;
  color: var(--auth-label-color);
  margin: 16px 0;
  text-align: center;
}
.authentication__terms-link {
  color: var(--auth-link-color);
  text-decoration: underline;
}
.authentication__terms-link:hover {
  color: var(--auth-link-hover);
}
.authentication__remember-me {
  margin-bottom: 16px;
}
.authentication__remember-me .form-group {
  margin-bottom: 0;
}
.authentication__remember-me label {
  color: var(--auth-label-color);
  font-size: 14px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.authentication__remember-me input[type=checkbox] {
  margin-right: 8px;
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background-color: var(--auth-checkbox-bg);
  border: 1px solid var(--auth-checkbox-border);
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
}
.authentication__remember-me input[type=checkbox]:checked {
  background-color: var(--auth-checkbox-checked-bg);
  border-color: var(--auth-checkbox-checked-border);
}
.authentication__remember-me input[type=checkbox]:checked:after {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 6px;
  height: 10px;
  border: solid var(--auth-checkbox-checkmark);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.authentication__remember-me input[type=checkbox]:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(124, 175, 0, 0.3);
}
.authentication__checkbox {
  margin-right: 8px;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background-color: var(--auth-checkbox-bg);
  border: 1px solid var(--auth-checkbox-border);
  position: relative;
  transition: all 0.2s ease;
}
.authentication__checkbox:checked {
  background-color: var(--auth-checkbox-checked-bg);
  border-color: var(--auth-checkbox-checked-border);
}
.authentication__checkbox:checked:after {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 6px;
  height: 10px;
  border: solid var(--auth-checkbox-checkmark);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.authentication__checkbox:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(124, 175, 0, 0.3);
}
.authentication__recaptcha-container {
  margin-bottom: 16px;
}
.authentication__recaptcha-field {
  display: flex;
  justify-content: center;
}
.authentication__primary-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  border: none;
  background-color: #7CAF00;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s;
}
.authentication__primary-button:hover {
  background-color: #6a9600;
}
.authentication__primary-button.is-loading {
  pointer-events: none;
  opacity: 0.7;
}
.authentication__primary-button.is-loading:after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  border: 2px solid var(--auth-primary-spinner-border);
  border-left-color: var(--auth-primary-spinner-border-left);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.authentication__secondary-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  font-size: 16px;
  font-weight: 600;
  color: var(--auth-secondary-button-text);
  border: 1px solid var(--auth-secondary-button-border);
  background-color: var(--auth-secondary-button-bg);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s;
  margin-top: 12px;
}
.authentication__secondary-button:hover {
  background-color: var(--auth-secondary-button-hover);
}
.authentication__secondary-button.is-loading {
  pointer-events: none;
  opacity: 0.7;
}
.authentication__secondary-button.is-loading:after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  border: 2px solid var(--auth-secondary-spinner-border);
  border-left-color: var(--auth-secondary-spinner-border-left);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.authentication__links {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
}
.authentication__alternative-link, .authentication__forgot-password-link {
  display: block;
  text-align: center;
  color: var(--auth-link-color);
  font-size: 14px;
  text-decoration: none;
  flex-grow: 1;
}
.authentication__alternative-link:hover, .authentication__forgot-password-link:hover {
  color: var(--auth-link-hover);
  text-decoration: underline;
  font-weight: 600;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/*# sourceMappingURL=authentication.bagless.css.map*/