@function calculate-rem($size) {
  @if $size == "auto" {
    @return auto;
  }
  $rem-size: $size / 10px;
  @return #{$rem-size}rem;
}

@mixin _font-size($size) {
  font-size: calculate-rem($size);
}

@mixin _line-height($height) {
  line-height: calculate-rem($height);
}

@mixin _padding($padding-top, $padding-right, $padding-bottom, $padding-left) {
  padding: calculate-rem($padding-top) calculate-rem($padding-right)
    calculate-rem($padding-bottom) calculate-rem($padding-left);
}

@mixin _margin($margin-top, $margin-right, $margin-bottom, $margin-left) {
  margin: calculate-rem($margin-top) calculate-rem($margin-right)
    calculate-rem($margin-bottom) calculate-rem($margin-left);
}

@mixin _margin-top($margin-top) {
  margin-top: calculate-rem($margin-top);
}

@mixin _margin-bottom($margin-bottom) {
  margin-bottom: calculate-rem($margin-bottom);
}

@mixin _margin-right($margin-right) {
  margin-right: calculate-rem($margin-right);
}

@mixin _margin-left($margin-left) {
  margin-left: calculate-rem($margin-left);
}

@mixin _top($top) {
  top: calculate-rem($top);
}

@mixin _border-radius(
  $radius-top-left,
  $radius-top-right,
  $radius-bottom-right,
  $radius-bottom-left
) {
  border-radius: calculate-rem($radius-top-left)
    calculate-rem($radius-top-right) calculate-rem($radius-bottom-right)
    calculate-rem($radius-bottom-left);
}

@mixin _border-radius-all($radius) {
  border-radius: calculate-rem($radius) calculate-rem($radius)
    calculate-rem($radius) calculate-rem($radius);
}

@mixin _box-shadow($h-offset, $v-offset, $blur, $spread, $color) {
  box-shadow: calculate-rem($h-offset) calculate-rem($v-offset)
    calculate-rem($blur) calculate-rem($spread) $color;
}

@mixin _column-gap($gap) {
  column-gap: calculate-rem($gap);
}

@mixin _gap($gap) {
  gap: calculate-rem($gap);
}

@mixin material-shadow() {
  box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.14),
    0px 1px 18px 0px rgba(0, 0, 0, 0.12), 0px 3px 5px 0px rgba(0, 0, 0, 0.2);
}
