/***********/
/* igChart */
/***********/

.ui-chart-palette-1 {
  @include chartPalette1;
}

.ui-chart-palette-2 {
  @include chartPalette2;
}

.ui-chart-palette-3 {
  @include chartPalette3;
}

.ui-chart-palette-4 {
  @include chartPalette4;
}

.ui-chart-palette-5 {
  @include chartPalette5;
}

.ui-chart-palette-6 {
  @include chartPalette6;
}

.ui-chart-palette-7 {
  @include chartPalette7;
}

.ui-chart-palette-8 {
  @include chartPalette8;
}

.ui-chart-palette-9 {
  @include chartPalette9;
}

.ui-chart-palette-10 {
  @include chartPalette10;
}

.ui-chart-palette-11 {
  @include chartPalette11;
}

.ui-chart-palette-12 {
  @include chartPalette12;
}

.ui-chart-piechart-container,
.ui-chart-legend-item-text {
  font-size: 12px;
  font-family: $font-family-base;
}

.ui-chart-toolbar .ui-slider-handle {
  width: 18px;
  height: 18px;
  margin-left: -9px!important;
  top: -5px!important;
}

.touch .ui-chart-toolbar .ui-slider-handle {
  border: 1px solid $gray-dark;
  background: $gray;
  margin-left: -15px;
  top: -15px;
}

.ui-chart-title {
  margin-bottom: 5px;
  text-align: center;
}

.ui-chart-subtitle {
  margin-bottom: 5px;
  text-align: center;
}

.ui-widget-content.ui-chart-tooltip {
  background-color: rgba(255, 255, 255, 0.85);
}
/*******************/
/* Sparkline chart */
/*******************/

.ui-sparkline {
  font-family: $font-family-base;
  font-size: 13px;
  padding: 10px 5px 10px 5px;
  border: 0;
}

.ui-sparkline-tooltip {
  @include boxShadow;
  padding: 3px;
}

.ui-sparkline-sparkpath {
  background: #43ABD5;
  border: 1px solid;
}

.ui-sparkline-negativesparkpath {
  background: #B9242E;
  border: 1px solid;
}

.ui-sparkline-trendline {
  background: #7F7F7F;
  border: 2px solid;
}

.ui-sparkline-markers {
  background: #43ABD5;
  border: 3px solid;
}

.ui-sparkline-firstmarker {
  background: #237FA7;
  border: 5px solid;
}

.ui-sparkline-lastmarker {
  background: #FBC139;
  border: 5px solid;
}

.ui-sparkline-highmarker {
  background: #A3B929;
  border: 4px solid;
}

.ui-sparkline-lowmarker {
  background: #AF39FF;
  border: 3px solid;
}

.ui-sparkline-negativemarkers {
  background: #E5516F;
  border: 3px solid;
}

.ui-sparkline-range {
  background: gray;
  opacity: 0.2;
}

.ui-sparkline-axis-x {
  font-family: $font-family-base;
  border: 2px solid #989EA3;
  color: #406090;
}

.ui-sparkline-axis-y {
  font-family: $font-family-base;
  border: 2px solid #989EA3;
  color: #406090;
  text-align: right;
}
/****************/
/* Funnel chart */
/****************/

.ui-funnel {
  font-family: $font-family-base;
  font-size: 14px;
  color: #555555;
  border: 0;
}

.ui-funnel-tooltip {
  @include boxShadow;
  padding: 3px;
}

.ui-funnel-slice {
  color: #FFFFFF;
  border: 0;
}

.ui-funnel-slice-selected {
  opacity: 1.0;
}

.ui-funnel-slice-unselected {
  opacity: 0.49;
  border-color: transparent;
}
/********************/
/* igDoughnut Chart */
/********************/

.ui-doughnut {
  border: 0;
  font-size: 12px;
  font-family: $font-family-base;
}

.ui-doughnut-tooltip {
  /*add styles*/
}


/***********************/
/* igRadialGauge Chart */
/***********************/

.ui-radialgauge-needle {
  background-color: $gray-dark;
}

.ui-radialgauge-needleCap {
  background-color: $gray-dark;
  border-color: $gray-dark;
}

.ui-radialgauge-backing {
  background-color: $body-bg;
  border: $gray;
}

.ui-radialgauge-scale {
  background-color: $brand-primary;
  border: none;
}

.ui-radialgauge-tick {
  background-color: $gray-dark;
  border-top-color: none;
}

.ui-radialgauge-minorTick {
  background-color: $gray-dark;
  border: none;
}

.ui-radialgauge-label {
  background-color: $gray-dark;
  border: none;
}

.ui-radialgauge-range-palette-1 {
  background-color: $chartGradualPalette7;
  border-top-color: transparent;
}

.ui-radialgauge-range-palette-2 {
  background-color: $chartGradualPalette5;
  border-top-color: transparent;
}

.ui-radialgauge-range-palette-3 {
  background-color: $chartGradualPalette4;
  border-top-color: transparent;
}

.ui-radialgauge-range-palette-4 {
  background-color: $chartGradualPalette3;
  border-top-color: transparent;
}

.ui-radialgauge-range-palette-5 {
  background-color: $chartGradualPalette2;
  border-top-color: transparent;
}

.ui-radialgauge-range-palette-6 {
  background-color: $chartGradualPalette1;
  border-top-color: transparent;
}

.ui-radialgauge {
  font-family: $font-family-base;
  font-size: 16px;
}
/***********************/
/* igBulletGraph Chart */
/***********************/

.ui-bulletgraph-backing {
  background-color: $body-bg;
  border-color: $body-bg;
}

.ui-bulletgraph-targetvalue {
  background-color: $body-bg;
  border-color: $body-bg;
}
/* TICKS AND LABELS */

.ui-bulletgraph-tick {
  background-color: $gray-dark;
  border: transparent;
}

.ui-bulletgraph-minortick {
  background-color: $gray-dark;
  border: transparent;
}

.ui-bulletgraph-label {
  background-color: $gray-dark;
  border: transparent;
}
/* RANGE VALUES */

.ui-bulletgraph-range-palette-1 {
  background-color: $chartGradualPalette1;
  border: transparent;
}

.ui-bulletgraph-range-palette-2 {
  background-color: $chartGradualPalette3;
  border: transparent;
}

.ui-bulletgraph-range-palette-3 {
  background-color: $chartGradualPalette5;
  border: transparent;
}

.ui-bulletgraph-range-palette-4 {
  background-color: $chartGradualPalette7;
  border: transparent;
}

.ui-bulletgraph-range-palette-5 {
  background-color: $chartGradualPalette9;
  border: transparent;
}
/* ACTUAL VALUES */

.ui-bulletgraph-value {
  background-color: $body-bg;
  border: transparent;
}
/* TOOLTIPS */

.ui-bulletgraph-tooltip {
  border-style: none;
  white-space: nowrap;
  background-color: transparent;
}

.ui-bulletgraph-range-tooltip {
  border-style: solid;
  border-width: 2px;
  background-color: rgba(230, 230, 230, 0.74);
  padding: 4px;
  font-weight: bold;
}

.ui-bulletgraph-value-tooltip {
  border-style: solid;
  border-width: 2px;
  background-color: rgba(230, 230, 230, 0.74);
  padding: 4px;
  font-weight: bold;
}

.ui-bulletgraph-targetvalue-tooltip {
  border-style: solid;
  border-width: 2px;
  background-color: rgba(230, 230, 230, 0.74);
  padding: 4px;
  font-weight: bold;
}

.ui-bulletgraph {
  font-family: $font-family-base;
  font-size: 12px;
  color: $body-color;
}
/***********************/
/* igLinearGauge Chart */
/***********************/

.ui-lineargauge-backing {
  background-color: $body-bg;
  border-color: $body-bg;
}

.ui-lineargauge-needle {
  background-color: $gray-light;
  border-color: $gray-light;
}

.ui-lineargauge-scale {
  background-color: $gray-light;
  border-color: $gray-light;
}
/* TICKS AND LABELS */

.ui-lineargauge-tick {
  background-color: $gray-dark;
  border: transparent;
}

.ui-lineargauge-minortick {
  background-color: $gray-dark;
  border: transparent;
}

.ui-lineargauge-label {
  background-color: $gray-dark;
  border: transparent;
}
/* RANGE VALUES */

.ui-lineargauge-range-palette-1 {
  background-color: $chartGradualPalette1;
  border: transparent;
}

.ui-lineargauge-range-palette-2 {
  background-color: $chartGradualPalette3;
  border: transparent;
}

.ui-lineargauge-range-palette-3 {
  background-color: $chartGradualPalette5;
  border: transparent;
}

.ui-lineargauge-range-palette-4 {
  background-color: $chartGradualPalette7;
  border: transparent;
}

.ui-lineargauge-range-palette-5 {
  background-color: $chartGradualPalette9;
  border: transparent;
}
/* TOOLTIPS */

.ui-lineargauge-tooltip {
  border-style: none;
  white-space: nowrap;
  background-color: transparent;
}

.ui-lineargauge-range-tooltip {
  border-style: solid;
  border-width: 2px;
  background-color: rgba(230, 230, 230, 0.74);
  padding: 4px;
  font-weight: bold;
}

.ui-lineargauge-needle-tooltip {
  border-style: solid;
  border-width: 2px;
  background-color: rgba(230, 230, 230, 0.74);
  padding: 4px;
  font-weight: bold;
}

.ui-lineargauge {
  font-family: $font-family-base;
  font-size: 12px;
  color: $body-color;
}