@use 'variables' as *;

@mixin rating-container-properties($svg-font-size, $svg-line-height, $label-font-size, $label-line-height, $reset-icon-font-size) {
  .e-rating-item-container {
    &:has(svg) {
      line-height: $svg-line-height;
    }
    font-size: $svg-font-size;
  }

  .e-rating-label {
    font-size: $label-font-size;
    line-height: $label-line-height;
  }

  .e-reset {
    font-size: $reset-icon-font-size;
  }
}

@include export-module('rating-bigger') {

  .e-bigger.e-rating-container,
  .e-bigger .e-rating-container {
    @include rating-container-properties($rating-bigger-li-font-size, $rating-bigger-li-line-height, $rating-bigger-label-font-size, $rating-bigger-label-line-height, $rating-bigger-reset-font-size);
  }

  .e-bigger.e-small.e-rating-container,
  .e-bigger.e-small .e-rating-container,
  .e-bigger .e-small.e-rating-container,
  .e-small .e-bigger.e-rating-container {
    @include rating-container-properties($rating-bigger-small-li-font-size, $rating-bigger-small-li-line-height, $rating-bigger-small-label-font-size, $rating-bigger-small-label-line-height, $rating-bigger-small-reset-font-size);
  }
}