// Add percentage of white to a color
@function tint($color, $percent) {
    @return mix(white, $color, $percent);
}

// Add percentage of black to a color
@function shade($color, $percent) {
    @return mix(black, $color, $percent);
}

@function _linear-positions-parser($pos) {
    $type: type-of(nth($pos, 1));
    $spec: null;
    $degree: null;
    $side: null;
    $corner: null;
    $length: length($pos);
    // Parse Side and corner positions
    @if ($length > 1) {
        @if nth($pos, 1) == "to" { // Newer syntax
            $side: nth($pos, 2);

            @if $length == 2 { // eg. to top
                // Swap for backwards compatability
                $degree: _position-flipper(nth($pos, 2));
            }
            @else if $length == 3 { // eg. to top left
                $corner: nth($pos, 3);
            }
        }
        @else if $length == 2 { // Older syntax ("top left")
            $side: _position-flipper(nth($pos, 1));
            $corner: _position-flipper(nth($pos, 2));
        }

        @if ("#{$side} #{$corner}" == "left top") or ("#{$side} #{$corner}" == "top left") {
            $degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
        }
        @else if ("#{$side} #{$corner}" == "right top") or ("#{$side} #{$corner}" == "top right") {
            $degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
        }
        @else if ("#{$side} #{$corner}" == "right bottom") or ("#{$side} #{$corner}" == "bottom right") {
            $degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
        }
        @else if ("#{$side} #{$corner}" == "left bottom") or ("#{$side} #{$corner}" == "bottom left") {
            $degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
        }
        $spec: to $side $corner;
    }
    @else if $length == 1 {
        // Swap for backwards compatability
        @if $type == string {
            $degree: $pos;
            $spec: to _position-flipper($pos);
        }
        @else {
            $degree: -270 - $pos; //rotate the gradient opposite from spec
            $spec: $pos;
        }
    }
    $degree: unquote($degree + ",");
    $spec:   unquote($spec + ",");
    @return $degree $spec;
}

@function _position-flipper($pos) {
    @return if($pos == left, right, null)
    if($pos == right, left, null)
    if($pos == top, bottom, null)
    if($pos == bottom, top, null);
}


@mixin placeholder {
    $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
    @each $placeholder in $placeholders {
        &:#{$placeholder}-placeholder {
            @content;
        }
    }
}

@mixin linear-gradient($pos, $G1, $G2: null,
                       $G3: null, $G4: null,
                       $G5: null, $G6: null,
                       $G7: null, $G8: null,
                       $G9: null, $G10: null,
                       $fallback: null) {
    // Detect what type of value exists in $pos
    $pos-type: type-of(nth($pos, 1));
    $pos-spec: null;
    $pos-degree: null;

    // If $pos is missing from mixin, reassign vars and add default position
    @if ($pos-type == color) or (nth($pos, 1) == "transparent")  {
        $G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
        $G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
        $pos: null;
    }

    @if $pos {
        $positions: _linear-positions-parser($pos);
        $pos-degree: nth($positions, 1);
        $pos-spec:   nth($positions, 2);
    }

    $full: $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10;

    // Set $G1 as the default fallback color
    $fallback-color: nth($G1, 1);

    // If $fallback is a color use that color as the fallback color
    @if (type-of($fallback) == color) or ($fallback == "transparent") {
        $fallback-color: $fallback;
    }

    background-color: $fallback-color;
    background-image: -webkit-linear-gradient($pos-degree $full); // Safari 5.1+, Chrome
    background-image: unquote("linear-gradient(#{$pos-spec}#{$full})");
}