//
// Form Group
// --------------------------------------------------
.form-group {
    margin-bottom: $spacer;
}
fieldset.form-group {
    > *:last-child {
        margin-bottom: 0;
    }
}
.form-inline {
    display: block;
    .form-group {
        display: block;
        margin-bottom: $spacer;
    }
    .control-label {
        display: inline-block;
        margin-bottom: .5rem;
    }
    .form-control {
        display: block;
        width: 100%;
    }
}

//
// Actions
// --------------------------------------------------
.form-actions {
    margin-top: $spacer;
}

//
// Inputs
// --------------------------------------------------
.input {
    display: block;
}
input[type="file"] {
    @extend .form-control;
    &::file-selector-button {
        padding: $input-padding-y $input-padding-x;
        margin: (-$input-padding-y) (-$input-padding-x);
        margin-inline-end: $input-padding-x;
        pointer-events: none;
        border-color: inherit;
        border-style: solid;
        border-width: 0;
        border-inline-end-width: $input-border-width;
        border-radius: 0;
    }
    &::-webkit-file-upload-button {
        padding: $input-padding-y $input-padding-x;
        margin: (-$input-padding-y) (-$input-padding-x);
        margin-inline-end: $input-padding-x;
        pointer-events: none;
        border-color: inherit;
        border-style: solid;
        border-width: 0;
        border-inline-end-width: $input-border-width;
        border-radius: 0;
    }
}
.form-check-label {
    input[type="checkbox"],
    input[type="radio"] {
        @extend .form-check-input;
    }
}
.radio {
    @extend .form-check;
    label {
        margin-bottom: 0;
    }
    margin-bottom: .125rem;
}

//
// Validation & Help
// --------------------------------------------------
.help-block {
    @extend .form-text;
    &.error {
        @extend .invalid-feedback;
    }
    &.success {
        @extend .valid-feedback;
    }
}
$compat-form-invalid-validation-state: map-get($form-validation-states, "invalid");
$compat-form-invalid-validation-state-color: map-get($compat-form-invalid-validation-state, "color");
$compat-form-invalid-validation-state-icon: map-get($compat-form-invalid-validation-state, "icon");
.form-control.error {
    border-color: $compat-form-invalid-validation-state-color;
    @if $enable-validation-icons {
        padding-right: $input-height-inner;
        background-image: escape-svg($compat-form-invalid-validation-state-icon);
        background-repeat: no-repeat;
        background-position: right $input-height-inner-quarter center;
        background-size: $input-height-inner-half $input-height-inner-half;
    }
    &:focus {
        border-color: $compat-form-invalid-validation-state-color;
        box-shadow: 0 0 0 $input-focus-width rgba($compat-form-invalid-validation-state-color, .25);
    }
}
textarea.form-control.error {
    @if $enable-validation-icons {
        padding-right: $input-height-inner;
        background-position: top $input-height-inner-quarter right $input-height-inner-quarter;
    }
}
.has-error {
    .help-block {
        &.error,
        &.success {
            display: block;
        }
    }
}
