:root {
  --zindex-modal: 1050;
  --modal-dialog-margin: 1rem;
  --modal-content-bg: transparent;
  --modal-content-border-width: 1px;
  --modal-content-border-color: transparent;
  --border-radius-lg: 0.3rem;
  --modal-header-padding: 1rem;
  --modal-title-line-height: 1.5;
  --modal-inner-padding: 1rem;
  --modal-footer-border-width: 1px;
  --modal-footer-border-color: transparent;
  --modal-backdrop-bg: rgba(0, 0, 0, 1);
  --modal-backdrop-opacity: 0.5;
  --modal-md: 500px;
  --modal-sm: 300px;
  --modal-lg: 800px;
  --modal-dialog-margin-y-sm-up: 1.75rem;
  --modal-content-box-shadow-xs: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --modal-content-box-shadow-sm-up: 0 0.5rem 1rem rgba(0, 0, 0, 0.2);
  --transition-fade: 0.1s ease;
  --transition-collapse: 0.35s ease;
}

/* stylelint-disable selector-no-qualifying-type */



.ui.modal {
  width: auto !important;
  background-color: transparent;
}

.login-wrapper {
  max-width: 500px;
  background: linear-gradient(7deg, #100e19 0%, #1a1628);
  border-radius: 20px !important;
  box-shadow: 0 7px 34px rgba(0, 0, 0, .45);
}

.login-container {}

.login-wrapper a.logo svg {
  width: 175px;
}

.login-container .form-element>label {
  background-color: #1b1a21 !important;
}

.login-container input {
  background-color: #1b1a21 !important;
  color: #6c6c70 !important;
}

.login-modal-header h2 {
  font-size: 18px;
  margin-bottom: 5px;
}

.login-modal-header h4 {
  color: rgb(255 255 255 / 67%);
  font-size: 12px;
}

#third-party-auth img {
  width: 20px;
}

#third-party-auth button {
  background-color: #fff;

}

.social-sign-button span {
  font-size: 12px;
}

.login-button {
  border: none !important;
  color: #000 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background-color: #ffffff !important;
  background-image: linear-gradient(356deg, rgba(58, 53, 90, 0), #ffffff) !important;
}