@import 'element:ef-canvas';

:host {
  --primary-color: @dataviz-color-primary;
  --secondary-color: @dataviz-color-complementary;
  --border-color: @dataviz-color-black;
  --center-line: solid;
  --center-line-color: @dataviz-color-black;
  --center-line-opacity: 0.6;

  [part='legend-container-outer'] {
    padding-bottom: 30px;
  }

  [part='primary-legend'],
  [part='secondary-legend'] {
    margin-top: 4px;
    align-items: center;
  }

  [part='primary-legend-symbol'],
  [part='secondary-legend-symbol'] {
    height: 12px;
    width: 12px;
    border-radius: 50%;
    margin-right: 10px;
    margin-top: 3px;
    align-self: baseline;
  }

  [part='primary-legend-symbol'] {
    background-color: var(--primary-color);
  }

  [part='secondary-legend-symbol'] {
    background-color: var(--secondary-color);
  }

  [part='primary-value'],
  [part='secondary-value'] {
    font-weight: 500;
  }
}