@use "sass:map";
@use "sass:meta";

@use 'variables' as *;

@mixin admin-sticky-fix($offset: 0) {
  $narrow-offset: 46px;
  $wide-offset: 32px;
  @if $offset != 0 and meta.type-of($offset) == 'number' {
    $narrow-offset: $narrow-offset + $offset;
    $wide-offset: $wide-offset + $offset;
  }
  .admin-bar & {
    top: $narrow-offset !important;
    @media screen and (min-width: 783px) {
      top: $wide-offset !important;
    }
  }
}

// scale will drop small + medium widths by the number of pixels specified.
// usually you this will be negative values. Ex. -2
@mixin image-max-height($sm: 24px, $md: 24px, $lg: 24px, $scale: 0) {
  max-height: ($sm + $scale);
  @media (min-width: $min-width-md) {
    max-height: ($md + $scale);
  }
  @media (min-width: $min-width-lg) {
    max-height: $lg;
  }
}

// get color from brand bar map
@function get-color($brand, $color-state: 'base', $map: $brand-map){
  // check color exists
  @if (map.has-key($map, $brand)) {
    $value: map.get($map, unquote($brand));
    // check if color or map
    @if meta.type-of($value) == color {
      @return $value;
    }
    // check state of color exists
    @if (map.has-key($value, $color-state)) {
      @return map.get($value, $color-state);
    }
  } 
  // else do nothing
  @return null;
}