.modal-popup {
  button,
  a.beyer-button {
    margin-left: 0;
  }

  .beyer-button:not(.beyer-button--small),
  beyer-button:not([small]) button {
    .lt-sm({ width: 100%; });
  }

  legend {
    .h6;

    .gt-lg({ strong {
      .h4;
    } });
  }

  input[type="text"],
  input[type="email"],
  input[type="password"] {
    .form-control;

    .lt-sm({ width: 100%; });

    .gt-sm({ width: 50%; });
  }

  select {
    .form-select;
  }

  form[data-hasrequired],
  fieldset[data-hasrequired] {
    &::after {
      .p5;

      color: @black-60;
      content: attr(data-hasrequired);
      display: inline-block;
      margin-top: @default--space;
    }
  }

  .field {
    &:not(:first-child),
    & .nested {
      margin-top: @default--space;
    }

    &:not(.choice) label {
      .h8;

      color: @black-40;
    }

    &.required {
      &:not(.choice) label {
        span::after {
          content: '*';
          display: inline-block;
        }
      }
    }
  }
}
