@mixin color-box($background){
  background: $background;
  border: 1px solid darken($background,20%);
  color: check-background-set-color($background);
  a{
    //text-decoration: underline;
  }
}
%color-box-white{
  background: $color-foreground;
  border: 1px solid $color-border;
}
%color-box-base{
  @include color-box(mix($color-background,$color-foreground));
}
%color-box-positive{
  @include color-box($color-positive);
}
%color-box-warning{
  @include color-box($color-important);
}
%color-box-notice{
  @include color-box($color-notice);
}

%palette-background{
  @for $i from 1 through (length($palette) - 1) {
    $curent-color: palete-color($palette,$i);
    $curent-color: rgba($curent-color,$palette-lighten-factor);
    &.palette-#{$i}{
      background: $curent-color;
    }
  }
}
%scheme-base{
  tr > &{
    padding: 0;
    border-left-color: transparent;
    border-right-color: transparent;
  }
}
@mixin color-scheme($color, $bg: false, $border: true){
  @extend %scheme-base;
  $color-adjusted: intelighten($color, 0.95);
  $color-adjusted: rgba($color, 0.1);

  @if ($border == true) {
    border: 1px solid transparent;
  }

  //padding: 0.5*$gap;
  color: $color;
  a{
    color: $color !important;
  }
  td{
    color: $color-text;
  }
  table.progress td{
    &.closed{
      background-color: $color;
    }
  }
  .row-control{
    & > .expander{
      text-decoration: none !important;
      &, &-root,&-descendant{
        &:before{
          color: $color;
        }
      }
    }
  }
  @if($bg == true){
    background: $color-adjusted;

    @if ($border == true) {
      border-color: darken($color-adjusted, 10%) !important;
    }

    &.odd {
      //background-color: rgba($color-adjusted, .175)!important;
    }

    hr{
      border-color: darken($color,10%);
    }
    color:  darken($color,10%);
    a{
      color: $color !important;
    }
  }
}
@mixin pattern-3d-boxes($patttern-color-1: lighten($color-background,2%), $patttern-color-2: lighten($color-background,4%), $patttern-color-3: lighten($color-background,6%), $size-x: 40px, $size-y: 70px){
  background-color:$patttern-color-1;
  background-image: linear-gradient(30deg, $patttern-color-2 12%, transparent 12.5%, transparent 87%, $patttern-color-2 87.5%, $patttern-color-2),
  linear-gradient(150deg, $patttern-color-2 12%, transparent 12.5%, transparent 87%, $patttern-color-2 87.5%, $patttern-color-2),
  linear-gradient(30deg, $patttern-color-2 12%, transparent 12.5%, transparent 87%, $patttern-color-2 87.5%, $patttern-color-2),
  linear-gradient(150deg, $patttern-color-2 12%, transparent 12.5%, transparent 87%, $patttern-color-2 87.5%, $patttern-color-2),
  linear-gradient(60deg, $patttern-color-3 25%, transparent 25.5%, transparent 75%, $patttern-color-3 75%, $patttern-color-3),
  linear-gradient(60deg, $patttern-color-3 25%, transparent 25.5%, transparent 75%, $patttern-color-3 75%, $patttern-color-3);
  background-size:$size-x $size-y;
  background-position: 0 0, 0 0, 0.5*$size-x 0.5*$size-y, 0.5*$size-x 0.5*$size-y, 0 0, 0.5*$size-x 0.5*$size-y;
}
@mixin pattern-diagonal-stripes ( $angle, $size, $color1, $color2) {
  @include repeating-linear-gradient ( ($angle, $color1, $color1 $size, $color2 $size, $color2 2*$size) );
}
@mixin pattern-grid ($color-grid: rgba($color-border, 0.2), $size: $gap, $thickness: 1px) {
  background-image:
    linear-gradient($color-grid 1px, transparent 1px),
    linear-gradient(90deg, $color-grid 1px, transparent 1px);
  background-size: $size $size, $size $size;
  background-position: -1px -1px, -1px -1px
}
%pattern-diagonal-stripes-background{
  @include pattern-diagonal-stripes(45deg, 1px, mix($color-background,$color-foreground), $color-foreground );
}
%pattern-grid-background{
  @include pattern-grid();
}
%graphic-bg-boxes{
 @include pattern-3d-boxes();
}
%pattern-3d-boxes-main{
  @include pattern-3d-boxes(lighten($color-main,2%), lighten($color-main,4%),lighten($color-main,6%));
}
@mixin graphic-bg-grid($background, $borders, $size-x, $size-y){
  background-color:$background;
  background-image:
  linear-gradient($borders 1px, transparent 1px),
  linear-gradient(90deg, $borders 1px, transparent 1px);
  background-size:$size-x $size-y, $size-x $size-y;
  background-position: -1px -1px, -1px -1px !important;
}
