/* Form
   ========================================================================== */
.form {
  @include form;
  &__footer {
    @include form__footer;
  }
  &--sm {
    @include form--sm;
  }
  &--md {
    @include form--md;
  }
  &--lg {
    @include form--lg;
  }
  &--bordered {
    @include form--bordered;
    .form__footer {
      @include form__footer--bordered;
    }
  }
}

fieldset {
  @include fieldset;
}

legend {
  @include fieldset__legend;
}

.form-label {
  @include form-label;
  &.required {
    @include form-label--required;
  }
}

.form-control {
  @include form-control;
  @each $name in map_keys($form-control-sizes) {
    &--#{$name} {
      @include form-control--size($name);
    }
  }
  @each $name in map_keys($form-control-colors) {
    &--#{$name} {
      @include form-control--color($name);
    }
  }
}

select[multiple],
select[size],
textarea {
  &.form-control {
    height: auto;
  }
}

.form-control-plaintext {
  @include form-control-plaintext;
  @each $name in map_keys($form-control-sizes) {
    &--#{$name} {
      @include form-control-plaintext--size($name);
    }
  }
  @each $name in map_keys($form-control-colors) {
    &--#{$name} {
      @include form-control--color($name);
    }
  }
}

.form-control-file {
  @include form-control-file;
}

.form-check {
  @include form-check;
  &--inline {
    @include form-check--inline;
  }
  @each $name in map_keys($form-control-colors) {
    &--#{$name} {
      @include form-check--color($name);
    }
  }
}

.form-description,
.form-feedback {
  @include form-description;
}

.form-feedback {
  display: none;
}

.form-group {
  @include form-group;
  @each $name in map_keys($theme-colors) {
    &--#{$name} {
      .form-feedback,
      .form-check {
        color: theme-color($name);
      }
      .form-control {
        @include form-control--color($name);
      }
      .form-feedback {
        display: block;
      }
    }
  }
  @each $breakpoint in map-keys($grid-breakpoints) {
    @include media-breakpoint-up($breakpoint) {
      $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
      &-#{$infix}-horizontal {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        & > .form-label,
        & > [class*="form-control"],
        & > .input-group {
          flex: 0 0 auto;
          width: auto;
          max-width: none;
        }
        & > .form-label {
          margin: 0;
          padding-right: $form-grid-gutter;
        }
        & > [class*="form-control"],
        & > .input-group {
          flex-grow: 1;
          flex-shrink: 1;
        }
        & > .form-description,
        & > .form-feedback {
          flex: 0 0 100%;
          text-align: right;
        }
      }
    }
  }
}

.form-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-left: -($form-grid-gutter / 2);
  margin-right: -($form-grid-gutter / 2);
  margin-top: -$form-grid-gutter;
  & > * {
    margin-top: $form-grid-gutter;
    margin-left: ($form-grid-gutter / 2);
    margin-right: ($form-grid-gutter / 2);
  }
  .form-group {
    margin-bottom: 0;
  }
  .form-control {
    display: inline-block;
    width: auto;
    max-width: 100%;
    vertical-align: middle;
  }
}
