@use "../../../../styles/tools/generate";
@use "../../styles/mixins" as commonMixins;
@use "./config";
@use "./mixins";

@layer components {
  .radio {
    @include commonMixins.radiocheck-input();
    @include commonMixins.radiocheck-states(
      $config: config.$states,
      $display-selector: ".radio-display"
    );

    @each $size, $values in config.$sizes {
      &#{generate.variant-name($size)},
      &#{generate.variant-name($size)} + .radio-display {
        @include commonMixins.radiocheck-size($size, config.$sizes);
      }
    }
  }

  .radio-display {
    @include mixins.display();
  }
}