.LineAreaBarChart .renderer {
  margin-top: -5px;
  margin-left: -0.5em;
  margin-right: -0.5em;
  margin-bottom: -0.5em;
  overflow: hidden;
}

.LineAreaBarChart .dc-chart .grid-line.horizontal {
  stroke: color-mod(var(--color-text-medium) alpha(-80%));
  stroke-dasharray: 5, 5;
}

.LineAreaBarChart .dc-chart .axis {
  z-index: -1;
}

.LineAreaBarChart .dc-chart .axis text {
  font-size: 12px;
  font-family: var(--default-font-family), sans-serif;
  font-weight: 900;
}

.LineAreaBarChart .dc-chart .axis .domain,
.LineAreaBarChart .dc-chart .axis .tick line {
  stroke: var(--color-text-light);
}

.LineAreaBarChart .dc-chart .axis .tick text {
  fill: var(--color-text-medium);
}

.LineAreaBarChart .dc-chart g.row text.outside {
  fill: var(--color-text-medium);
  font-weight: 900;
}
.LineAreaBarChart .dc-chart g.row text.inside {
  fill: white;
  font-weight: bold;
}

/* turn off ticks and domain lines */
.LineAreaBarChart .dc-chart .axis.y .domain,
.LineAreaBarChart .dc-chart .axis.yr .domain,
.LineAreaBarChart .dc-chart .axis.y .tick line,
.LineAreaBarChart .dc-chart .axis.yr .tick line {
  display: none;
}

.LineAreaBarChart .dc-chart .x-axis-label,
.LineAreaBarChart .dc-chart .y-axis-label {
  fill: var(--color-text-medium);
  font-size: 14px;
  font-weight: 900;
}

/* disable grid lines */
.LineAreaBarChart .dc-chart .tick line {
  display: none;
}

/* enabled grid lines for row charts */
.LineAreaBarChart .dc-chart .rowChart .tick .grid-line {
  display: inherit;
}

/* restyle grid-line for 0 to look like X axis */
.LineAreaBarChart .dc-chart .stacked line.zero {
  stroke: var(--color-text-light);
  opacity: 1;
  stroke-dasharray: none;
}

/* restyle X axis for stacked charts to look like a grid line */
.LineAreaBarChart .dc-chart .stacked .domain {
  stroke: color-mod(var(--color-text-medium) alpha(-80%));
  stroke-dasharray: 5, 5;
}

/* gridline at 0 overlaps with X axis */
.LineAreaBarChart .dc-chart .grid-line.horizontal line:first-child {
  display: none;
}

/* disable pointer events on all chart elements while dragging to avoid weird interactions */
.LineAreaBarChart .dc-chart .dragging .area,
.LineAreaBarChart .dc-chart .dragging .bar,
.LineAreaBarChart .dc-chart .dragging .line,
.LineAreaBarChart .dc-chart .dragging .dot,
.LineAreaBarChart .dc-chart .dragging .row,
.LineAreaBarChart .dc-chart .dragging .bubble,
.LineAreaBarChart .dc-chart .dragging .voronoi {
  pointer-events: none !important;
}

/* disable dc default behavior */
.LineAreaBarChart .dc-chart rect.bar:hover {
  fill-opacity: 1;
}

.LineAreaBarChart .dc-chart g.row rect {
  fill-opacity: 1;
}

/* highlight single series bar and row charts */
.LineAreaBarChart.mute-0 .dc-chart rect.bar:hover,
.LineAreaBarChart.mute-0 .dc-chart g.row:hover {
  opacity: 1 !important;
}

.LineAreaBarChart .dc-chart circle.bubble {
  fill-opacity: 0.8;
  stroke-width: 1;
  stroke: white;
}

.LineAreaBarChart .dc-chart .enable-dots .dc-tooltip .dot:hover,
.LineAreaBarChart .dc-chart .enable-dots .dc-tooltip .dot.hover {
  fill: currentColor;
}

/* line width = 2px (default) */
.LineAreaBarChart .dc-chart .line {
  stroke-width: 2px;
}
.LineAreaBarChart .dc-chart .dc-tooltip .dot {
  r: 3px !important;
  stroke-width: 2px;
}

/* line width = 3px */
.LineAreaBarChart .dc-chart .line--medium .line {
  stroke-width: 3px;
}
.LineAreaBarChart .dc-chart .line--medium .dc-tooltip .dot {
  r: 3px !important;
  stroke-width: 2px;
}

/* line width = 4px */
.LineAreaBarChart .dc-chart .line--heavy .line {
  stroke-width: 4px;
}
.LineAreaBarChart .dc-chart .line--heavy .dc-tooltip .dot {
  r: 3.5px !important;
  stroke-width: 3px;
}

.LineAreaBarChart .dc-chart .enable-dots .dc-tooltip .dot,
.LineAreaBarChart .dc-chart .dc-tooltip .dot.selected,
.LineAreaBarChart .dc-chart .enable-dots-onhover .dc-tooltip .dot:hover,
.LineAreaBarChart .dc-chart .enable-dots-onhover .dc-tooltip .dot.hover {
  fill: white;
  stroke: currentColor;
  fill-opacity: 1 !important;
  stroke-opacity: 1 !important;
}

.LineAreaBarChart .dc-chart .dc-tooltip .dot.deselected {
  opacity: 0;
}
.LineAreaBarChart .dc-chart .line.deselected {
  color: var(--color-text-light);
}

.LineAreaBarChart .dc-chart .area,
.LineAreaBarChart .dc-chart .bar,
.LineAreaBarChart .dc-chart .line,
.LineAreaBarChart .dc-chart .dot,
.LineAreaBarChart .dc-chart .row,
.LineAreaBarChart .dc-chart .bubble {
  transition: opacity 0.15s linear;
}

.LineAreaBarChart .dc-chart .axis.y,
.LineAreaBarChart .dc-chart .y-axis-label,
.LineAreaBarChart .dc-chart .axis.yr,
.LineAreaBarChart .dc-chart .yr-axis-label {
  transition: opacity 0.25s linear;
}

.LineAreaBarChart .dc-chart .event-line {
  transition: stroke 0.15s linear;
}

/* .mute-* selectors dynamically generated in LineAreaBarChart.js*/

.LineAreaBarChart.mute-yl .dc-chart .axis.y,
.LineAreaBarChart.mute-yl .dc-chart .y-axis-label.y-label {
  opacity: 0;
}

.LineAreaBarChart.mute-yr .dc-chart .axis.yr,
.LineAreaBarChart.mute-yr .dc-chart .y-axis-label.yr-label {
  opacity: 0;
}

.LineAreaBarChart .dc-chart .voronoi {
  fill: transparent;
}

.LineAreaBarChart .dc-chart .voronoi-drill {
  cursor: pointer;
}

/* we put the brush behind everything so this isn't necessary
/*.LineAreaBarChart .dc-chart .brush {
  pointer-events: none;
}*/

/* grid lines aren't clickable, and get in the way of the brush */
.LineAreaBarChart .dc-chart .grid-line {
  pointer-events: none;
}

/* brush handles */
.LineAreaBarChart .dc-chart .brush .resize path {
  fill: var(--color-bg-light);
  stroke: var(--color-text-medium);
}

.LineAreaBarChart .dc-chart .goal .line {
  stroke: var(--color-text-medium);
  stroke-dasharray: 5, 5;
}

.LineAreaBarChart .dc-chart .trend .line {
  stroke-dasharray: 5, 5;
}

text.value-label {
  pointer-events: none;
}

text.value-label {
  fill: var(--color-text-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.5px;
  stroke: var(--color-text-white);
  stroke-width: 3px;
  paint-order: stroke;
}

text.value-label-white {
  fill: var(--color-text-white);
  font-weight: 800;
  stroke: var(--color-text-dark);
  stroke-width: 3px;
  paint-order: stroke;
}

/* timeline events */

.LineAreaBarChart .dc-chart .event-axis .event-tick {
  cursor: pointer;
  pointer-events: all;
}

.LineAreaBarChart .dc-chart .event-axis .event-icon {
  fill: var(--color-text-light);
  stroke: var(--color-text-light);
  shape-rendering: geometricPrecision;
}

.LineAreaBarChart .dc-chart .event-axis .event-text {
  fill: var(--color-text-light);
}

.LineAreaBarChart .dc-chart .event-axis .event-tick.hover .event-icon {
  fill: var(--color-brand);
  stroke: var(--color-brand);
}

.LineAreaBarChart .dc-chart .event-axis .event-tick.hover .event-text {
  fill: var(--color-brand);
}

.LineAreaBarChart .dc-chart .event-line {
  stroke: color-mod(var(--color-text-medium) alpha(-80%));
  stroke-width: 2;
  pointer-events: none;
}

.LineAreaBarChart .dc-chart .event-line.hover {
  stroke: var(--color-brand);
}
