@use '../variables/color';

$shadow-color-light: rgba(color.$black, .2);
$shadow-color-dark: rgba(color.$black, .4);

@mixin shadow-default {
  box-shadow: 1px 1px 1px $shadow-color-light;
}

@mixin shadow-none {
  box-shadow: none;
}

@mixin shadow-top {
  // HACK: Shadow does not meet style requirements 100 percent.
  box-shadow: 0 -2px 4px -2px $shadow-color-dark;
}

@mixin shadow-left {
  // HACK: Shadow does not meet style requirements 100 percent.
  box-shadow: 0 0 2px 0 $shadow-color-dark;
}

@mixin shadow-bottom {
  // HACK: Shadow does not meet style requirements 100 percent.
  box-shadow: 0 2px 4px $shadow-color-dark;
}