.grafik-figur {
  margin: 0 0 var(--abstand) 0;
}

.grafik text {
  font-family: var(--schrift);
}

.grafik-legende {
  margin: var(--abstand-klein) 0;
  padding-left: 1.4rem;
  color: var(--farbe-text-leise);
  font-size: var(--text-s);
}

.grafik-hinweis {
  margin: var(--abstand-winzig) 0;
  color: var(--farbe-text-leise);
  font-size: var(--text-s);
}

.grafik-tabelle {
  margin: var(--abstand-klein) 0;
  max-width: 100%;
  overflow-x: auto;
}

.grafik-tabelle table {
  border-collapse: collapse;
  font-size: var(--text-s);
}

.grafik-tabelle th,
.grafik-tabelle td {
  padding: var(--abstand-winzig) var(--abstand-klein);
  border-bottom: 1px solid var(--farbe-rand);
  text-align: right;
}

.grafik-leer {
  color: var(--farbe-text-leise);
}

.g-achse {
  fill: var(--farbe-text-leise);
  font-size: 11px;
}

.g-achse-klein {
  fill: var(--farbe-text-leise);
  font-size: 10px;
}

.g-text {
  fill: var(--farbe-text);
  font-size: 11px;
}

.g-text-klein {
  fill: var(--farbe-text);
  font-size: 10px;
}

.g-hilfslinie {
  stroke: var(--farbe-rand);
  stroke-width: 1;
}

.g-linie {
  fill: none;
  stroke-width: 2;
  stroke-linejoin: round;
}

.g-reihe-1 {
  stroke: var(--farbe-akzent);
}

.g-reihe-2 {
  stroke: var(--farbe-akzent-zwei);
  stroke-dasharray: 6 3;
}

.g-reihe-3 {
  stroke: var(--farbe-erfolg);
  stroke-dasharray: 2 3;
}

.g-reihe-4 {
  stroke: var(--farbe-warnung);
  stroke-dasharray: 8 3 2 3;
}

.g-punkt.g-reihe-1 {
  fill: var(--farbe-akzent);
}

.g-punkt.g-reihe-2 {
  fill: var(--farbe-akzent-zwei);
}

.g-punkt.g-reihe-3 {
  fill: var(--farbe-erfolg);
}

.g-punkt.g-reihe-4 {
  fill: var(--farbe-warnung);
}

.g-marker {
  stroke: var(--farbe-text-leise);
  stroke-width: 1;
  stroke-dasharray: 3 3;
}

.g-marker-umsetzung,
.g-marker-deploy,
.g-marker-beitrag_live {
  stroke: var(--farbe-erfolg);
}

.g-marker-linkedin_post,
.g-marker-veroeffentlichung {
  stroke: var(--farbe-akzent);
}

.g-marker-kampagnenstart,
.g-marker-kampagnenende {
  stroke: var(--farbe-warnung);
}

.g-marker-stoerung {
  stroke: var(--farbe-fehler);
  stroke-dasharray: none;
}

.g-marker-freigabe,
.g-marker-sequenzschritt,
.g-marker-notiz {
  stroke: var(--farbe-akzent-zwei);
}

.g-marker-mehrere {
  stroke: var(--farbe-text);
}

.g-marker-nr {
  fill: var(--farbe-text);
  font-size: 10px;
}

.g-saeule {
  fill: var(--farbe-akzent);
}

.g-saeule-fehler {
  fill: var(--farbe-fehler);
}

.g-saeule-warnung {
  fill: var(--farbe-warnung);
}

.g-sockel {
  fill: var(--farbe-rand);
}

.g-referenz {
  stroke: var(--farbe-akzent-zwei);
  stroke-width: 2;
}

.g-grund {
  fill: var(--farbe-flaeche-zwei);
}

.g-ok {
  fill: var(--farbe-erfolg);
}

.g-fehler {
  fill: var(--farbe-fehler);
}

.g-warnung {
  fill: var(--farbe-warnung);
}

.g-wartet {
  fill: var(--farbe-akzent-zwei);
}

.g-laufend {
  fill: var(--farbe-rand);
}

.g-schwelle {
  stroke: var(--farbe-warnung);
  stroke-width: 2;
}

.g-vorher {
  fill: var(--farbe-text-leise);
}

.g-nachher {
  fill: var(--farbe-akzent);
}

.g-leer {
  fill: none;
  stroke: var(--farbe-rand);
  stroke-dasharray: 2 2;
}

.g-unvollstaendig {
  stroke: var(--farbe-text);
  stroke-dasharray: 4 2;
}

.grafik-schmal {
  display: none;
}

@media (max-width: 39.99rem) {
  .grafik-breit {
    display: none;
  }

  .grafik-schmal {
    display: block;
  }
}

.g-stueck-1 {
  fill: var(--farbe-akzent);
  stroke: var(--farbe-akzent);
}

.g-stueck-2 {
  fill: var(--farbe-akzent-zwei);
  stroke: var(--farbe-akzent-zwei);
}

.g-stueck-3 {
  fill: var(--farbe-erfolg);
  stroke: var(--farbe-erfolg);
}

.g-stueck-4 {
  fill: var(--farbe-warnung);
  stroke: var(--farbe-warnung);
}

.g-stueck-5 {
  fill: var(--farbe-marke-zwei);
  stroke: var(--farbe-marke-zwei);
}

.g-stueck-6 {
  fill: var(--farbe-indigo);
  stroke: var(--farbe-indigo);
}

.g-stueck-rest {
  fill: var(--farbe-neutral);
  stroke: var(--farbe-neutral);
}

circle.g-stueck-1,
circle.g-stueck-2,
circle.g-stueck-3,
circle.g-stueck-4,
circle.g-stueck-5,
circle.g-stueck-6,
circle.g-stueck-rest {
  fill: none;
  stroke-width: 26;
}

.grafik-torte {
  max-width: 30rem;
}
