/* ==========================================================================
 * Control
 * ========================================================================== */

@custom-selector :--control .mds-c-input, .mds-c-select, .mds-c-textarea;

:--control {
  @mixin mds-m-control;

  &--appearance {
    &-flat {
      @mixin mds-m-control--appearance-flat;
    }

    &-bordered {
      @mixin mds-m-control--appearance-bordered;
    }
  }

  &--block {
    width: var(--mds-v-control__max-width);
  }
}