@use "../../../variables/units";
@use "../../../variables/colors";
@use "../../../variables/media-query-breakpoints";

@use "../form-group.mixins" as form-group-mixins;

.form-group.dso-radios {
  &.dso-invalid {
    .dso-selectable {
      --_dso-selectable-color: #{colors.$danger-color};
    }
  }

  &.dso-required {
    .control-label::after {
      @include form-group-mixins.form-group-required();
    }
  }

  &.dso-inline {
    --dso-selectable-display: inline-block;

    dso-selectable {
      + dso-selectable {
        margin-inline-start: units.$u3;
      }
    }
  }

  .form-horizontal & {
    &.dso-inline {
      .dso-selectable {
        margin-block-end: 0;
      }
    }

    @media screen and (min-width: media-query-breakpoints.$screen-sm-min) {
      .dso-field-container {
        padding-block-start: #{units.$padding-base-block + 1};
      }
    }
  }
}