@use "sass:map";

@use "../variables";
@use "../functions" as fns;

// Generates a min-width media query at the given breakpoint
@mixin bp($breakpoint, $media: variables.$default-media-type) {
  @media #{$media} and (width >= #{fns.get-breakpoint($breakpoint)}) {
    @content;
  }
}

// Generates a max-width media query at the given `$breakpoint`.
@mixin bp-max($breakpoint, $media: variables.$default-media-type) {
  @media #{$media} and (width < #{fns.get-breakpoint($breakpoint)}) {
    @content;
  }
}

// Generates a media query constrained between `$min-bp` and `$max-bp`.
@mixin bp-min-max($min-bp, $max-bp, $media: variables.$default-media-type) {
  @media #{$media} and (#{fns.get-breakpoint($min-bp)} <= width < #{fns.get-breakpoint($max-bp)}) {
    @content;
  }
}
