// ---- CSS3 SASS MIXINS ----
// https://github.com/madr/css3-sass-mixins
//  
//  Copyright (C) 2011 by Anders Ytterström
//  
//  Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to deal
//  in the Software without restriction, including without limitation the rights
//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
//  copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
//  The above copyright notice and this permission notice shall be included in
//  all copies or substantial portions of the Software.
//
//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
//  THE SOFTWARE.
//

// ---- LEGACY IE SUPPORT USING FILTERS ----
//  Should IE filters be used or not?
//  PROS: gradients, drop shadows etc will be handled by css.
//  CONS: will harm the site performance badly, 
//        especially on sites with heavy rendering and scripting. 
$useIEFilters: 0; 
// might be 0 or 1. disabled by default.
// ---- /LEGACY IE SUPPORT USING FILTERS ----

@mixin background-size($value) {
  -webkit-background-size: $value;
  background-size: $value;
}

@mixin border-image($path, $offsets, $repeats) {
  -moz-border-image: $path $offsets $repeats;
  -o-border-image: $path $offsets $repeats;
  -webkit-border-image: $path $offsets $repeats;
  border-image: $path $offsets $repeats;
}

@mixin border-radius($values...) {
  -moz-border-radius: $values;
  -webkit-border-radius: $values;
  border-radius: $values;
  /*-moz-background-clip: padding;
-webkit-background-clip: padding-box;
       background-clip: padding-box;*/
}

@mixin box-shadow($values...) {
  -moz-box-shadow: $values;
  -webkit-box-shadow: $values;
  box-shadow: $values;
}

//@mixin box-shadow ($x, $y, $offset, $hex, $ie: $useIEFilters, $inset: null, $spread:null) {
//     -moz-box-shadow: $x $y $offset $spread $hex $inset;
//  -webkit-box-shadow: $x $y $offset $spread $hex $inset;
//          box-shadow: $x $y $offset $spread $hex $inset;
//  
//  @if $ie == 1 {
//    $iecolor: '#' + red($hex) + green($hex) + blue($hex);
//    filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=#{$x}, OffY=#{$y}, Color='#{$iecolor}');
//    -ms-filter: quote(progid:DXImageTransform.Microsoft.dropshadow(OffX=#{$x}, OffY=#{$y}, Color='#{$iecolor}'));
//  }
//}

@mixin box-sizing($value) {
  -moz-box-sizing: $value;
  -webkit-box-sizing: $value;
  box-sizing: $value;
}

// requires sass 3.2
@mixin keyframes($name) {
  @-moz-keyframes #{$name} {
    @content;
  }
  @-ms-keyframes #{$name} {
    @content;
  }
  @-o-keyframes #{$name} {
    @content;
  }
  @-webkit-keyframes #{$name} {
    @content;
  }
  @keyframes #{$name} {
    @content;
  }
}

@mixin linear-gradient($from, $to, $ie: $useIEFilters) {
  @if $ie != 1 {
    background-color: $to;
  }

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, $from), color-stop(1, $to));
  background-image: -webkit-linear-gradient(top, $from, $to);
  background-image: -moz-linear-gradient(top, $from, $to);
  background-image: -ms-linear-gradient(top, $from, $to);
  background-image: -o-linear-gradient(top, $from, $to);
  background-image: linear-gradient(top, bottom, $from, $to);

  @if $ie == 1 { 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr='#{$to}');
  }
}

@mixin horizontal-gradient($startColor: #555, $endColor: #333, $ie: $useIEFilters) {
  @if $ie != 1 {
    background-color: $endColor;
  }

  background-color: $endColor;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
  background-image: -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
  background-image: -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
  background-image: -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
  background-image: linear-gradient(to right, $startColor, $endColor); // Standard, IE10
  background-repeat: repeat-x;
  @if $ie == 1 {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$startColor}', endColorstr='#{$endColor}', GradientType=1);
  }
}

@mixin radial-gradient($from, $to, $ie: $useIEFilters) {
  @if $ie != 1 {
    background-color: $to;
  }

  background: -moz-radial-gradient(center, circle cover, $from 0%, $to 100%);
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, $from), color-stop(100%, $to));
  background: -webkit-radial-gradient(center, circle cover, $from 0%, $to 100%);
  background: -o-radial-gradient(center, circle cover, $from 0%, $to 100%);
  background: -ms-radial-gradient(center, circle cover, $from 0%, $to 100%);
  background: radial-gradient(center, circle cover, $from 0%, $to 100%);
  background-color: $from;

  @if $ie == 1 {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr='#{$to}', GradientType=1); /* IE6-9 fallback on horizontal gradient */
  }
}

/*@mixin rgba-bg ($hex, $alpha, $ie: $useIEFilters) {
  @if $ie == 1 { 
    background-color: none;
    $hexopac: ie-hex-str(rgba($hex, $alpha));
        filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$hexopac}',EndColorStr='#{$hexopac}}');
    -ms-filter: quote(progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$hexopac}',EndColorStr='#{$hexopac}'));
  }
  @else {
    background-color: $hex;
    background-color: rgba($hex, $alpha);
  }
}*/

@mixin perspective($perspective) {
  -moz-perspective: $perspective;
  -ms-perspective: $perspective;
  -webkit-perspective: $perspective;
  perspective: $perspective;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

@mixin transform($transforms) {
  -moz-transform: $transforms;
  -o-transform: $transforms;
  -ms-transform: $transforms;
  -webkit-transform: $transforms;
  transform: $transforms;
}

@mixin matrix($a, $b, $c, $d, $e, $f) {
  -moz-transform: matrix($a, $b, $c, $d, #{$e}px, #{$f}px);
  -o-transform: matrix($a, $b, $c, $d, $e, $f);
  -ms-transform: matrix($a, $b, $c, $d, $e, $f);
  -webkit-transform: matrix($a, $b, $c, $d, $e, $f);
  transform: matrix($a, $b, $c, $d, $e, $f);
}

@mixin rotate($deg) {
  @include transform(rotate(#{$deg}deg));
}

@mixin scale($size) {
  @include transform(scale(#{$size}));
}

@mixin translate($x, $y) {
  @include transform(translate($x, $y));
}

@mixin transition($value...) {
  -moz-transition: $value;
  -o-transition: $value;
  -ms-transition: $value;
  -webkit-transition: $value;
  transition: $value;
}

@mixin animation($str) {
  -webkit-animation: #{$str};
  -moz-animation: #{$str};
  -ms-animation: #{$str};
  -o-animation: #{$str};
  animation: #{$str};
}

@mixin animation-name($str) {
  -webkit-animation-name: #{$str};
  -moz-animation-name: #{$str};
  -ms-animation-name: #{$str};
  -o-animation-name: #{$str};
  animation-name: #{$str};
}

@mixin animation-duration($str) {
  -webkit-animation-duration: #{$str};
  -moz-animation-duration: #{$str};
  -ms-animation-duration: #{$str};
  -o-animation-duration: #{$str};
  animation-duration: #{$str};
}

@mixin animation-direction($str) {
  -webkit-animation-direction: #{$str};
  -moz-animation-direction: #{$str};
  -ms-animation-direction: #{$str};
  -o-animation-direction: #{$str};
  animation-direction: #{$str};
}

@mixin animation-delay($str) {
  animation-delay: #{$str};
  -o-animation-delay: #{$str};
  -ms-animation-delay: #{$str};
  -webkit-animation-delay: #{$str};
  -moz-animation-delay: #{$str};
}

@mixin animation-iteration-count($str) {
  animation-iteration-count: #{$str};
  -o-animation-iteration-count: #{$str};
  -ms-animation-iteration-count: #{$str};
  -webkit-animation-iteration-count: #{$str};
  -moz-animation-iteration-count: #{$str};
}

@mixin animation-timing-function($str) {
  -webkit-animation-timing-function: #{$str};
  -moz-animation-timing-function: #{$str};
  -ms-animation-timing-function: #{$str};
  -o-animation-timing-function: #{$str};
  animation-timing-function: #{$str};
}

// ==== /CSS3 SASS MIXINS ====

@mixin opacity($opacity) {
  opacity: $opacity;
  $opacity-ie: $opacity * 100;
  filter: alpha(opacity=$opacity-ie); //IE8
}

@mixin size($width, $height: $width) {
  width: $width;
  height: $height;
}

@mixin clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

// Placeholder text
@mixin placeholder($color: $input-color-placeholder) {
  // Firefox
  &::-moz-placeholder {
    color: $color;
    opacity: 1; // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526
  }
  &:-ms-input-placeholder {
    color: $color;
  }
  // Internet Explorer 10+
  &::-webkit-input-placeholder {
    color: $color;
  }
  // Safari and Chrome
}