@import "colors";

#mup-register-fields {
  display: flex;

  a {
    text-decoration: none;
  }

  #mup-buttons-wrap {
    min-width: 200px;
    max-width: 300px;
    width: 100%;
    overflow: hidden;
    margin: 0 -2px;

    div {
      width: 50%;
      padding: 0 2px 4px;
      float: right;
      box-sizing: border-box;

      button {
        width: 100%;
      }
    }
  }

  #mup-reg-fields-form {
    width: 100%;
    margin-right: 20px;
    padding: 0 20px;
    border-radius: 5px;

    #mup-reg-fields-wrap {
      label {
        display: inline-block;
        margin-bottom: 5px;
      }

      input:not([type=checkbox]) {
        display: block;
      }

      input[type=checkbox] {
        vertical-align: middle;
      }
    }

    .mup-field-wrap {
      background-color: #fff;
      margin-bottom: 10px;
      padding: 10px 20px;
      border: 1px solid $border-color;
      border-radius: 5px;

      .mup-field-settings {
        display: none;
      }

      .mup-field-actions {
        display: flex;

        a {
          margin: 0 5px;
        }

        .mup-delete-field {
          color: $error-color;
        }
      }
    }
  }
}