/**
 * SaarlandToday authentication pages.
 */

.page-wrapper .st-user-auth--register {
  box-sizing: border-box;
  width: auto;
  max-width: 100%;
  margin: 20px;
  padding: 0;
}

.page-wrapper .st-user-auth--register .st-register-form-panel {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 1.5rem;
  border: 1px solid color-mix(in srgb, var(--text, #e5e7eb) 18%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg, #111827) 88%, transparent);
  box-shadow: none !important;
}

.page-wrapper .st-user-auth--register .st-register-form-panel__title {
  margin: 0 0 1rem;
  font-family: var(--font-heading, 'Manrope', sans-serif);
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
}

.page-wrapper form.user-register-form .vertical-tabs__menu {
  display: none !important;
}

.page-wrapper form.user-register-form .vertical-tabs {
  margin: 0;
  border: 0;
}

.page-wrapper form.user-register-form .vertical-tabs__pane {
  display: block !important;
}

.page-wrapper .st-user-auth {
  margin-inline: auto;
  margin-block: 50px;
  padding-inline: 1rem;
}

.page-wrapper .st-user-auth__card {
  width: 100%;
  margin-inline: auto;
}

.page-wrapper .st-user-auth__fieldset {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  width: min(100%, 34rem);
  margin: 0 auto;
  padding: 1.5rem;
  border: 1px solid color-mix(in srgb, var(--text, #e5e7eb) 18%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg, #111827) 88%, transparent);
}

.page-wrapper .st-user-auth__form {
  width: 100%;
}

.page-wrapper .st-user-auth--login .st-user-auth__form .form-item,
.page-wrapper .st-user-auth--login .st-user-auth__form .captcha,
.page-wrapper .st-user-auth--login .st-user-auth__form .description,
.page-wrapper .st-user-auth--login .st-user-auth__form p {
  width: min(100%, 250px);
  margin-inline: auto;
}

.page-wrapper .st-user-auth--login .st-user-auth__form label,
.page-wrapper .st-user-auth--login .st-user-auth__form .description,
.page-wrapper .st-user-auth--login .st-user-auth__form p,
.page-wrapper .st-user-auth__intro,
.page-wrapper .st-user-auth__switch {
  text-align: center;
}

.page-wrapper .st-user-auth--login .st-user-auth__form input:not([type='hidden']):not([type='submit']):not([type='button']):not([type='reset']),
.page-wrapper .st-user-auth--login .st-user-auth__form select,
.page-wrapper .st-user-auth--login .st-user-auth__form textarea {
  box-sizing: border-box;
  width: 250px;
  max-width: 100%;
  margin-inline: auto;
}

.page-wrapper .st-user-auth__form .form-actions,
.page-wrapper form.user-register-form div.form-actions,
.page-wrapper .st-user-auth--register form.user-register-form div.form-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  flex-grow: 0;
}

.page-wrapper form.user-register-form div.form-actions > :is(a, button, input) {
  margin-inline: 0;
  float: none;
}

.page-wrapper form.user-register-form div.form-actions .st-register-cancel {
  order: 2;
}

.page-wrapper .st-user-auth__switch {
  margin-block: 1.25rem 0;
  text-align: center;
}

@media (min-width: 768px) {
  .page-wrapper .st-user-auth--register {
    margin: 0 100px;
  }

  .page-wrapper .st-user-auth:not(.st-user-auth--register) {
    margin-block: 100px;
  }

  .page-wrapper .st-user-auth__form .form-actions,
  .page-wrapper form.user-register-form div.form-actions {
    gap: 20px;
  }
}
