:root {
  --energy-certificate-band-a-plus: url(#diagonal-hatch-asset-rating-bands-graph);
  --energy-certificate-band-a: #00c781;
  --energy-certificate-band-b: #19b459;
  --energy-certificate-band-c: #8dce46;
  --energy-certificate-band-d: #ffd500;
  --energy-certificate-band-e: #fcaa65;
  --energy-certificate-band-f: #ef8023;
  --energy-certificate-band-g: #e9153b;
  --energy-certificate-band-unknown: url(#thick-diagonal-hatch-asset-rating-bands-graph);
}

.energy-certificate-band.band-a-plus {
  --band-color: var(--energy-certificate-band-a-plus);
}

.energy-certificate-band.band-a {
  --band-color: var(--energy-certificate-band-a);
}

.energy-certificate-band.band-b {
  --band-color: var(--energy-certificate-band-b);
}

.energy-certificate-band.band-c {
  --band-color: var(--energy-certificate-band-c);
}

.energy-certificate-band.band-d {
  --band-color: var(--energy-certificate-band-d);
}

.energy-certificate-band.band-e {
  --band-color: var(--energy-certificate-band-e);
}

.energy-certificate-band.band-f {
  --band-color: var(--energy-certificate-band-f);
}

.energy-certificate-band.band-g {
  --band-color: var(--energy-certificate-band-g);
}

.energy-certificate-band.band-unknown {
  --band-color: var(--energy-certificate-band-unknown);
}

.energy-certificate-band:is(path) {
  stroke: var(--band-color);
}

.energy-certificate-band:is(rect, circle) {
  fill: var(--band-color);
}

.energy-certificate-band:is(span) {
  color: var(--band-color);
}