@import 'settings';

form {
  &.card__nested-section {
    margin: 0;
    padding: 0;
    background: transparent;
    &:last-child {
      margin-bottom: 0;
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0;
    }
  }
}

// Inline forms
//
// Make forms appear inline(-block) by adding the `.form-inline` class. Inline
// forms begin stacked on extra small (mobile) devices and then go inline when
// viewports reach <768px.
//
// Requires wrapping inputs and labels with `.form-group` for proper display of
// default HTML form controls and our custom form controls (e.g., input groups).
//
// Heads up! This is mixin-ed into `.navbar-form` in navbars.less.

// [converter] extracted from `.form-inline` for libsass compatibility
@mixin form-inline {

  // Kick in the inline
  @include for-tablet-portrait-up {
    // Inline-block all the things for "inline"
    .form-item {
      display: inline-block;
      margin-bottom: 0;
      vertical-align: middle;
    }

    // In navbar-form, allow folks to *not* use `.form-group`
    .form-control {
      display: inline-block;
      width: auto; // Prevent labels from stacking above inputs in `.form-group`
      vertical-align: middle;
    }

    // Make static controls behave like regular ones
    .form-control-static {
      display: inline-block;
    }

    .input-group {
      display: inline-table;
      vertical-align: middle;

      .input-group-addon,
      .input-group-btn,
      .form-control {
        width: auto;
      }
    }

    // Input groups need that 100% width though
    .input-group > .form-control {
      width: 100%;
    }

    .control-label {
      margin-bottom: 0;
      vertical-align: middle;
    }

    // Remove default margin on radios/checkboxes that were used for stacking, and
    // then undo the floating of radios and checkboxes to match.
    .radio,
    .checkbox {
      display: inline-block;
      margin-top: 0;
      margin-bottom: 0;
      vertical-align: middle;

      label {
        padding-left: 0;
      }
    }
    .radio input[type="radio"],
    .checkbox input[type="checkbox"] {
      position: relative;
      margin-left: 0;
    }

    // Re-override the feedback icon.
    .has-feedback .form-control-feedback {
      top: 0;
    }
  }
}

.form-inline {
  @include form-inline;
  margin-bottom: $form-group-margin-bottom;

  @include for-tablet-portrait-up {

    .radio input[type="radio"],
    .checkbox input[type="checkbox"] {
      position: absolute;
    }

    .radio label,
    .checkbox label {
      padding-left: ($radio-width - 3);
      margin-right: $radio-width;
    }

  }

}

.form-item-data-policy {
  .glyphicon-spin {
    margin: -2px 0;
    vertical-align: middle;
  }

  .card__block & {
    .form-item--error-message {
      display: block;
      max-width: 23rem;
    }
    label {
      a {
        text-decoration: underline;
      }
    }
  }
}
