/*
  Don't change this file unless you know what you're doing. If you file an issue
  on GitHub and we find out it was all caused because you modified this file,
  we'll release the kraken and you, your beloved ones, your postman, the guy who
  delivers pizza to your house, everyone.
  Seriously, the chart's styling is easier to change than in v1. Don't make us
  regret that decision.
                                                                    lorem--ipsum
*/
.chart-legend {
  margin-left: 20px; }
  .chart-legend .item {
    cursor: pointer;
    font-family: sans-serif;
    height: 16px;
    font-size: 0.8em;
    font-weight: 100;
    display: inline-block;
    margin-right: 10px; }
    .chart-legend .item > * {
      vertical-align: middle;
      display: inline-block; }
    .chart-legend .item > .legend-label {
      height: 16px;
      line-height: 17px; }
    .chart-legend .item > .icon {
      width: 16px;
      border-radius: 50%;
      height: 16px;
      margin-right: 5px;
      background-repeat: no-repeat;
      background-position: 50% 25%; }
    .chart-legend .item.legend-hidden {
      opacity: 0.4; }
    .chart-legend .item.column > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' style='fill: white;' width='10' height='10'><rect y='2' width='2' height='8'/><rect x='4' y='5' width='2' height='5'/><rect x='8' y='3' width='2' height='7'/></svg>"); }
    .chart-legend .item.dot > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' style='fill: white;' width='10' height='10'><circle cx='5' cy='6' r='2'/></svg>"); }
    .chart-legend .item.dashed-line > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' style='fill: white;' width='10' height='10'>\a         <g style=\"stroke: white; fill: none; stroke-dasharray: 4px,2px;\">\a           <path d='M0,6 L10,6'/>\a         </g>\a       </svg>"); }
    .chart-legend .item.line > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' style='fill: white;' width='10' height='10'>\a         <g style=\"stroke: white;\">\a           <path d='M0,6 L10,6'/>\a         </g>\a       </svg>"); }
    .chart-legend .item.area > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' style='fill: white;' width='10' height='10'><polygon points='0,10 2.428,3 5,6 7.625,5 10,10 10,10 0,10'/></svg>"); }

.tooltip-line {
  stroke: grey;
  stroke-width: 1;
  shape-rendering: crispEdges; }

.tooltip-dot {
  stroke-width: 2px;
  fill: white; }

.chart-tooltip {
  position: absolute;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-color: white;
  z-index: 100;
  box-shadow: 1px 1px 2px rgba(61, 61, 61, 0.5);
  padding: 5px 10px;
  border-radius: 1px;
  font-family: sans-serif;
  font-weight: 100; }
  .chart-tooltip > .abscissas {
    margin-bottom: 5px;
    font-size: 0.7em;
    white-space: nowrap; }
  .chart-tooltip .tooltip-item {
    font-size: 0.8em;
    white-space: nowrap; }
    .chart-tooltip .tooltip-item:not(:last-child) {
      margin-bottom: 0.2em; }
    .chart-tooltip .tooltip-item > * {
      display: inline-block; }
      .chart-tooltip .tooltip-item > *:not(:last-child) {
        margin-right: 0.4em; }
    .chart-tooltip .tooltip-item .color-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%; }
    .chart-tooltip .tooltip-item .y-value {
      font-weight: 500; }

.chart {
  position: relative;
  box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .chart .axis {
    font: 10px Roboto;
    shape-rendering: crispEdges; }
    .chart .axis.x2-axis {
      display: none; }
    .chart .axis > path {
      fill: none;
      stroke: black; }
    .chart .axis > .tick > text {
      fill: black; }
    .chart .axis > .tick > line {
      stroke: black; }
  .chart .grid .tick > text {
    display: none; }
  .chart .grid .tick > line {
    stroke: #eee;
    stroke-width: 1;
    shape-rendering: crispEdges; }
  .chart .dot-series circle {
    fill: white;
    stroke-width: 2px; }
  .chart .line-series path {
    stroke-width: 1px; }
  .chart .column-series {
    fill-opacity: 0.3; }
  .chart .area-series {
    opacity: 0.3; }
  .chart .chart-brush {
    fill: rgba(166, 166, 166, 0.5); }
  .chart .hline {
    shape-rendering: crispEdges;
    stroke-width: 1px; }
