/* OWN / 2.6.4 / defipanter.css, SMB-1465 C2, Chart-Fundament + Marktuebersicht */
/* CUSTOM: SMB-1465 C2 (MODUL_ENTSCHEID_smb1465_c2 Abschnitt 6/M.2). Die dpz-*-Regeln standen bis
   hierher als <style>-Block je View; mit drei Views und einer Chart-Palette ist das die falsche
   Form. Diese Datei buendelt sie, plus die zehn Mehrserien-Farben aus dem Pantercon-Gradient.
   Ab Charge C3 ist ein Hex-Wert direkt in einer View oder Chart-Konfiguration ein Review-Fehler
   (Abschnitt M.2, "Bindung"): nur noch ueber diese Merkmale verweisen. */

:root {
    --ptz-serie-1: #5B215E;
    --ptz-serie-2: #6C2668;
    --ptz-serie-3: #7E2B71;
    --ptz-serie-4: #91307A;
    --ptz-serie-5: #A53481;
    --ptz-serie-6: #B93986;
    --ptz-serie-7: #D03F88;
    --ptz-serie-8: #F45D5E;
    --ptz-serie-9: #FF8A27;
    --ptz-serie-10: #FEBC00;
}

/* Bestandsuebernahme aus dem Metrik-Katalog (index.php, jetzt katalog.php), unveraendert */
.dpz-hero{background:linear-gradient(120deg,#5B215E,#AA146D);color:#fff;padding:34px 0;margin-bottom:22px;border-radius:0 0 10px 10px;}
.dpz-hero h1{font-size:1.9rem;font-weight:700;margin:0 0 6px;}
.dpz-hero p{font-size:.95rem;opacity:.92;max-width:640px;margin:0;}
.dpz-hero .dpz-count{font-size:.88rem;opacity:.92;}
.dpz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;}
.dpz-card{display:block;background:#fff;border:1px solid #ececec;border-radius:.6rem;padding:18px;text-decoration:none;color:#222;transition:box-shadow .15s,transform .1s;}
.dpz-card:hover{box-shadow:0 8px 24px rgba(91,33,94,.14);transform:translateY(-2px);color:#222;}
.dpz-card h3{font-size:1.05rem;font-weight:700;margin:0 0 6px;color:#5B215E;}
.dpz-card p{font-size:.85rem;color:#666;margin:0;}
.dpz-plus{color:#1a7f37;}
.dpz-minus{color:#c0392b;}
.dpz-kette{background:#f4ecf5;color:#5B215E;border-radius:4px;padding:2px 7px;font-size:.75rem;}
.dpz-table-wrap{overflow-x:auto;background:#fff;border:1px solid #ececec;border-radius:.5rem;}
table.dpz-table{width:100%;border-collapse:collapse;font-size:.85rem;}
table.dpz-table th,table.dpz-table td{padding:9px 12px;text-align:right;white-space:nowrap;border-bottom:1px solid #f0f0f0;}
table.dpz-table th:first-child,table.dpz-table td:first-child{text-align:left;}
table.dpz-table td.dpz-text,table.dpz-table th.dpz-text{text-align:left;}
table.dpz-table thead th{background:#faf7fb;color:#5B215E;font-weight:700;font-size:.78rem;text-transform:uppercase;}
table.dpz-table thead th a{color:inherit;text-decoration:none;}
table.dpz-table tbody tr:hover{background:#faf7fb;}
table.dpz-table td a.dpz-row-link{color:#222;text-decoration:none;font-weight:600;}
.dpz-empty{padding:40px 20px;text-align:center;color:#888;}

/* SMB-1465 C2: Marktuebersicht (start.php) */
.dpz-start-kopf{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:18px;}
.dpz-start-kopf h1{font-size:1.7rem;font-weight:700;margin:0;color:#fff;}
.dpz-start-kopf p{font-size:.88rem;opacity:.9;margin:6px 0 0;max-width:600px;color:#fff;}
.dpz-veraltet{font-size:.76rem;background:rgba(255,255,255,.16);border-radius:4px;padding:4px 9px;white-space:nowrap;color:#fff;}

.dpz-kennzahlen{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:18px;}
.dpz-kzcard{background:#fff;border:1px solid #ececec;border-radius:.6rem;padding:14px 16px;}
.dpz-kzcard .dpz-kz-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:#888;font-weight:700;margin-bottom:4px;}
.dpz-kzcard .dpz-kz-wert{font-size:1.28rem;font-weight:700;color:#222;}
.dpz-kzcard .dpz-kz-delta{font-size:.8rem;margin-top:2px;}

.dpz-reiter{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.dpz-reiter a{display:inline-block;padding:6px 13px;border-radius:20px;border:1px solid #e0d3e1;color:#5B215E;text-decoration:none;font-size:.82rem;font-weight:600;background:#fff;}
.dpz-reiter a:hover{background:#faf7fb;}
.dpz-reiter a.active{background:#5B215E;color:#fff;border-color:#5B215E;}

.dpz-chartcard{background:#fff;border:1px solid #ececec;border-radius:.6rem;padding:18px;margin-bottom:22px;}
.dpz-chartcard-kopf{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:10px;}
.dpz-chartcard-titel{font-size:.9rem;color:#666;font-weight:700;text-transform:uppercase;letter-spacing:.03em;}
.dpz-chartcard-wert{font-size:1.7rem;font-weight:700;color:#222;}
.dpz-zeitraum{display:flex;gap:4px;}
.dpz-zeitraum a{padding:5px 10px;border-radius:4px;border:1px solid #e0d3e1;color:#5B215E;text-decoration:none;font-size:.78rem;font-weight:600;}
.dpz-zeitraum a.active{background:#5B215E;color:#fff;border-color:#5B215E;}
.dpz-chart-flaeche{height:340px;}
.dpz-chart-leer{padding:60px 20px;text-align:center;color:#888;font-size:.88rem;}

.dpz-rl-titel{font-size:1.05rem;font-weight:700;color:#222;margin:0 0 10px;}

@media (max-width:640px){
    .dpz-kennzahlen{grid-template-columns:repeat(2,1fr);}
    .dpz-chart-flaeche{height:260px;}
}

/* CUSTOM: SMB-1465 Teil C "Karosse" (BRIEF_smb1465_karosse_defipanter_nav_1zu1.md). Modul-
   Navigation, Hub-Kacheln und die Kennzeichnung "im Aufbau". Die Farbwerte kommen aus den
   Merkmalen unten statt als Hex direkt in der Regel (Abschnitt M.2 Bindung); die drei neuen
   Merkmale sind dieselben CI-Werte, die der Gradient oben schon fuehrt. */
:root {
    --ptz-ci-primaer: #5B215E;
    --ptz-ci-magenta: #AA146D;
    --ptz-ci-gold: #FEBC00;
    --ptz-nav-rand: #e0d3e1;
    --ptz-nav-grund: #ffffff;
}

/* CUSTOM: SMB-1490 -- Ebene L1 der Tabelle PZ-HEADER-LAYERS (assets/css/style-2.6.css).
   --ptz-header-h mass frueher nur den Header ohne Banner, die Leiste klebte deshalb bei
   aktivem Banner an der falschen Hoehe. --ptz-top-h misst die ganze Kopfzone #pz-top-zone.
   z-index 30 -> 90 nach Tabelle, ohne Wirkungsaenderung (L2 liegt weiterhin darueber). */
.dpz-nav{background:var(--ptz-nav-grund);border-bottom:1px solid var(--ptz-nav-rand);position:sticky;top:var(--ptz-top-h, 0px);z-index:90;}
/* SMB-1465 C11: der Knopf steht NEBEN der Eintragsliste, nicht darin. Die Liste rollt waagrecht
   (overflow-x), ein Kind darin waere auf dem Telefon nach dem dritten Eintrag aus dem Bild
   gerollt. flex:0 0 auto haelt ihn am Platz, min-width:0 auf der Liste ist die Bedingung dafuer,
   dass eine rollende Flex-Box neben einem festen Geschwister ueberhaupt schrumpfen darf. */
.dpz-nav-inner{position:relative;display:flex;align-items:center;gap:8px;}
.dpz-nav-liste{list-style:none;margin:0;padding:0;display:flex;gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch;flex:1 1 auto;min-width:0;}
.dpz-nav-suche{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--ptz-ci-primaer);border-radius:6px;color:var(--ptz-ci-primaer);font-size:.8rem;font-weight:600;padding:6px 10px;cursor:pointer;white-space:nowrap;}
.dpz-nav-suche:hover,.dpz-nav-suche:focus{border-color:var(--ptz-ci-magenta);color:var(--ptz-ci-magenta);}
/* Auf schmalen Bildschirmen bleibt das Lupenzeichen, das Wort geht. Der Knopf ist dort ein
   Symbol mit aria-label, keine unbeschriftete Flaeche. */
@media (max-width:575.98px){.dpz-nav-suche-text{display:none;}}
.dpz-nav-item{flex:0 0 auto;}
.dpz-nav-link{display:block;padding:11px 13px;font-size:.84rem;font-weight:600;color:var(--ptz-ci-primaer);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;cursor:pointer;}
.dpz-nav-link:hover,.dpz-nav-link:focus{color:var(--ptz-ci-magenta);text-decoration:none;}
.dpz-nav-link.aktiv{border-bottom-color:var(--ptz-ci-gold);}
.dpz-nav-klapp > summary{list-style:none;}
.dpz-nav-klapp > summary::-webkit-details-marker{display:none;}
.dpz-nav-klapp > summary::after{content:" \25BE";font-size:.7rem;}
.dpz-nav-panel{position:absolute;left:0;right:0;top:100%;background:var(--ptz-nav-grund);border:1px solid var(--ptz-nav-rand);border-top:none;border-radius:0 0 .5rem .5rem;box-shadow:0 12px 28px rgba(91,33,94,.14);padding:16px 18px 18px;z-index:31;max-height:70vh;overflow-y:auto;}
.dpz-nav-panel-hub{display:inline-block;margin-bottom:10px;font-size:.8rem;font-weight:700;color:var(--ptz-ci-magenta);text-decoration:none;}
.dpz-nav-panel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 18px;}
.dpz-nav-panel-grid a{display:block;padding:5px 0;font-size:.82rem;color:#333;text-decoration:none;border-bottom:1px solid #f4f0f4;}
.dpz-nav-panel-grid a:hover{color:var(--ptz-ci-primaer);}

.dpz-navunten{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:20px;margin-top:34px;padding-top:20px;border-top:1px solid #ececec;}
.dpz-navunten-spalte h4{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#888;font-weight:700;margin:0 0 8px;}
.dpz-navunten-spalte ul{list-style:none;margin:0;padding:0;}
.dpz-navunten-spalte li{padding:3px 0;}
.dpz-navunten-spalte a{font-size:.83rem;color:#444;text-decoration:none;}
.dpz-navunten-spalte a:hover{color:var(--ptz-ci-primaer);}

.dpz-aufbau{background:var(--ptz-nav-grund);border:1px solid var(--ptz-nav-rand);border-left:4px solid var(--ptz-ci-gold);border-radius:.6rem;padding:26px 28px;max-width:720px;}
.dpz-aufbau-marke{display:inline-block;background:#fff6d9;color:#7a5c00;border-radius:20px;padding:3px 11px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
.dpz-aufbau h2{font-size:1.35rem;font-weight:700;color:#222;margin:12px 0 8px;}
.dpz-aufbau p{font-size:.92rem;color:#555;margin:0 0 8px;}
.dpz-aufbau .dpz-aufbau-klein{font-size:.8rem;color:#888;margin:0;}
/* SMB-1465 C5: der Datenlage-Satz. Er steht optisch ueber dem grauen Kleingedruckten, weil er
   die eigentliche Aussage der Seite traegt: hier fehlt nicht die Zeit, hier fehlt die Quelle. */
.dpz-aufbau .dpz-aufbau-datenlage{font-size:.9rem;color:#7a5c00;background:#fff6d9;border-radius:.4rem;padding:10px 12px;margin:0 0 10px;}

/* CUSTOM: SMB-1465 C4a, Protokoll-Detailseite (Werkpaket W2).
   KEIN NEUER FARBWERT: alles greift auf die bereits gesetzten Variablen --ptz-serie-1 bis -10
   und die Grautoene der Bestandskarten zurueck. Das ist Abbruchkriterium 6 des Hefts und
   zugleich die Bedingung dafuer, dass das Theme-System (SMB-1240) die Seite spaeter mitnimmt,
   ohne dass hier etwas nachgezogen werden muss. */

.dpz-p-layout{display:grid;grid-template-columns:minmax(260px,1fr) minmax(320px,2fr);gap:22px;align-items:start;}
@media (max-width:900px){.dpz-p-layout{grid-template-columns:1fr;}}

.dpz-p-kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.dpz-p-kachel{background:#fff;border:1px solid #ececec;border-radius:.5rem;padding:12px 14px;}
.dpz-p-kachel .l{font-size:.72rem;text-transform:uppercase;color:#888;margin-bottom:4px;}
.dpz-p-kachel .v{font-size:1.05rem;font-weight:700;color:#222;}

/* Die Schalterleisten des Charts. Gleiche Bauart wie .dpz-zeitraum aus C2, damit Reiter,
   Aufloesung und Schalter als eine Familie lesbar sind statt als drei Erfindungen. */
.dpz-p-schalter{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:10px;}
.dpz-p-reiter{display:flex;gap:4px;flex-wrap:wrap;}
.dpz-p-reiter a{padding:5px 10px;border-radius:4px;border:1px solid #e0d3e1;color:var(--ptz-serie-1);
    text-decoration:none;font-size:.78rem;font-weight:600;}
.dpz-p-reiter a.active{background:var(--ptz-serie-1);color:#fff;border-color:var(--ptz-serie-1);}
.dpz-p-schalter-gruppe{display:flex;gap:4px;align-items:center;}
.dpz-p-schalter-gruppe .l{font-size:.72rem;color:#888;text-transform:uppercase;margin-right:2px;}

.dpz-p-block{background:#fff;border:1px solid #ececec;border-radius:.5rem;padding:16px;margin-bottom:18px;}
.dpz-p-block h3{font-size:.8rem;text-transform:uppercase;color:var(--ptz-serie-3);margin:0 0 10px;font-weight:700;}
.dpz-p-block p{font-size:.88rem;line-height:1.5;color:#444;margin:0 0 10px;}
.dpz-p-block a{color:var(--ptz-serie-1);}

.dpz-p-felder{list-style:none;margin:0;padding:0;font-size:.85rem;}
.dpz-p-felder li{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid #ececec;}
.dpz-p-felder li:last-child{border-bottom:none;}
.dpz-p-felder .f{color:#888;min-width:130px;}
.dpz-p-felder .w{color:#222;word-break:break-word;}

.dpz-p-methodik dt{font-size:.78rem;font-weight:700;color:#555;margin-top:8px;}
.dpz-p-methodik dd{font-size:.85rem;color:#444;margin:2px 0 0;line-height:1.5;}

.dpz-p-hack{border-left:3px solid var(--ptz-serie-8);padding-left:12px;margin-bottom:14px;}
.dpz-p-hack:last-child{margin-bottom:0;}

.dpz-p-liste{list-style:none;margin:0;padding:0;font-size:.85rem;}
.dpz-p-liste li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid #ececec;}
.dpz-p-liste li:last-child{border-bottom:none;}
.dpz-p-liste .z{color:#888;white-space:nowrap;}

/* CUSTOM: SMB-1465 C4b. Zeitraum-Tabelle der Protokoll- und Familien-Detailseite.
   Perioden als Spalten, neueste links, die laufende mit einem Stern.

   Der Rahmen scrollt waagrecht fuer sich allein. Die Tabelle wird bei der Monats-Aufloesung bis
   zu 24 Spalten breit, und eine Seite, die als Ganzes waagrecht scrollt, verliert dabei ihre
   Navigation aus dem Blick. */
.dpz-p-zeitraum-wrap{overflow-x:auto;margin-bottom:10px;}
.dpz-p-zeitraum{width:100%;border-collapse:collapse;font-size:.82rem;}
.dpz-p-zeitraum th,.dpz-p-zeitraum td{padding:6px 10px;text-align:right;white-space:nowrap;
    border-bottom:1px solid #ececec;}
.dpz-p-zeitraum thead th{color:var(--ptz-serie-3);font-weight:700;font-size:.74rem;
    text-transform:uppercase;}
.dpz-p-zeitraum tbody th[scope=row]{text-align:left;color:#555;font-weight:600;}
.dpz-p-zeitraum tbody tr:last-child th,.dpz-p-zeitraum tbody tr:last-child td{border-bottom:none;}

/* Die Kategorie eines Teilprotokolls im Produkte-Block. Sie steht zwischen Name und Betrag und
   darf den Betrag nicht wegdruecken, deshalb schrumpfbar statt fest. */
.dpz-p-liste .dpz-kette{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;}

/* CUSTOM: SMB-1465 C2-Nachzug. Metrik-Reiter ueber dem Startseiten-Chart.
   Bewusst dieselbe Formensprache wie der Zeitraum-Umschalter darueber, nur unterhalb der
   Kopfzeile und ueber voller Breite: die beiden Schalter tun dasselbe (sie laden die Seite mit
   einer anderen Sicht neu) und sollen deshalb nicht wie zwei verschiedene Bedienarten aussehen. */
.dpz-metrikreiter{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 12px;}
.dpz-metrikreiter a{padding:5px 10px;border-radius:4px;border:1px solid #e0d3e1;
    color:var(--ptz-serie-1);text-decoration:none;font-size:.78rem;font-weight:600;}
.dpz-metrikreiter a.active{background:var(--ptz-serie-1);color:#fff;border-color:var(--ptz-serie-1);}

/* CUSTOM: SMB-1465 C8. Die zwei Matrix-Seiten (Top-Protokolle, Korrelation). Beide liegen im
   bestehenden .dpz-table-wrap, der schon seit W2 waagrecht schiebt; hier kommt nur dazu, was
   eine Matrix von einer Rangliste unterscheidet. */
.dpz-matrix td,.dpz-matrix th{white-space:nowrap;vertical-align:top;}
/* Der Betrag steht unter dem Namen, nicht daneben: eine Zelle traegt zwei Angaben, und
   nebeneinander waere die Spalte doppelt so breit wie noetig. */
.dpz-matrix-wert{display:block;font-size:.72rem;opacity:.7;}
.dpz-korrelation td{text-align:center;font-variant-numeric:tabular-nums;}
/* Die Faerbung ist eine Lesehilfe, KEIN zweiter Kanal: der Zahlenwert steht in jeder Zelle, wer
   die Toene nicht unterscheidet verliert nichts. Deshalb auch nur eine gedeckte Flaeche und
   keine Ampel: die Korrelation ist keine Bewertung, hoch ist nicht gut und tief nicht schlecht. */
.dpz-korr-hoch{background:#5b215e;color:#fff;}
.dpz-korr-mittel{background:#b79ab8;color:#2b122d;}
.dpz-korr-schwach{background:#f3eef4;color:#2b122d;}
.dpz-korr-gegen{background:#febc00;color:#2b122d;}
.dpz-korr-leer{color:#999;}