$tablist-background-color: #e7eff9;
$tablist-border-color: #bbcbde;
$tab-color: #416da3;
$tab-border-color: #8db3e3;
$selected-tab-color: #15498b;
$border-radius-value: 5px;
@mixin tab-background-image {
  background-image: none;
  background-image: #deecfd;
  background-image: -webkit-gradient(
    linear,
    top,
    bottom,
    color-stop(0%, #ccdef6),
    color-stop(25%, #d6e6fa),
    color-stop(45%, #deecfd)
  );
  background-image: -webkit-linear-gradient(top, #ccdef6 0%, #d6e6fa 25%, #deecfd 45%);
  background-image: -moz-linear-gradient(top, #ccdef6 0%, #d6e6fa 25%, #deecfd 45%);
  background-image: -o-linear-gradient(top, #ccdef6 0%, #d6e6fa 25%, #deecfd 45%);
  background-image: -ms-linear-gradient(top, #ccdef6 0%, #d6e6fa 25%, #deecfd 45%);
  background-image: linear-gradient(to bottom, #ccdef6 0%, #d6e6fa 25%, #deecfd 45%);
}
@mixin tab-box-shadow {
  -webkit-box-shadow:
    #fff 0 1px 0px 0 inset,
    #fff -1px 0 0px 0 inset,
    #fff 1px 0 0px 0 inset;
  -moz-box-shadow:
    #fff 0 1px 0px 0 inset,
    #fff -1px 0 0px 0 inset,
    #fff 1px 0 0px 0 inset;
  box-shadow:
    #fff 0 1px 0px 0 inset,
    #fff -1px 0 0px 0 inset,
    #fff 1px 0 0px 0 inset;
}
@mixin tab-hover-backgroud-image {
  background-image: #e8f2ff;
  background-image: -webkit-linear-gradient(top, #d7e5fd, #e0edff 25%, #e8f2ff 45%);
  background-image: -moz-linear-gradient(top, #d7e5fd, #e0edff 25%, #e8f2ff 45%);
  background-image: -o-linear-gradient(top, #d7e5fd, #e0edff 25%, #e8f2ff 45%);
  background-image: -ms-linear-gradient(top, #d7e5fd, #e0edff 25%, #e8f2ff 45%);
  background-image: -webkit-gradient(
    linear,
    top,
    bottom,
    color-stop(0%, #d7e5fd),
    color-stop(25%, #e0edff),
    color-stop(45%, #e8f2ff)
  );
  background-image: linear-gradient(to top, #d7e5fd, #e0edff 25%, #e8f2ff 45%);
}
@mixin selected-tab-background-image {
  background-image: none;
  background-image: #deecfd;
  background-image: -webkit-gradient(
    linear,
    top,
    bottom,
    color-stop(0%, #fff),
    color-stop(25%, #f5f9fe),
    color-stop(45%, #deecfd)
  );
  background-image: -moz-linear-gradient(top, #fff, #f5f9fe 25%, #deecfd 45%);
  background-image: -o-linear-gradient(top, #fff, #f5f9fe 25%, #deecfd 45%);
  background-image: -ms-linear-gradient(top, #fff, #f5f9fe 25%, #deecfd 45%);
  background-image: linear-gradient(to bottom, #fff, #f5f9fe 25%, #deecfd 45%);
  background-image: -webkit-linear-gradient(top, #fff, #f5f9fe 25%, #deecfd 45%);
}
@mixin tab-border-radius($isVertical: false, $isRtl: false) {
  @if $isVertical {
    @if $isRtl {
      border-radius: 1px 5px 5px 1px;
    } @else {
      border-radius: 5px 1px 1px 5px;
    }
  } @else {
    border-radius: 5px 5px 1px 1px;
  }
}
@mixin _main {
  &.rc-dyn-tabs-tablist-view {
    background-color: $tablist-background-color;
    border-color: $tablist-border-color;
    border-style: solid;
    border-width: 1px;
    padding: 0.2em 0.2em 0;
    border-radius: $border-radius-value;
    .rc-dyn-tabs-title {
      border-color: $tab-border-color;
      @include tab-background-image;
      @include tab-box-shadow;
      @include tab-border-radius;
      border-style: solid;
      border-width: 1px 1px 0px 1px;
      color: $tab-color;
      min-width: 100px;
      &.rc-dyn-tabs-showmorebutton {
        min-width: 46.38px;
      }
    }
    .rc-dyn-tabs-selected .rc-dyn-tabs-title {
      @include selected-tab-background-image;
      color: $selected-tab-color;
    }
    .rc-dyn-tabs-tab {
      color: $tab-color;
      margin: 0px 0.2em 0 0;
      &:hover {
        & > .rc-dyn-tabs-title {
          @include tab-hover-backgroud-image;
        }
      }
    }
    .rc-dyn-tabs-showmorebutton svg path {
      fill: $tab-color;
    }
  }
  &.rc-dyn-tabs-tablist-view.rc-dyn-tabs-rtl {
    .rc-dyn-tabs-tab {
      margin: 0px 0 0 0.2em;
    }
  }
  &.rc-dyn-tabs-tablist-view.rc-dyn-tabs-vertical {
    padding: 0.2em 0 0.2em 0.2em;
    .rc-dyn-tabs-tab {
      margin: 0.2em 0 0 0;
    }
    .rc-dyn-tabs-title {
      border-width: 1px 0px 1px 1px;
      @include tab-border-radius($isVertical: true);
    }
    .rc-dyn-tabs-showmorebutton-container {
      margin: 0.2em 0 0 0;
      min-height: 30px;
    }
    &.rc-dyn-tabs-popper {
      padding: 0.2em;
      .rc-dyn-tabs-title {
        border-width: 1px;
        border-radius: 5px;
      }
    }
  }
  &.rc-dyn-tabs-tablist-view.rc-dyn-tabs-vertical.rc-dyn-tabs-rtl {
    padding: 0.2em 0.2em 0.2em 0;
    .rc-dyn-tabs-title {
      border-width: 1px 1px 1px 0px;
      @include tab-border-radius($isVertical: true, $isRtl: true);
    }
    &.rc-dyn-tabs-popper {
      padding: 0.2em;
      .rc-dyn-tabs-title {
        border-width: 1px;
        border-radius: 5px;
      }
    }
  }
}
@mixin main {
  .all-themes {
    @include _main();
  }
  .classic {
    @include _main();
  }
}
