/* Erzeugt von tools/diagramme/generate_charts.py – nicht von Hand ändern */
.shofu-chart text{font-family:Barlow, 'Barlow Semi Condensed', Arial, Helvetica, sans-serif;fill:#4D4D4D;font-weight:500}
.shofu-chart .sc-tick{font-size:18px;text-anchor:end}
.shofu-chart .sc-unit{font-size:20px}
.shofu-chart .sc-title{font-size:34px;fill:#004E7F}
.shofu-chart .sc-title .sc-star{font-size:22px}
.shofu-chart .sc-title .sc-zusatz{font-size:26px;fill:#808080}
.shofu-chart .sc-prod{font-size:17px;text-anchor:middle}
.shofu-chart .sc-maker{font-size:17px;font-weight:700;text-anchor:middle;fill:#808080}
.shofu-chart .sc-is-shofu .sc-prod{fill:#004E7F;font-weight:600}
.shofu-chart .sc-is-shofu .sc-maker{fill:#004E7F}
.shofu-chart .sc-fuss{font-size:15px;fill:#808080}
.shofu-chart .sc-axis-label{font-size:17px;letter-spacing:.12em;fill:#808080}
.shofu-chart .sc-axis-hi{fill:#004E7F;font-weight:700}
.shofu-chart.sc-dicht .sc-prod,.shofu-chart.sc-dicht .sc-tick{font-size:21px}
.shofu-chart.sc-dicht .sc-maker{font-size:19px}
.shofu-chart.sc-dicht .sc-unit{font-size:23px}
.shofu-chart .sc-polar-titel{font-size:34px;font-weight:600;text-anchor:middle}
.shofu-chart .sc-polar-titel.sc-kombi{fill:#004E7F}
.shofu-chart .sc-winkel,.shofu-chart .sc-ring{font-size:25px;fill:#808080;text-anchor:middle}
.shofu-chart .sc-prod .sc-star{font-size:13px}
.shofu-chart .sc-gruppe{font-size:23px;font-weight:700;text-anchor:middle}
.shofu-chart .sc-leg-name{font-size:19px}
.shofu-chart .sc-leg-maker{font-size:17px;fill:#808080}
.shofu-chart .sc-is-shofu .sc-leg-name{fill:#004E7F;font-weight:600}
.shofu-chart .sc-x-tick{font-size:18px;text-anchor:middle}
.shofu-chart .sc-x-unit{font-size:18px;text-anchor:end}
.shofu-chart .sc-anno{font-size:18px;fill:#808080;text-anchor:middle}
/* Liniendiagramm und Legenden: größere Schrift (breite Fläche, wenig Beschriftung) */
.shofu-chart.sc-linie .sc-tick,.shofu-chart.sc-linie .sc-x-tick,.shofu-chart.sc-linie .sc-x-unit,.shofu-chart.sc-linie .sc-unit{font-size:23px}
.shofu-chart.sc-linie .sc-leg-name{font-size:23px}
.shofu-chart.sc-linie .sc-anno{font-size:22px}
.shofu-chart.sc-gruppen .sc-leg-name{font-size:22px}
.shofu-chart.sc-gruppen .sc-leg-maker{font-size:19px}
.shofu-chart .sc-draw{animation:sc-draw 1.6s cubic-bezier(.45,.05,.35,1) both;animation-delay:200ms}
.shofu-chart .sc-punkte{animation:sc-fade .5s ease-out both;animation-delay:1.5s}
@keyframes sc-draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
.shofu-chart .sc-bar,.shofu-chart .sc-form{transform-box:fill-box;transform-origin:50% 100%;
  animation:sc-grow .9s cubic-bezier(.2,.75,.25,1) both}
.shofu-chart .sc-cap{animation:sc-fade .35s ease-out both;animation-delay:950ms}
.shofu-chart .sc-labels,.shofu-chart .sc-fade{animation:sc-fade .6s ease-out both}
.shofu-chart .sc-d0{animation-delay:150ms}
.shofu-chart .sc-d1{animation-delay:220ms}
.shofu-chart .sc-d2{animation-delay:290ms}
.shofu-chart .sc-d3{animation-delay:360ms}
.shofu-chart .sc-d4{animation-delay:430ms}
.shofu-chart .sc-d5{animation-delay:500ms}
.shofu-chart .sc-d6{animation-delay:570ms}
.shofu-chart .sc-d7{animation-delay:640ms}
.shofu-chart .sc-d8{animation-delay:710ms}
.shofu-chart .sc-d9{animation-delay:780ms}
.shofu-chart .sc-d10{animation-delay:850ms}
.shofu-chart .sc-d11{animation-delay:920ms}
.shofu-chart .sc-d12{animation-delay:990ms}
.shofu-chart .sc-d13{animation-delay:1060ms}
.shofu-chart .sc-d14{animation-delay:1130ms}
.shofu-chart .sc-d15{animation-delay:1200ms}
.shofu-chart .sc-cap.sc-d0{animation-delay:950ms}
.shofu-chart .sc-cap.sc-d1{animation-delay:1020ms}
.shofu-chart .sc-cap.sc-d2{animation-delay:1090ms}
.shofu-chart .sc-cap.sc-d3{animation-delay:1160ms}
.shofu-chart .sc-cap.sc-d4{animation-delay:1230ms}
.shofu-chart .sc-cap.sc-d5{animation-delay:1300ms}
.shofu-chart .sc-cap.sc-d6{animation-delay:1370ms}
.shofu-chart .sc-cap.sc-d7{animation-delay:1440ms}
.shofu-chart .sc-cap.sc-d8{animation-delay:1510ms}
.shofu-chart .sc-cap.sc-d9{animation-delay:1580ms}
.shofu-chart .sc-cap.sc-d10{animation-delay:1650ms}
.shofu-chart .sc-cap.sc-d11{animation-delay:1720ms}
.shofu-chart .sc-cap.sc-d12{animation-delay:1790ms}
.shofu-chart .sc-cap.sc-d13{animation-delay:1860ms}
.shofu-chart .sc-cap.sc-d14{animation-delay:1930ms}
.shofu-chart .sc-cap.sc-d15{animation-delay:2000ms}
/* pausiert nur, wenn das Diagramm-Skript läuft (html.sc-js, siehe header.php / shofu-charts.js) */
.sc-js .shofu-chart.is-waiting .sc-bar,.sc-js .shofu-chart.is-waiting .sc-form,.sc-js .shofu-chart.is-waiting .sc-cap,
.sc-js .shofu-chart.is-waiting .sc-labels,.sc-js .shofu-chart.is-waiting .sc-fade,
.sc-js .shofu-chart.is-waiting .sc-draw,.sc-js .shofu-chart.is-waiting .sc-punkte{animation-play-state:paused}
@keyframes sc-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes sc-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .shofu-chart .sc-bar,.shofu-chart .sc-form,.shofu-chart .sc-cap,.shofu-chart .sc-labels,.shofu-chart .sc-fade,
  .shofu-chart .sc-draw,.shofu-chart .sc-punkte{animation:none}
}
/* Einbettung (inc/svg.php) */
.svg-graphic{width:100%;margin:0 auto;}
.svg-graphic svg{display:block;width:100%;height:auto;}
.image .wrp > .svg-graphic{margin-left:0;margin-right:0;}
.textbild .bild.has-svg{height:auto;overflow:visible;}
/* Mobil: Balkendiagramme waagerecht scrollbar, Achse und Titel bleiben links stehen (assets/js/shofu-charts.js) */
.sc-achse-fix,.sc-wischen{display:none;}
@media screen and (max-width: 767px){
  .svg-graphic.sc-scroll{position:relative;}
  /* width:0 + min-width:100%: volle Breite, aber kein Mindestbreiten-Beitrag nach außen –
     sonst dehnt das 760px-SVG Grid-/Flex-Spalten (z. B. Doppelbild-Block) und die Seite wird breiter */
  .sc-scroll-inner{width:0;min-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;}
  .sc-scroll-inner svg.shofu-chart{min-width:760px;}
  .sc-scroll-inner svg.shofu-chart.sc-dicht{min-width:1000px;}
  .sc-scroll-inner .sc-achse,.sc-scroll-inner .sc-title{visibility:hidden;}
  /* Scrollleiste: 5 px, abgerundet (global in style.css bei ::-webkit-scrollbar); Firefox schmal */
  @supports not selector(::-webkit-scrollbar){
    .sc-scroll-inner{scrollbar-width:thin;scrollbar-color:#004E7F #f1f1f1;}
  }
  /* Ebene mit Achse und Titel über dem Scrollbereich. Auf Boxbreite beschnitten, sonst wird die ganze Seite breiter.
     --sc-h (Diagrammhöhe, eine sichtbare Scrollleiste bleibt frei) und --sc-achse (Achsbreite) setzt das Skript;
     1px nach links verlängert, damit am Rand kein Streifen des Scrollinhalts durchscheint. */
  .sc-achse-fix{display:block;position:absolute;z-index:2;left:-1px;top:0;width:calc(100% + 1px);height:var(--sc-h,100%);
    overflow:hidden;pointer-events:none;}
  .sc-achse-fix::before{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--sc-achse,0px) + 1px);background:#fff;}
  .sc-achse-fix::after{content:"";position:absolute;top:0;bottom:0;left:calc(var(--sc-achse,0px) + 1px);width:12px;
    opacity:0;transition:opacity .2s;background:linear-gradient(to right,#fff,rgba(255,255,255,0));}
  .gray-bg .sc-achse-fix::before{background:#EFEFEF;}
  .gray-bg .sc-achse-fix::after{background:linear-gradient(to right,#EFEFEF,rgba(239,239,239,0));}
  .svg-graphic.sc-scroll.sc-gescrollt .sc-achse-fix::after{opacity:1;}
  .sc-achse-fix svg{display:block;position:relative;z-index:1;margin-left:1px;max-width:none;height:auto;overflow:visible;}
  .sc-achse-fix svg > :not(.sc-achse):not(.sc-title){display:none;}
  /* Hinweis „wischen“ unter dem Diagramm, nur wenn tatsächlich gescrollt werden kann */
  .svg-graphic.sc-ueberbreit .sc-wischen{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;
    font-size:13px;line-height:1;font-weight:500;letter-spacing:.04em;color:#808080;}
  .svg-graphic .sc-wischen svg{display:block;width:18px;height:10px;flex:none;overflow:visible;}
  /* Pfeile wippen dreimal, sobald das Diagramm ins Bild kommt (.sc-sichtbar setzt das Skript) */
  .sc-wischen .sc-pfeil-l{animation:sc-wisch-l 1.6s ease-in-out .6s 3 paused;}
  .sc-wischen .sc-pfeil-r{animation:sc-wisch-r 1.6s ease-in-out .6s 3 paused;}
  .sc-sichtbar .sc-wischen svg{animation-play-state:running;}
  @keyframes sc-wisch-l{50%{transform:translateX(-3px)}}
  @keyframes sc-wisch-r{50%{transform:translateX(3px)}}
  .svg-graphic.sc-scroll::after{content:"";position:absolute;z-index:1;top:0;right:0;height:var(--sc-h,100%);width:32px;pointer-events:none;
    background:linear-gradient(to right,rgba(255,255,255,0),#fff);transition:opacity .2s;}
  .gray-bg .svg-graphic.sc-scroll::after{background:linear-gradient(to right,rgba(239,239,239,0),#EFEFEF);}
  .svg-graphic.sc-scroll.sc-ende::after{opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .svg-graphic .sc-wischen svg{animation:none}
}
/* beim Drucken nicht in der Startposition stehen bleiben */
@media print{
  .shofu-chart .sc-bar,.shofu-chart .sc-form,.shofu-chart .sc-cap,.shofu-chart .sc-labels,.shofu-chart .sc-fade,
  .shofu-chart .sc-draw,.shofu-chart .sc-punkte{animation:none}
}
