#user-form,
#user-register-form,
#user-pass,
#user-pass-reset {
  display: grid;
  gap: 50px;
}
#user-form .form-item-intro,
#user-register-form .form-item-intro,
#user-pass .form-item-intro,
#user-pass-reset .form-item-intro {
  margin: 0;
}
#user-form .form-item-info,
#user-register-form .form-item-info,
#user-pass .form-item-info,
#user-pass-reset .form-item-info {
  margin: 0;
}
#user-form .address-container-inline > .form-item,
#user-register-form .address-container-inline > .form-item,
#user-pass .address-container-inline > .form-item,
#user-pass-reset .address-container-inline > .form-item {
  display: block;
  margin-right: 0;
}
#user-form .form-item-pass .password-strength,
#user-register-form .form-item-pass .password-strength,
#user-pass .form-item-pass .password-strength,
#user-pass-reset .form-item-pass .password-strength {
  margin-top: 5px;
}
#user-form .form-item-pass .password-strength .password-strength__meter,
#user-register-form .form-item-pass .password-strength .password-strength__meter,
#user-pass .form-item-pass .password-strength .password-strength__meter,
#user-pass-reset .form-item-pass .password-strength .password-strength__meter {
  display: none;
}
#user-form .form-item-pass .password-strength .password-strength__title,
#user-register-form .form-item-pass .password-strength .password-strength__title,
#user-pass .form-item-pass .password-strength .password-strength__title,
#user-pass-reset .form-item-pass .password-strength .password-strength__title {
  font-size: var(--font-size-small);
  line-height: var(--line-height-smal);
}
#user-form .form-item-pass .password-strength .password-strength__title span,
#user-register-form .form-item-pass .password-strength .password-strength__title span,
#user-pass .form-item-pass .password-strength .password-strength__title span,
#user-pass-reset .form-item-pass .password-strength .password-strength__title span {
  font-weight: 700;
}
#user-form .form-item-pass .password-confirm-message,
#user-register-form .form-item-pass .password-confirm-message,
#user-pass .form-item-pass .password-confirm-message,
#user-pass-reset .form-item-pass .password-confirm-message {
  margin-top: 5px;
  font-size: var(--font-size-small);
  line-height: var(--line-height-smal);
}
#user-form .form-item-pass .password-confirm-message span,
#user-register-form .form-item-pass .password-confirm-message span,
#user-pass .form-item-pass .password-confirm-message span,
#user-pass-reset .form-item-pass .password-confirm-message span {
  font-weight: 700;
}
#user-form .form-item-pass .password-suggestions,
#user-register-form .form-item-pass .password-suggestions,
#user-pass .form-item-pass .password-suggestions,
#user-pass-reset .form-item-pass .password-suggestions {
  grid-column: 2 span;
  width: 100%;
  font-size: var(--font-size-small);
  line-height: var(--line-height-smal);
  color: var(--color-grey);
}
#user-form .form-item-pass .password-suggestions ul,
#user-register-form .form-item-pass .password-suggestions ul,
#user-pass .form-item-pass .password-suggestions ul,
#user-pass-reset .form-item-pass .password-suggestions ul {
  margin: 0;
  padding-left: 15px;
}
#user-form .form-item-pass .description,
#user-register-form .form-item-pass .description,
#user-pass .form-item-pass .description,
#user-pass-reset .form-item-pass .description {
  grid-column: 2 span;
  width: 100%;
}
#user-form .form-item-current-pass,
#user-register-form .form-item-current-pass,
#user-pass .form-item-current-pass,
#user-pass-reset .form-item-current-pass {
  display: none;
  margin-top: 50px;
}
#user-form .form-item .description,
#user-register-form .form-item .description,
#user-pass .form-item .description,
#user-pass-reset .form-item .description {
  margin: 5px 0 0 0;
  font-size: var(--font-size-small);
  line-height: var(--line-height-smal);
  color: var(--color-grey);
}
#user-form .form-item .description a,
#user-register-form .form-item .description a,
#user-pass .form-item .description a,
#user-pass-reset .form-item .description a {
  text-decoration: underline;
}
#user-form .field--name-field-info,
#user-register-form .field--name-field-info,
#user-pass .field--name-field-info,
#user-pass-reset .field--name-field-info {
  order: 98;
}
#user-form .field--name-field-info .form-item,
#user-register-form .field--name-field-info .form-item,
#user-pass .field--name-field-info .form-item,
#user-pass-reset .field--name-field-info .form-item {
  margin: 0 !important;
}
#user-form .field--name-field-customer-type,
#user-register-form .field--name-field-customer-type,
#user-pass .field--name-field-customer-type,
#user-pass-reset .field--name-field-customer-type {
  order: 99;
}
#user-form .field--name-field-customer-type .form-radios,
#user-register-form .field--name-field-customer-type .form-radios,
#user-pass .field--name-field-customer-type .form-radios,
#user-pass-reset .field--name-field-customer-type .form-radios {
  display: flex;
  gap: 10px 40px;
  flex-wrap: wrap;
}
#user-form .form-actions,
#user-register-form .form-actions,
#user-pass .form-actions,
#user-pass-reset .form-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  border-top: 1px solid var(--color-line);
  padding-top: 30px;
  margin-top: 0;
  order: 199;
}
#user-form .form-actions .button--danger,
#user-register-form .form-actions .button--danger,
#user-pass .form-actions .button--danger,
#user-pass-reset .form-actions .button--danger {
  order: 9;
  margin-left: auto;
  background: var(--color-red);
  color: #ffffff;
}
#user-form .form-actions .button--danger:hover,
#user-register-form .form-actions .button--danger:hover,
#user-pass .form-actions .button--danger:hover,
#user-pass-reset .form-actions .button--danger:hover {
  opacity: 0.5 !important;
}
#user-form .form-actions a.back-link,
#user-register-form .form-actions a.back-link,
#user-pass .form-actions a.back-link,
#user-pass-reset .form-actions a.back-link {
  color: var(--color-primary);
  font-weight: 700;
  border-bottom: 1px solid var(--color-primary);
  transition: color 0.5s, border-bottom 0.5s;
}
#user-form .form-actions a.back-link:hover,
#user-register-form .form-actions a.back-link:hover,
#user-pass .form-actions a.back-link:hover,
#user-pass-reset .form-actions a.back-link:hover {
  color: var(--color-secondary);
  border-bottom-color: var(--color-secondary);
}
#user-form fieldset,
#user-register-form fieldset,
#user-pass fieldset,
#user-pass-reset fieldset {
  margin: 0 !important;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"],
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"],
#user-pass fieldset[data-drupal-selector="edit-discount-groups"],
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] {
  display: none;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  column-gap: 20px;
  margin-bottom: -20px;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description {
  color: var(--color-primary);
  font-size: var(--font-size-default);
  line-height: var(--line-height-default);
  grid-column: span 1;
  margin-bottom: 20px;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show {
  text-decoration: none;
  font-weight: 700;
  color: var(--color-secondary);
  border-bottom: 1px solid var(--color-secondary);
  cursor: pointer;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show:hover,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show:hover,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show:hover,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description a.show:hover {
  color: var(--color-tertiary);
  border-bottom-color: var(--color-tertiary);
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item {
  display: none;
  position: relative;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item label,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item label,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item label,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item label {
  position: relative;
  top: auto;
  left: auto;
  padding: 0;
  margin: 0 0 5px 0;
  opacity: 1;
  font-size: 10px;
  line-height: 10px;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item input,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item input,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item input,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item input {
  padding: 15px 35px 15px 15px;
}
#user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item .field-suffix,
#user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item .field-suffix,
#user-pass fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item .field-suffix,
#user-pass-reset fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .form-item .field-suffix {
  position: absolute;
  top: 30px;
  right: 15px;
  color: var(--color-grey);
}
#user-form fieldset[data-drupal-selector="edit-field-customer-groups"] .form-checkboxes,
#user-register-form fieldset[data-drupal-selector="edit-field-customer-groups"] .form-checkboxes,
#user-pass fieldset[data-drupal-selector="edit-field-customer-groups"] .form-checkboxes,
#user-pass-reset fieldset[data-drupal-selector="edit-field-customer-groups"] .form-checkboxes {
  display: flex;
  gap: 10px 40px;
  flex-wrap: wrap;
}
form.opl-user-activate-form fieldset[data-drupal-selector="edit-customer-groups"] {
  margin-top: 50px !important;
}
form.opl-user-activate-form fieldset[data-drupal-selector="edit-customer-groups"] .form-checkboxes {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}
/* >= 500px */
@media screen and (min-width: 500px) {
  #user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper,
  #user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
  #user-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description,
  #user-register-form fieldset[data-drupal-selector="edit-discount-groups"] .fieldset-wrapper > .description {
    grid-column: span 2;
  }
}
