.pghm-ct{background:linear-gradient(135deg,#1b1f24,#2a2f36);border-radius:18px;padding:22px;color:#fff;max-width:1200px;margin:0 auto}
.pghm-ct-hero{display:flex;gap:16px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.pghm-ct-title{font-size:28px;font-weight:800;letter-spacing:.2px}
.pghm-ct-sub{opacity:.8;margin-top:4px}
.pghm-ct-filters{display:flex;gap:10px;align-items:center}
.pghm-ct-filters select{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px;min-width:220px}
.pghm-ct-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 16px}
.kpi{background:rgba(255,255,255,.06);border-radius:14px;padding:14px 14px 12px;border:1px solid rgba(255,255,255,.10)}
.kpi-label{opacity:.85;font-size:13px}
.kpi-value{font-size:28px;font-weight:900;margin-top:6px}
.kpi-trend{opacity:.8;font-size:12px;margin-top:2px}
.kpi-stress{border-left:4px solid #ff5b5b}
.kpi-perf{border-left:4px solid #2dd4bf}
.kpi-energy{border-left:4px solid #facc15}
.kpi-risk{border-left:4px solid #a78bfa}
.pghm-ct-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:14px}
.pghm-ct-panel{background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:14px}
.pghm-ct-panel-title{font-weight:800;margin-bottom:10px}
.pghm-ct-foot{opacity:.75;font-size:12px;margin-top:10px}
.pghm-ct-notes{line-height:1.5;opacity:.92}
@media (max-width: 980px){
  .pghm-ct-kpis{grid-template-columns:repeat(2,1fr)}
  .pghm-ct-grid{grid-template-columns:1fr}
  .pghm-ct-filters select{min-width:160px}
}

/* =========================================================
   Large Screen Optimierung (1600px – 2000px)
   ========================================================= */

.pghm-ct{
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
  padding: 28px;
}

@media (min-width: 1600px){
  .pghm-ct-grid{
    grid-template-columns: 2.3fr 1fr;
    gap: 20px;
  }

  .pghm-ct-kpis{
    grid-template-columns: repeat(4, minmax(280px, 1fr));
    gap: 18px;
  }

  .kpi-value{
    font-size: 32px;
  }

  #pghmCtChart{
    height: 360px !important;
  }

  .pghm-ct-hero{
    margin-bottom: 8px;
  }
}

@media (min-width: 1900px){
  #pghmCtChart{
    height: 420px !important;
  }
}

/* =========================================================
   Fix: Overflow / Chart ueber Container + CSS Namespace
   ========================================================= */

.pghm-ct{overflow:hidden;}
.pghm-ct .pghm-ct-panel{overflow:hidden;}

.pghm-ct canvas,
.pghm-ct-panel canvas{
  display:block;
  width:100% !important;
  max-width:100% !important;
}

/* Namespace KPI Styles (verhindert Konflikte mit Theme-Klassen) */
.pghm-ct .kpi{background:rgba(255,255,255,.06);border-radius:14px;padding:14px 14px 12px;border:1px solid rgba(255,255,255,.10)}
.pghm-ct .kpi-label{opacity:.85;font-size:13px}
.pghm-ct .kpi-value{font-size:28px;font-weight:900;margin-top:6px}
.pghm-ct .kpi-trend{opacity:.8;font-size:12px;margin-top:2px}
.pghm-ct .kpi-stress{border-left:4px solid #ff5b5b}
.pghm-ct .kpi-perf{border-left:4px solid #2dd4bf}
.pghm-ct .kpi-energy{border-left:4px solid #facc15}
.pghm-ct .kpi-risk{border-left:4px solid #a78bfa}

@media (min-width: 1600px){
  .pghm-ct .kpi-value{font-size:32px;}
}

/* =========================================================
   Fix: Fremd-CSS Konflikte (z.B. "Schwach" unten rechts)
   ========================================================= */
.pghm-ct .kpi,
.pghm-ct .kpi-label,
.pghm-ct .kpi-value,
.pghm-ct .kpi-trend{
  position: static !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  z-index: auto !important;
}