@use "sass:math";

$page-width: 1290px;
$container-gutter-desktop-wide: 64px;
$page-limit: $page-width + ($container-gutter-desktop * 2);

/// Remove the unit of a length
/// @param {Number} $number - Number to remove unit from
/// @return {Number} - Unitless number
@function strip-unit($number) {
  @if type-of($number) == "number" and not unitless($number) {
    @return math.div($number, ($number * 0 + 1));
  }

  @return $number;
}

@mixin responsive-font(
  $min-size: $font-size-min,
  $size: $font-size,
  $limit: $page-limit
) {
  $scale-font-enable: global-variable-exists(scale);

  $unitless-min: strip-unit($min-size);
  $unitless-size: strip-unit($size);
  $baseline: strip-unit($min-mobile);
  $font-multiplier: math.div(
    ($unitless-size - $unitless-min),
    (strip-unit($limit) - $baseline)
  );
  $font-baseline: ($unitless-min - $font-multiplier * $baseline);

  @if $unitless-min >= $unitless-size {
    @warn 'Responsive font: min-size equal or greater than size';
  }

  font-size: #{$unitless-min}px;

  @if $scale-font-enable == true {
    font-size: calc(#{$unitless-min}px * #{var(--scale-font)});
  }

  @media (min-width: $min-mobile) {
    font-size: #{$unitless-min}px;

    @if $scale-font-enable == true {
      font-size: calc(
        (#{$font-multiplier} * #{100vw} + (#{$font-baseline}px)) *
          #{var(--scale-font)}
      );
    } @else {
      font-size: calc((#{$font-multiplier} * #{100vw} + (#{$font-baseline}px)));
    }
  }

  @media (min-width: $limit) {
    font-size: #{$unitless-size}px;

    @if $scale-font-enable == true {
      font-size: calc(#{$unitless-size}px * #{var(--scale-font)});
    }
  }
}

// Alias for responsive-font mixin
@mixin rf($args...) {
  @include responsive-font($args...);
}
