/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */

@use "sass:math";

/* This is a SCSS function, not a CSS function. This gets converted to vanilla CSS when built. */
/* stylelint-disable-next-line plugin/use-baseline */
@function calculate-fluid-style($minSizePx, $maxSizePx, $minScreenWidthPx: 320, $maxScreenWidthPx: 1440) {
  $defaultBaseSize: 16;
  $minSize: math.div($minSizePx, $defaultBaseSize) * 1rem;
  $maxSize: math.div($maxSizePx, $defaultBaseSize) * 1rem;
  $minScreenWidth: math.div($minScreenWidthPx, $defaultBaseSize) * 1rem;
  $maxScreenWidth: math.div($maxScreenWidthPx, $defaultBaseSize) * 1rem;

  @return clamp(
    #{$minSize},
    calc(
      #{$minSize} + #{math.div($maxSize - $minSize, $maxScreenWidth - $minScreenWidth)} * (100vw - #{$minScreenWidth})
    ),
    #{$maxSize}
  );
}
