/* ============================================================================ VM Widgets - Zusätzliche Widget-Styles ============================================================================ Diese Datei enthält CSS für neue Widgets, die nicht in main.css enthalten sind. Bestehende Styles aus main.css werden wiederverwendet. ============================================================================ */ /* ---------------------------------------------------------------------------- Widget:HGK-Belege (.dashHgkBelege) Struktur wie dashSammelauflistungen ---------------------------------------------------------------------------- */ .dashHgkBelege{& > .dashInnerBox{& > div:nth-child(2){/* Statistik-Bereich im Kopf */ & > div:nth-child(1){display:flex;flex-wrap:wrap;gap:0.5rem 1.5rem;& > div{& > div:nth-child(1){font-size:0.85em;font-weight:300}& > div:nth-child(2){font-weight:600}}}/* Letzte Belege - wie Sammelauflistungen */ & > div:nth-child(2){& > div:nth-child(2){& > *, & > *:active, & > *:hover{/* Icon */ & > div:nth-child(1){display:flex;align-items:center;font-size:1.1em}/* Label (Belegnr + Datum) */ & > div:nth-child(2){flex:1 1 auto;& > div:nth-child(1){font-weight:600}& > div:nth-child(2){display:flex;gap:0.25rem;align-items:start;font-weight:300;font-size:0.9em}}/* Betrag + Belegart */ & > div:nth-child(3){text-align:right;& > div:nth-child(1){font-weight:600}& > div:nth-child(2){font-weight:300;font-size:0.9em}}}}}}}}/* Halbe Breite */
.dashHalf > .dashHgkBelege{& > .dashInnerBox{& > div:nth-child(2){/* Statistik - nur erste Box (Gesamt) anzeigen */ & > div:nth-child(1){flex-direction:column;gap:0.25rem;/* Nur "Belege gesamt" anzeigen */ & > div:not(:first-child){display:none}}& > div:nth-child(2){/* Überschrift ausblenden */ & > div:nth-child(1){display:none}& > div:nth-child(2){& > *, & > *:active, & > *:hover{/* Icon ausblenden, Punkt anzeigen */ & > div:nth-child(1){font-size:0;&:after{content:'';display:block;width:0.375rem;height:0.375rem;border-radius:100%;background-color:var(--color-hgk-textblue)}}/* Label - nur Datum */ & > div:nth-child(2){& > div:nth-child(1){font-weight:500}& > div:nth-child(2){display:none}}/* Betrag */ & > div:nth-child(3){& > div:nth-child(1){font-weight:400}/* Belegart ausblenden */ & > div:nth-child(2){display:none}}}}}}}}/* ---------------------------------------------------------------------------- Widget:BestPrice (.dashBestPrice) Struktur wie dashSammelauflistungen ---------------------------------------------------------------------------- */ .dashBestPrice{& > .dashInnerBox{& > div:nth-child(2){/* Statistik-Bereich im Kopf */ & > div:nth-child(1){display:flex;flex-wrap:wrap;gap:0.5rem 1.5rem;& > div{& > div:nth-child(1){font-size:0.85em;font-weight:300}& > div:nth-child(2){font-weight:600}}}/* Nicht unterzeichnete Konditionen */ & > div:nth-child(2){& > div:nth-child(2){& > *, & > *:active, & > *:hover{border-left:3px solid var(--hgk-infotext-redalert);/* Icon */ & > div:nth-child(1){display:flex;align-items:center;font-size:1.1em}/* Label (Name + Typ) */ & > div:nth-child(2){flex:1 1 auto;& > div:nth-child(1){font-weight:600}& > div:nth-child(2){font-weight:300;font-size:0.9em}}/* Preisvorteil + Konditionen */ & > div:nth-child(3){text-align:right;& > div:nth-child(1){font-weight:600}& > div:nth-child(2){font-weight:300;font-size:0.9em}}}/* Alle unterzeichnet Meldung */ & > .bpAllSigned{border-left:3px solid var(--hgk-infotext-greenalert);display:flex;gap:0.5rem;align-items:center;& > div:nth-child(1){font-size:1.25em}& > div:nth-child(2){font-weight:500}}}}}}}/* Halbe Breite */
.dashHalf > .dashBestPrice{& > .dashInnerBox{& > div:nth-child(2){/* Statistik - nur Unterzeichnet und Offen */ & > div:nth-child(1){flex-direction:column;gap:0.25rem;/* Gesamt ausblenden */ & > div:nth-child(3){display:none}}& > div:nth-child(2){/* Überschrift ausblenden */ & > div:nth-child(1){display:none}& > div:nth-child(2){/* Nur 2 Einträge in halber Kachel */ & > *:nth-child(n+3):not(.bpAllSigned){display:none}& > *, & > *:active, & > *:hover{/* Icon ausblenden, Punkt anzeigen */ & > div:nth-child(1){font-size:0;flex-shrink:0;&:after{content:'';display:block;width:0.375rem;height:0.375rem;border-radius:100%;background-color:var(--hgk-infotext-redalert)}}/* Label - nur Name, mit Overflow */ & > div:nth-child(2){overflow:hidden;& > div:nth-child(1){font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}& > div:nth-child(2){display:none}}/* Preisvorteil - mit Overflow */ & > div:nth-child(3){flex-shrink:0;max-width:40%;overflow:hidden;& > div:nth-child(1){font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}/* Konditionen ausblenden */ & > div:nth-child(2){display:none}}}/* Alle unterzeichnet Meldung */ & > .bpAllSigned{& > div:nth-child(1){font-size:0;&:after{content:'';display:block;width:0.375rem;height:0.375rem;border-radius:100%;background-color:var(--hgk-infotext-greenalert)}}}}}/* Alle anzeigen - weniger Abstand */ & > div:nth-child(3){margin-top:auto;padding-top:0.5rem}}}}/* ---------------------------------------------------------------------------- Widget:Stammdaten (.dashStammdaten) Einfache Statistik-Anzeige mit 4 Werten untereinander ---------------------------------------------------------------------------- */
.dashStammdaten{& > .dashInnerBox{& > div:nth-child(2){/* Statistik-Bereich - alle Werte untereinander */ & > div:nth-child(1){display:flex;flex-direction:column;gap:0.5rem;& > div{display:flex;justify-content:space-between;align-items:center;gap:1rem;& > div:nth-child(1){font-weight:300}& > div:nth-child(2){font-weight:600;text-align:right}}}/* Alle Stammdaten Link */ & > div:nth-child(2){margin-top:auto}}}}/* Halbe Breite */
.dashHalf > .dashStammdaten{& > .dashInnerBox{& > div:nth-child(2){& > div:nth-child(1){/* Genossenschaftsanteile ausblenden */ & > div:nth-child(4){display:none}}}}}/* ---------------------------------------------------------------------------- Widget:Vertragsmanagement (.dashVertragsmanagement) Statistiken + Erinnerungsliste ---------------------------------------------------------------------------- */
.dashVertragsmanagement{& > .dashInnerBox{& > div:nth-child(2){/* Statistik-Bereich im Kopf */ & > div:nth-child(1){display:flex;flex-wrap:wrap;gap:0.5rem 1.5rem;& > div{& > div:nth-child(1){font-size:0.85em;font-weight:300}& > div:nth-child(2){font-weight:600}}}/* Erinnerungsliste */ & > div:nth-child(2){& > div:nth-child(2){& > a, & > a:visited, & > a:hover{border-left:3px solid var(--hgk-infotext-greenalert);/* Icon */ & > div:nth-child(1){display:flex;align-items:center;font-size:1.1em}/* Label (Titel + Typ) */ & > div:nth-child(2){flex:1 1 auto;& > div:nth-child(1){font-weight:600}& > div:nth-child(2){font-weight:300;font-size:0.9em}}/* Datum */ & > div:nth-child(3){text-align:right;font-weight:500}}/* Farbcodierung je nach Eskalation */ & > a:has(.textAlertRed){border-left-color:var(--hgk-infotext-redalert)}& > a:has(.textAlertOrange){border-left-color:var(--hgk-infotext-orangealert)}/* Keine Erinnerungen Meldung */ & > .vmNoErinnerungen{border-left:3px solid var(--hgk-infotext-greenalert);display:flex;gap:0.5rem;align-items:center;& > div:nth-child(1){font-size:1.25em}& > div:nth-child(2){font-weight:500}}}}/* Kein Zugriff */ & > .vmNoAccess{display:flex;gap:0.75rem;align-items:center;padding:1rem 0;& > div:nth-child(1){font-size:1.5em;opacity:0.5}& > div:nth-child(2){font-weight:300}}}}}/* Halbe Breite */
.dashHalf > .dashVertragsmanagement{& > .dashInnerBox{& > div:nth-child(2){/* Statistik - nur Aktiv und Erinnerungen */ & > div:nth-child(1){flex-direction:column;gap:0.25rem;/* Auslaufend und Gesamt ausblenden */ & > div:nth-child(2), & > div:nth-child(4){display:none}}& > div:nth-child(2){/* Überschrift ausblenden */ & > div:nth-child(1){display:none}/* Nur 2 Einträge */ & > div:nth-child(2){& > a:nth-child(n+3){display:none}& > a, & > a:visited, & > a:hover{border-left-width:3px;/* Icon ausblenden, Punkt anzeigen */ & > div:nth-child(1){font-size:0;flex-shrink:0;&:after{content:'';display:block;width:0.375rem;height:0.375rem;border-radius:100%;background-color:var(--hgk-infotext-greenalert)}}/* Farbige Punkte je nach Eskalation */ &:has(.textAlertRed) > div:nth-child(1):after{background-color:var(--hgk-infotext-redalert)}&:has(.textAlertOrange) > div:nth-child(1):after{background-color:var(--hgk-infotext-orangealert)}/* Label - nur Titel */ & > div:nth-child(2){overflow:hidden;& > div:nth-child(1){font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}& > div:nth-child(2){display:none}}/* Datum ausblenden */ & > div:nth-child(3){display:none}}/* Keine Erinnerungen */ & > .vmNoErinnerungen{& > div:nth-child(1){font-size:0;&:after{content:'';display:block;width:0.375rem;height:0.375rem;border-radius:100%;background-color:var(--hgk-infotext-greenalert)}}}}}}}}/* ============================================================================ ADMIN-BEREICH WIDGETS ============================================================================ */ /* ---------------------------------------------------------------------------- Widget:Abrechnungen & Synchronisation (.dashSystemstatus) ---------------------------------------------------------------------------- */
.dashSystemstatus .dashInnerBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) > div{border-left-color:var(--color-hgk-textblue) !important}.dashSystemstatus .dashInnerBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(3){text-align:right !important;margin-left:auto}.dashSystemstatus .dashInnerBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) > .abrechnungGruen{border-left-color:var(--hgk-infotext-greenalert) !important;color:var(--hgk-infotext-greenalert)}/* Halbe Breite - Übernächste Abrechnung ausblenden */
.dashHalf > .dashSystemstatus{& > .dashInnerBox{& > div:nth-child(2){& > div:nth-child(2){& > div:nth-child(2){& > div:nth-child(3){display:none}}}}}}/* Service-Indicator Sammelklasse */
.tblIndicatorService,
.tblIndicatorService:visited,
.tblIndicatorService:hover{background-color:var(--hgk-indicator-blue)}/* ---------------------------------------------------------------------------- Widget:Mitglieder & Lieferanten (.dashMitgliederLieferanten) Kompakte Übersicht mit Entwicklungs-Tabelle ---------------------------------------------------------------------------- */
.dashMitgliederLieferanten{& > .dashInnerBox{/* Icon grün */ & > div:nth-child(1) > .icon.active{background:var(--hgk-infotext-greenalert)}& > div:nth-child(2){display:flex;flex-direction:column;gap:0.75rem;/* Kompakte Statistik-Zeilen oben */ & > .mlStatsCompact{display:flex;flex-direction:column;gap:0.375rem;& > .mlStatRow, & > .mlStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;border-left:3px solid var(--hgk-infotext-greenalert);border-right:none;border-top:none;border-bottom:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1.1em;opacity:0.7;flex-shrink:0;flex:none}/* Label */ & > div:nth-child(2){flex:1 1 auto;font-weight:400;font-size:0.9em}/* Wert */ & > div:nth-child(3){font-weight:700;font-size:1.1em;flex-shrink:0;flex:none}/* Gesamt-Zahl */ & > .mlStatSub{font-weight:300;font-size:0.85em;opacity:0.7;flex-shrink:0;flex:none}}}/* Entwicklungs-Tabelle */ & > .mlEntwicklung{& > .mlEntwicklungHeader{font-weight:500;font-size:0.9em;margin-bottom:0.375rem}& > .mlEntwicklungTable{display:flex;flex-direction:column;gap:0.25rem;/* Kopfzeile */ & > .mlEntwicklungHead, & > .mlEntwicklungHead:hover{display:grid;grid-template-columns:5rem 1fr 1fr 1fr;gap:0.5rem;padding:0.25rem 0.5rem;font-size:0.8em;font-weight:500;opacity:0.7;border:none;background:transparent;flex-direction:row;& > div, & > div:hover{text-align:right;flex:none;border:none;background:transparent}& > div:first-child, & > div:first-child:hover{text-align:left}}/* Datenzeilen */ & > .mlEntwicklungRow, & > .mlEntwicklungRow:hover{display:grid;grid-template-columns:5rem 1fr 1fr 1fr;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.9em;align-items:center;border:none;flex-direction:row;/* Zeitraum-Label */ & > div:first-child{font-weight:500;flex:none}/* Zahlen rechtsbündig */ & > div:not(:first-child){text-align:right;font-weight:600;flex:none}/* Saldo mit Icon */ & > .mlSaldo{display:flex;align-items:center;justify-content:flex-end;gap:0.25rem;& > .iconsLine{font-size:1.1em}}}/* Vorjahr etwas dezenter */ & > .mlEntwicklungRowLast{opacity:0.75}}}}}}/* Halbe Breite */
.dashHalf > .dashMitgliederLieferanten{& > .dashInnerBox{& > div:nth-child(2){gap:0.5rem;/* Kompakte Stats bleiben gleich */ & > .mlStatsCompact{gap:0.25rem;& > .mlStatRow{padding:0.25rem 0.5rem;& > div:nth-child(2){font-size:0.85em}& > div:nth-child(3){font-size:1em}& > .mlStatSub{display:none}}}/* Entwicklung:kompakter ohne Überschrift */ & > .mlEntwicklung{& > .mlEntwicklungHeader{display:none}& > .mlEntwicklungTable{& > .mlEntwicklungHead{display:none}& > .mlEntwicklungRow{grid-template-columns:4rem 1fr 1fr 1fr;font-size:0.8em;padding:0.25rem 0.375rem;&:hover{display:grid;grid-template-columns:4rem 1fr 1fr 1fr;font-size:0.8em;padding:0.25rem 0.375rem;& > div{flex:none;border:none}}}}}}}}/* ---------------------------------------------------------------------------- Widget:Gesamtumsatz (.dashGesamtumsatz) Layout analog zu Mitglieder & Lieferanten ---------------------------------------------------------------------------- */
.dashGesamtumsatz{& > .dashInnerBox{/* Icon blau */ & > div:nth-child(1) > .icon.umsatzIcon{background:var(--color-hgk-textblue)}& > div:nth-child(2){display:flex;flex-direction:column;gap:0.75rem !important;/* Kompakte Statistik-Zeilen oben (Vergleichszeitraum) */ & > .umsatzStatsCompact{display:flex;flex-direction:column;gap:0.375rem;flex:0 0 auto !important;padding:0 !important;background:transparent !important;border-radius:0 !important;& > .umsatzStatRow, & > .umsatzStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;border-left:3px solid var(--color-hgk-textblue);border-right:none;border-top:none;border-bottom:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1.1em;opacity:0.7;flex-shrink:0;flex:none}/* Jahr */ & > div:nth-child(2){font-weight:500;min-width:2.5rem;flex:none}/* Umsatz */ & > div:nth-child(3){font-weight:700;font-size:1.1em;flex:1 1 auto;text-align:right}/* Entwicklung */ & > .umsatzEntw{display:flex;align-items:center;gap:0.25rem;font-weight:600;flex-shrink:0;flex:none;& > .iconsLine{font-size:1em}}}/* Aktuelles Jahr hervorgehoben */ & > .umsatzStatAktuell{border-left-color:var(--hgk-infotext-greenalert)}}/* Zeitraum-Info klein - überschreibt main.css nth-child(2) styles */ & > .umsatzZeitraumInfo{font-size:0.75em;font-weight:300;opacity:0.7;text-align:left;margin:0;padding:0 0 0 0.5rem;flex:0 0 auto !important;background:transparent !important;border-radius:0 !important}/* Entwicklungs-Tabelle (Jahresumsatz gesamt) */ & > .umsatzEntwicklung{margin-top:0;flex:0 0 auto !important;& > .umsatzEntwicklungHeader{font-weight:500;font-size:0.9em;margin-bottom:0.25rem}& > .umsatzEntwicklungTable{display:flex;flex-direction:column;gap:0.25rem;/* Kopfzeile */ & > .umsatzEntwicklungHead, & > .umsatzEntwicklungHead:hover{display:grid;grid-template-columns:3rem 1fr 1fr;gap:0.5rem;padding:0.25rem 0.5rem;font-size:0.8em;font-weight:500;opacity:0.7;border:none;background:transparent;flex-direction:row;& > div, & > div:hover{text-align:right;flex:none;border:none;background:transparent}& > div:first-child, & > div:first-child:hover{text-align:left}}/* Datenzeilen */ & > .umsatzEntwicklungRow, & > .umsatzEntwicklungRow:hover{display:grid;grid-template-columns:3rem 1fr 1fr;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.9em;align-items:center;border:none;flex-direction:row;/* Jahr */ & > div:first-child{font-weight:500;flex:none}/* Werte rechtsbündig */ & > div:not(:first-child){text-align:right;font-weight:600;flex:none}& > .umsatzEntw{display:flex;align-items:center;justify-content:flex-end;gap:0.25rem;& > .iconsLine{font-size:1em}}}/* Vorvorjahr dezenter */ & > .umsatzEntwicklungRowLast{opacity:0.75}}}}}}/* Halbe Breite */
.dashHalf > .dashGesamtumsatz{& > .dashInnerBox{& > div:nth-child(2){gap:0.5rem;/* Kompakte Stats */ & > .umsatzStatsCompact{gap:0.25rem;& > .umsatzStatRow, & > .umsatzStatRow:hover{padding:0.25rem 0.5rem;& > div:nth-child(3){font-size:1em}/* Entwicklung ausblenden */ & > .umsatzEntw{display:none}}}/* Zeitraum-Info */ & > .umsatzZeitraumInfo{margin-top:-0.25rem}/* Jahresumsatz kompakter */ & > .umsatzEntwicklung{& > .umsatzEntwicklungHeader{display:none}& > .umsatzEntwicklungTable{& > .umsatzEntwicklungHead{display:none}& > .umsatzEntwicklungRow, & > .umsatzEntwicklungRow:hover{grid-template-columns:3rem 1fr;font-size:0.8em;padding:0.25rem 0.375rem;/* Entwicklung ausblenden */ & > .umsatzEntw{display:none}}}}}}}/* ---------------------------------------------------------------------------- Widget:Datenexport-Status (.dashDatenimportStatus) Zeigt letzte Updates für Beleguploads und Sammelabrechnung ---------------------------------------------------------------------------- */
.dashDatenimportStatus{& > .dashInnerBox{/* Icon blau */ & > div:nth-child(1) > .icon.statusIcon{background:var(--color-hgk-textblue)}& > div:nth-child(2){display:flex;flex-direction:column;gap:0.75rem !important;/* Kompakte Statistik-Zeilen oben */ & > .statusStatsCompact{display:flex;flex-direction:column;gap:0.375rem;flex:0 0 auto !important;padding:0 !important;background:transparent !important;& > .statusStatRow, & > .statusStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;border-left:3px solid var(--hgk-infotext-greenalert);border-right:none;border-top:none;border-bottom:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1.2em;opacity:0.7;flex-shrink:0;flex:none}/* Label */ & > div:nth-child(2){font-weight:500;flex:1 1 auto}/* Datum */ & > div:nth-child(3){font-weight:700;flex-shrink:0;flex:none}/* Info */ & > .statusInfo{font-size:0.85em;font-weight:300;opacity:0.7;flex-shrink:0;flex:none}}}/* Details-Bereich */ & > .statusDetails{flex:0 0 auto !important;& > .statusDetailsHeader{font-weight:500;font-size:0.9em;margin-bottom:0.375rem}& > .statusDetailsGrid{display:flex;flex-direction:column;gap:0.25rem;& > .statusDetailItem, & > .statusDetailItem:hover{display:flex;justify-content:space-between;align-items:center;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.85em;border:none;flex-direction:row;& > div:first-child{font-weight:400;flex:none}& > div:last-child{font-weight:500;flex:none}}}}}}}/* Halbe Breite */
.dashHalf > .dashDatenimportStatus{& > .dashInnerBox{& > div:nth-child(2){gap:0.5rem !important;& > .statusStatsCompact{gap:0.25rem;& > .statusStatRow, & > .statusStatRow:hover{padding:0.375rem 0.5rem;& > div:nth-child(2){font-size:0.85em}/* Info ausblenden */ & > .statusInfo{display:none}}}/* Details ausblenden */ & > .statusDetails{display:none}}}}/* ---------------------------------------------------------------------------- Widget:Gesperrte Zugänge (.dashGesperrteZugaenge) Zeigt gesperrte Mitglieder- und Lieferanten-Zugänge ---------------------------------------------------------------------------- */
.dashGesperrteZugaenge{& > .dashInnerBox{& > div:nth-child(1){& > .statusGruen{background:var(--color-green)}& > .statusOrange{background:var(--color-orange)}& > .statusRot{background:var(--color-red)}}& > div:nth-child(2){display:flex;flex-direction:column;gap:0.75rem !important;/* Statistik-Bereich */ & > .gesperrtStatsCompact{display:flex;flex-direction:column;gap:0.375rem;flex:0 0 auto !important;& > .gesperrtStatRow, & > .gesperrtStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;background:var(--color-hgk-bg);border-radius:0.5rem;border:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1.2em;opacity:0.7;flex-shrink:0;flex:none}/* Label */ & > div:nth-child(2){font-weight:500;flex:1 1 auto}/* Anzahl */ & > div:nth-child(3){font-weight:700;font-size:1.2em;flex-shrink:0;flex:none}}}/* Details-Bereich */ & > .gesperrtDetails{flex:1 1 auto !important;display:flex;flex-direction:column;& > .gesperrtDetailsHeader{font-weight:500;font-size:0.9em;margin-bottom:0.375rem}& > .gesperrtListe{display:flex;flex-direction:column;gap:0.25rem;overflow-y:auto;max-height:200px;& > .gesperrtEintrag, & > .gesperrtEintrag:hover{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.85em;border:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1em;opacity:0.7;flex:none}/* Name */ & > div:nth-child(2){flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}/* Datum */ & > div:nth-child(3){font-weight:500;opacity:0.7;flex:none}}}& > .gesperrtLeer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;padding:1rem;opacity:0.6;text-align:center;& > .iconsLine{font-size:2em;color:var(--color-green)}}}}}}/* Halbe Breite */
.dashHalf > .dashGesperrteZugaenge{& > .dashInnerBox{& > div:nth-child(2){/* Stats kompakt */ & > .gesperrtStatsCompact{& > .gesperrtStatRow{padding:0.375rem 0.5rem;& > div:nth-child(1){font-size:1em}& > div:nth-child(3){font-size:1em}}}/* Details ausblenden */ & > .gesperrtDetails{display:none}}}}/* ---------------------------------------------------------------------------- Widget:Zugriffsstatistik (.dashZugriffsstatistik) Zeigt Logins der letzten 2 Wochen ---------------------------------------------------------------------------- */
.dashZugriffsstatistik{& > .dashInnerBox{& > div:nth-child(2){display:flex;flex-direction:column;gap:0.5rem !important;/* Statistik-Bereich */ & > .zugriffeStatsCompact{display:flex;flex-direction:column;gap:0.2rem;flex:0 0 auto !important;& > .zugriffeStatRow, & > .zugriffeStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.25rem 0.75rem;background:var(--color-hgk-bg);border-radius:0.375rem;border:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1em;opacity:0.7;flex-shrink:0;flex:none}/* Label */ & > div:nth-child(2){font-weight:500;flex:1 1 auto}/* Anzahl */ & > div:nth-child(3){font-weight:700;font-size:1em;flex-shrink:0;flex:none}}& > .zugriffeGesamt{background:var(--color-hgk-blue-light);& > div:nth-child(3){color:var(--color-hgk-blue)}}}/* Details-Bereich */ & > .zugriffeDetails{flex:1 1 auto !important;display:flex;flex-direction:column;min-height:0;/* Überschrift + Spaltenkopf:scrollen nicht mit */ & > .zugriffeProTagFest{flex:0 0 auto;display:flex;flex-direction:column;gap:0.15rem;& > .zugriffeDetailsHeader{font-weight:500;font-size:0.85em;margin-bottom:0}& > .zugriffeEintragHead, & > .zugriffeEintragHead:hover{display:flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem 0.35rem;background:transparent;border-radius:0;font-size:0.75em;font-weight:600;border:none;border-bottom:1px solid var(--color-hgk-border);margin-bottom:0;flex-direction:row;& > div:nth-child(1){flex:1 1 auto;font-weight:600;opacity:0.75}& > div:nth-child(2), & > div:nth-child(3), & > div:nth-child(4){flex:none;text-align:right;opacity:0.85;font-weight:600}& > div:nth-child(2){width:2.5rem}& > div:nth-child(3){width:2.5rem}& > div:nth-child(4){width:3rem}}}& > .zugriffeListe{display:flex;flex-direction:column;gap:0.1rem;overflow-y:auto;flex:1 1 auto;min-height:0;max-height:220px;& > .zugriffeEintrag, & > .zugriffeEintrag:hover{display:flex;align-items:center;gap:0.5rem;padding:0.2rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.25rem;font-size:0.8em;border:none;flex-direction:row;/* Tag */ & > div:nth-child(1){flex:1 1 auto;font-weight:400}/* Mitglieder */ & > div:nth-child(2){flex:none;width:2.5rem;text-align:right;opacity:0.7}/* Lieferanten */ & > div:nth-child(3){flex:none;width:2.5rem;text-align:right;opacity:0.7}/* Gesamt */ & > div:nth-child(4){flex:none;width:3rem;text-align:right}}}& > .zugriffeFooter{margin-top:0.5rem;padding-top:0.5rem;border-top:1px solid var(--color-hgk-border);font-size:0.85em;opacity:0.8}}}}}/* Halbe Breite */
.dashHalf > .dashZugriffsstatistik{& > .dashInnerBox{& > div:nth-child(2){/* Stats kompakt - nur Gesamt und Mitglieder/Lieferanten */ & > .zugriffeStatsCompact{& > .zugriffeStatRow{padding:0.25rem 0.5rem;& > div:nth-child(1){font-size:0.9em}& > div:nth-child(3){font-size:1em}}/* Admin-Zeile ausblenden */ & > .zugriffeStatRow:nth-child(4){display:none}}/* Details ausblenden */ & > .zugriffeDetails{display:none}}}}/* ---------------------------------------------------------------------------- Widget:Service-Teilnehmer (AllOrder, BestPrice, EinkaufPlus, etc.) Zeigt Teilnehmer-Statistik für verschiedene Services ---------------------------------------------------------------------------- */
.dashAllorderTeilnehmer,
.dashBestpriceTeilnehmer,
.dashEinkaufplusTeilnehmer,
.dashBackofficeTeilnehmer,
.dashAllorderproTeilnehmer,
.dashChefscockpitTeilnehmer,
.dashErechnungTeilnehmer,
.dashWebsiteTeilnehmer{& > .dashInnerBox{& > div:nth-child(2){display:flex;flex-direction:column;gap:0.75rem !important;/* Statistik-Bereich */ & > .aoStatsCompact{display:flex;flex-direction:column;gap:0.25rem;flex:0 0 auto !important;& > .aoStatRow, & > .aoStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;background:var(--color-hgk-bg);border-radius:0.5rem;border:none;flex-direction:row;/* Icon */ & > div:nth-child(1){font-size:1.2em;opacity:0.7;flex-shrink:0;flex:none}/* Label */ & > div:nth-child(2){font-weight:500;flex:1 1 auto}/* Anzahl */ & > div:nth-child(3){font-weight:700;font-size:1.3em;flex-shrink:0;flex:none}/* Sub (Gesamt) */ & > .aoStatSub{font-size:0.85em;opacity:0.6;flex:none}}& > .aoStatRowMain{background:var(--color-hgk-blue-light)}}/* Entwicklungs-Bereich */ & > .aoEntwicklung{flex:1 1 auto !important;display:flex;flex-direction:column;& > .aoEntwicklungHeader{font-weight:500;font-size:0.9em;margin-bottom:0.375rem}& > .aoEntwicklungTable{display:flex;flex-direction:column;gap:0.125rem;& > .aoEntwicklungHead, & > .aoEntwicklungHead:hover{display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr;gap:0.5rem;padding:0.375rem 0.5rem;font-size:0.8em;font-weight:500;opacity:0.7;border:none;background:transparent;flex-direction:row;& > div{flex:none;border:none;background:transparent}}& > .aoEntwicklungRow, & > .aoEntwicklungRow:hover{display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.85em;border:none;flex-direction:row;& > div{flex:none;border:none;background:transparent}& > div:first-child{font-weight:500}& > .aoSaldo{display:flex;align-items:center;gap:0.25rem;& > .iconsLine{font-size:1em}}}& > .aoEntwicklungRowLast{opacity:0.7}}}}}}/* Halbe Breite */
.dashHalf > .dashAllorderTeilnehmer,
.dashHalf > .dashBestpriceTeilnehmer,
.dashHalf > .dashEinkaufplusTeilnehmer,
.dashHalf > .dashBackofficeTeilnehmer,
.dashHalf > .dashAllorderproTeilnehmer,
.dashHalf > .dashChefscockpitTeilnehmer,
.dashHalf > .dashErechnungTeilnehmer,
.dashHalf > .dashWebsiteTeilnehmer{& > .dashInnerBox{& > div:nth-child(2){gap:0.5rem;/* Stats kompakt */ & > .aoStatsCompact{gap:0.25rem;& > .aoStatRow{padding:0.25rem 0.5rem;& > div:nth-child(1){font-size:1em}& > div:nth-child(2){font-size:0.85em}& > div:nth-child(3){font-size:1em}& > .aoStatSub{display:none}}}/* Entwicklung:kompakter ohne Überschrift */ & > .aoEntwicklung{& > .aoEntwicklungHeader{display:none}& > .aoEntwicklungTable{gap:0.1rem !important;& > .aoEntwicklungHead, & > .aoEntwicklungHead:hover{display:grid !important;grid-template-columns:1fr 1fr 1fr 1.2fr !important;gap:0.5rem !important;padding:0.2rem 0.375rem !important;font-size:0.7em !important;border:none !important;background:transparent !important;& > div, & > div:hover{flex:none !important;border:none !important;background:transparent !important}}& > .aoEntwicklungRow, & > .aoEntwicklungRow:hover{display:grid !important;grid-template-columns:1fr 1fr 1fr 1.2fr !important;gap:0.5rem !important;padding:0.2rem 0.375rem !important;font-size:0.75em !important;border:none !important;& > div, & > div:hover{flex:none !important;border:none !important}& > .aoSaldo > .iconsLine{font-size:0.9em !important}}}}}}}/* ---------------------------------------------------------------------------- Widget:Vertragsmanagement Statistik (.dashVmStatistik) ---------------------------------------------------------------------------- */ .dashVmStatistik{& > .dashInnerBox{& > div:nth-child(2){display:flex;flex-direction:column;gap:1rem;flex:1;& > .vmStatsCompact{display:flex;flex-direction:column;gap:0.25rem;& > .vmStatRow, & > .vmStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;border:none;& > div:nth-child(1){font-size:1.1em;color:var(--color-hgk-blue)}& > div:nth-child(2){flex:1}& > div:nth-child(3){font-size:1.2em;font-weight:600}& > .vmStatSub{font-size:0.8em;opacity:0.7}}& > .vmStatRowMain{& > div:nth-child(3){font-size:1.5em}}}/* Entwicklungstabelle */ & > .vmEntwicklung{& > .vmEntwicklungHeader{font-weight:600;font-size:0.9em;margin-bottom:0.5rem;color:var(--color-hgk-blue)}& > .vmEntwicklungTable{display:flex;flex-direction:column;gap:0.25rem;/* Kopfzeile */ & > .vmEntwicklungHead, & > .vmEntwicklungHead:hover{display:grid;grid-template-columns:5rem 1fr 1fr;gap:0.5rem;padding:0.25rem 0.5rem;font-size:0.8em;font-weight:500;opacity:0.7;border:none;background:transparent;& > div, & > div:hover{text-align:right;flex:none;border:none;background:transparent}& > div:first-child, & > div:first-child:hover{text-align:left}}/* Datenzeilen */ & > .vmEntwicklungRow, & > .vmEntwicklungRow:hover{display:grid;grid-template-columns:5rem 1fr 1fr;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;font-size:0.85em;border:none;& > div{flex:none;border:none;background:transparent}& > div:first-child{font-weight:500}& > div:nth-child(2), & > div:nth-child(3){text-align:right}}& > .vmEntwicklungRowLast{opacity:0.7}}}}}}/* Halbe Kachel:Vertragsmanagement Statistik */
.dashHalf > .dashVmStatistik{& > .dashInnerBox{& > div:nth-child(2){gap:0.25rem;& > .vmStatsCompact{gap:0.1rem;& > .vmStatRow, & > .vmStatRow:hover{padding:0.15rem 0.375rem;& > div:nth-child(1){font-size:0.85em}& > div:nth-child(2){font-size:0.85em}& > div:nth-child(3){font-size:0.95em}}& > .vmStatRowMain{& > div:nth-child(3){font-size:1.1em}}}/* Entwicklung:kompakter */ & > .vmEntwicklung{& > .vmEntwicklungHeader{display:none}& > .vmEntwicklungTable{gap:0.05rem !important;& > .vmEntwicklungHead, & > .vmEntwicklungHead:hover{display:grid !important;grid-template-columns:4rem 1fr 1fr !important;gap:0.25rem !important;padding:0.1rem 0.375rem !important;font-size:0.65em !important;border:none !important;background:transparent !important;& > div, & > div:hover{flex:none !important;border:none !important;background:transparent !important}}& > .vmEntwicklungRow, & > .vmEntwicklungRow:hover{display:grid !important;grid-template-columns:4rem 1fr 1fr !important;gap:0.25rem !important;padding:0.15rem 0.375rem !important;font-size:0.7em !important;border:none !important;& > div, & > div:hover{flex:none !important;border:none !important}}}}}}}/* ---------------------------------------------------------------------------- Widget:Internes & Externes Feedback (.dashTesterFeedback, .dashExternFeedback) ---------------------------------------------------------------------------- */ .dashTesterFeedback,
.dashExternFeedback{& > .dashInnerBox{& > div:nth-child(2){display:flex;flex-direction:column;gap:0.5rem;flex:1;overflow:hidden;& > .fbStatsCompact{display:flex;flex-direction:column;gap:0.15rem;flex:0 0 auto;& > .fbStatRow, & > .fbStatRow:hover{display:flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem;background:var(--color-hgk-bg);border-radius:0.375rem;border:none;& > div:nth-child(1){font-size:1em}& > div:nth-child(2){flex:1;font-size:0.9em}& > div:nth-child(3){font-size:1.1em;font-weight:600}}& > .fbStatRowMain{& > div:nth-child(3){font-size:1.3em}}}/* Neueste Einträge */ & > .fbNeueste{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0;& > .fbNeuesteHeader{font-weight:600;font-size:0.8em;margin-bottom:0.25rem;color:var(--color-hgk-blue);flex:0 0 auto}& > .fbNeuesteList{display:flex;flex-direction:column;gap:0.15rem;overflow-y:auto;flex:1;min-height:0;& > .fbEintrag, & > .fbEintrag:hover{padding:0.2rem 0.4rem;background:var(--color-hgk-bg);border-radius:0.25rem;border:none;flex-direction:column;flex:0 0 auto;& > .fbEintragMeta{display:flex;gap:0.4rem;font-size:0.65em;margin-bottom:0;& > span:first-child{font-weight:600}& > span:last-child{margin-left:auto;opacity:0.7}}& > .fbEintragText{font-size:0.75em;color:var(--color-hgk-textblue);line-height:1.15}}& > .fbKeinFeedback{padding:0.5rem;text-align:center;opacity:0.6;font-size:0.8em}}}/* Alle anzeigen Link */ & > .fbAlleAnzeigen{margin-top:auto;flex:0 0 auto;padding-top:0.25rem;& > a{font-size:0.85em}}}}}/* Halbe Kachel:Internes & Externes Feedback */
.dashHalf > .dashTesterFeedback,
.dashHalf > .dashExternFeedback{& > .dashInnerBox{& > div:nth-child(2){gap:0.25rem;& > .fbStatsCompact{gap:0.1rem;& > .fbStatRow, & > .fbStatRow:hover{padding:0.2rem 0.375rem;& > div:nth-child(1){font-size:0.9em}& > div:nth-child(2){font-size:0.85em}& > div:nth-child(3){font-size:1em}}& > .fbStatRowMain{& > div:nth-child(3){font-size:1.2em}}}/* Neueste Einträge ausblenden in halber Kachel */ & > .fbNeueste{display:none}/* Alle anzeigen Link */ & > .fbAlleAnzeigen{margin-top:auto;padding-top:0.25rem;& > a{font-size:0.8em}}}}}