/* C3 charts */

	.c3 {
		svg {
			font: 10px sans-serif;
		}
		path,
        line {
			fill: none;
			stroke: #000;
		}
		text {
			-webkit-user-select: none;
			-moz-user-select: none;
			user-select: none;
		}
	}

    .c3-legend-item-tile,
    .c3-xgrid-focus,
    .c3-ygrid,
    .c3-event-rect,
    .c3-bars path {
        shape-rendering: crispEdges;
    }

	.c3-chart-arc {
		path {
			stroke: @white;
		}
		text {
			fill: @white;
			font-size: 13px;
		}
	}

/*-- Grid --*/
	.c3-grid {
		line {
			stroke: #ddd;
		}
		text {
			fill: #ddd;
		}
	}
	.c3-xgrid,
	.c3-ygrid {
		stroke-dasharray: 3 3;
	}

/*-- Text on Chart --*/
	.c3-text {
        &.c3-empty {
            fill: #808080;
            font-size: 22px;
        }
    }
/*-- Line --*/
	.c3-line {
		stroke-width: 2px;
	}

/*-- Point --*/
	.c3-circle {
		&._expanded_ {
			stroke-width: 2px;
			stroke: white;
		}
	}
	.c3-selected-circle {
		stroke-width: 2px;
		fill: white;
	}

/*-- Bar --*/
	.c3-bar {
        stroke-width: 0;
        &._expanded_ {
            fill-opacity: 0.75;
        }
    }

/*-- Arc --*/
	.c3-chart-arcs-title {
		font-size: 1.3em;
	}
	.c3-chart-arc text {
		font-size: 11px;
	}

/*-- Focus --*/
	.c3-target.c3-focused path {
        &.c3-line,
        &.c3-step {
            stroke-width: 2px;
        }
    }

/*-- Region --*/
	.c3-region {
		fill: steelblue;
		fill-opacity: .1;
	}

/*-- Brush --*/
	.c3-brush .extent {
		fill-opacity: .1;
	}

/*-- Legend --*/
	.c3-legend-item {
		font-size: 12px;
	}
    .c3-legend-background {
        opacity: 0.75;
        fill: white;
        stroke: lightgray;
        stroke-width: 1
    }
	.c3-legend-item-hidden {
		opacity: 0.1;
	}

/*-- Tooltip --*/
	.c3-tooltip {
		border-collapse: collapse;
		border-spacing: 0;
		background-color: rgba(0,0,0,0.9);
		empty-cells: show;
		th {
			font-size: 12px;
			padding: 4px 5px;
			text-align: left;
			color: #ddd;
		}
		td {
			font-size: 12px;
			padding: 3px 6px;
			color: @white;
			> span {
				display: inline-block;
				width: 10px;
				height: 10px;
				margin-right: 6px;
			}
			&.value{
			  text-align: right;
			}
			& + td {
				border-left: 1px solid rgba(255,255,255,0.1);
			}
		}
		tr + tr td {
			border-top: 1px solid rgba(255,255,255,0.1);
		}
	}

	.c3-area {
		stroke-width: 0;
		opacity: 0.2;
	}

    .c3-chart-arcs .c3-chart-arcs-background {
        fill: #e0e0e0;
        stroke: none;
        & .c3-chart-arcs-gauge-unit {
            fill: #000;
            font-size: 16px;
        }
        & .c3-chart-arcs-gauge-max {
            fill: #777;
        }
        & .c3-chart-arcs-gauge-min {
            fill: #777;
        }
    }
    .c3-chart-arc .c3-gauge-value {
        fill: #000;
        font-size: 28px;
    }