/* =====================================================================
   DREMO CORPORATE DESIGN  –  zvoove Connect Portal Theme
   Reines CSS-Override (kein HTML-Edit). In das CSS-Textfeld einfügen.
   Stand: 26.06.2026
   ---------------------------------------------------------------------
   Farben laut CD-Handbuch 1.1:
     Dremo-Blau    #004188   (dominant)
     Dremo-Orange  #ef7900   (Akzent)
     Blau-Abstufungen:   80% #385d9d  60% #6a80b5  40% #9ba7ce
                         20% #ccd1e7  10% #e5e7f3
     Orange-Abstufung:   40% #f4983d
   Schrift: Source Sans Pro (Fließtext) / Exo 2 (Headlines) laut CD.
            Webfonts NICHT geladen -> System-Fallback-Stack.
   ===================================================================== */


/* ---------------------------------------------------------------------
   0) CSS-Variablen  (zentrale Stellschraube für alle Farben)
   --------------------------------------------------------------------- */
:root {
  --dremo-blau:        #004188;
  --dremo-blau-80:     #385d9d;
  --dremo-blau-60:     #6a80b5;
  --dremo-blau-40:     #9ba7ce;
  --dremo-blau-20:     #ccd1e7;
  --dremo-blau-10:     #e5e7f3;
  --dremo-orange:      #ef7900;
  --dremo-orange-40:   #f4983d;
  --dremo-text:        #1a1a1a;   /* CD: Text primär Schwarz */
  --dremo-font:        "Source Sans Pro", "Segoe UI", Tahoma, Calibri, Arial, sans-serif;
}


/* ---------------------------------------------------------------------
   1) Grundschrift  (CD: Source Sans Pro, Fallback Tahoma/Calibri)
   WICHTIG: .material-icons NICHT einschliessen! Diese Buttons brauchen
   ihre eigene Icon-Font, sonst werden statt der Symbole die Ligatur-Namen
   ("print", "help", "widgets" ...) als Text angezeigt.
   --------------------------------------------------------------------- */
body,
.portal_form,
.form-control,
input:not([type="image"]), select, textarea {
  font-family: var(--dremo-font) !important;
  color: var(--dremo-text);
}

/* Buttons: Schrift nur fuer NICHT-Icon-Buttons setzen */
.btn:not(.material-icons) {
  font-family: var(--dremo-font) !important;
}

/* Sicherstellen, dass Icon-Buttons ihre Material-Icon-Font behalten */
.material-icons,
.btn.material-icons {
  font-family: "Material Icons" !important;
}


/* ---------------------------------------------------------------------
   2) Logo
   Der #logo-Bereich enthält nur einen Textlink ("zurück zum Frontend").
   Da kein HTML-Edit moeglich ist: Logo als Hintergrundbild auf den Link,
   Linktext ausblenden, Klickflaeche/Funktion bleibt erhalten.
   Bild: 220 x 80 px, transparenter Hintergrund.
   --------------------------------------------------------------------- */
#logo a {
  display: block !important;
  width: 220px;
  height: 80px;
  background: url(../custom/bilder/Logo_farbig_B220xH80_Hintergrund_transparent.png) no-repeat center / contain;
  /* Linktext unsichtbar, aber Link bleibt klickbar */
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
}


/* ---------------------------------------------------------------------
   2b) Logo im linken Menue
   Das zvoove-Logo steckt in #menue_links.menu_open::before, gesetzt
   INNERHALB einer @media (min-width: 768px) Query mit:
       background-image: url(zvoove-logo_light.svg);
       height: 120px; background-position: center; top: 30px;
   Um das zu schlagen, brauchen wir GLEICHE Spezifitaet (ID + Klasse)
   UND dieselbe Media-Query. Daher hier doppelt: einmal generell als
   Fallback, einmal innerhalb der Media-Query mit voller Spezifitaet.
   --------------------------------------------------------------------- */

/* Fallback ausserhalb der Media-Query (kleine Viewports / Sicherheit) */
#menue_links::before,
#menue_links.menu_open::before {
  content: "" !important;
  display: block !important;
  background-image: url(../custom/bilder/Logo_farbig_B220xH80_Hintergrund_transparent.png) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* Treffer auf die Portal-Regel: gleiche Spezifitaet + gleiche Media-Query */
@media (min-width: 768px) {
  #menue_links.menu_open::before {
    background-image: url(../custom/bilder/Logo_farbig_B220xH80_Hintergrund_transparent.png) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    height: 90px !important;   /* zvoove hatte 120px; an Logo 80px Hoehe angepasst */
    top: 20px !important;       /* zvoove hatte 30px; ggf. feinjustieren */
  }
}

/* Falls .bg ebenfalls noch ein Logo trug, dort entfernen */
#menue_links .bg {
  background-image: none !important;
}


/* ---------------------------------------------------------------------
   3) Obere Admin-Leiste (topBar) + Hauptnavigation (portal_navi)
   --------------------------------------------------------------------- */
.topBar {
  background: var(--dremo-blau) !important;
  border-bottom: 3px solid var(--dremo-orange);
}

/* Navi-Hauptpunkte (System, Inhalte, Erscheinungsbild, ...) */
.portal_navi > li > a,
.portal_navi .menue_block_kopf {
  color: #ffffff !important;
}

/* Hover auf Hauptpunkte -> Orange-Akzent */
.portal_navi > li > a:hover,
.portal_navi .menue_block_kopf:hover {
  color: var(--dremo-orange) !important;
}

/* Aufklappende Untermenues der Hauptnavigation */
.portal_navi li ul {
  background: var(--dremo-blau-80) !important;
  border-top: 2px solid var(--dremo-orange);
}
.portal_navi li ul li a {
  color: #ffffff !important;
}
.portal_navi li ul li a:hover {
  background: var(--dremo-blau) !important;
  color: var(--dremo-orange) !important;
}


/* ---------------------------------------------------------------------
   4) Linkes Seitenmenue (#menue_links)
   --------------------------------------------------------------------- */
#menue_links.panel,
#menue .portlet {
  background: var(--dremo-blau-10) !important;
}

/* Menue-Block-Ueberschriften (Zeiterfassung, Stammdaten, Verwaltung ...) */
#menue .menue_block_kopf {
  background: var(--dremo-blau) !important;
  color: #ffffff !important;
  border-left: 4px solid var(--dremo-orange);
}

/* aktiver / aufgeklappter Menue-Block */
#menue .menue_block_kopf.bg-primary,
#menue .has_sub.menu_open > .menue_block_kopf {
  background: var(--dremo-blau-80) !important;
}

/* Menue-Eintraege (Links) */
#menue li a {
  color: var(--dremo-text) !important;
}
#menue li a:hover {
  color: var(--dremo-orange) !important;
}

/* aktiver Menue-Eintrag */
#menue .menue_block_item_active {
  color: var(--dremo-orange) !important;
  font-weight: 600;
}

/* "Minimieren"-Button */
#menue .toggle_menue.minimieren {
  background: var(--dremo-blau-20) !important;
  color: var(--dremo-blau) !important;
  border-left: 4px solid var(--dremo-orange);
}


/* ---------------------------------------------------------------------
   5) Brotkrumen-Navigation (breadcrumb / statuszeile)
   --------------------------------------------------------------------- */
.panel-heading,
#statuszeile {
  background: var(--dremo-blau-10) !important;
  border-bottom: 1px solid var(--dremo-blau-20);
}
.breadcrumb a {
  color: var(--dremo-blau) !important;
}
.breadcrumb a:hover {
  color: var(--dremo-orange) !important;
}
.breadcrumb span {
  color: var(--dremo-text);
}


/* ---------------------------------------------------------------------
   6) Seitentitel (titelCaption)
   --------------------------------------------------------------------- */
.titelCaption {
  color: var(--dremo-blau) !important;
  border-bottom: 2px solid var(--dremo-orange);
  font-weight: 700;
}


/* ---------------------------------------------------------------------
   7) Panels / Boxen
   --------------------------------------------------------------------- */
.panel.panel-default {
  border: 1px solid var(--dremo-blau-20);
}
.panel-default > .panel-heading {
  background: var(--dremo-blau-10) !important;
  color: var(--dremo-blau);
}


/* ---------------------------------------------------------------------
   8) Buttons
   Standard-Buttons -> Blau,  primaere Aktionen / Akzent -> Orange.
   Inline-style background-color (z.B. #aaa beim Ablehnen-Button)
   muss mit !important ueberschrieben werden.
   --------------------------------------------------------------------- */

/* Standard-Button */
.btn-default {
  background: var(--dremo-blau) !important;
  color: #ffffff !important;
  border: 1px solid var(--dremo-blau) !important;
}
.btn-default:hover,
.btn-default:focus {
  background: var(--dremo-blau-80) !important;
  border-color: var(--dremo-blau-80) !important;
  color: #ffffff !important;
}

/* Primaer-Button -> Orange-Akzent */
.btn-primary {
  background: var(--dremo-orange) !important;
  color: #ffffff !important;
  border: 1px solid var(--dremo-orange) !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--dremo-orange-40) !important;
  border-color: var(--dremo-orange-40) !important;
  color: #ffffff !important;
}

/* Material-Icon-Buttons (Drucken, Widgets) im Titelbereich
   transparent halten, Icon in Blau */
.titelButtons .btn-default.material-icons {
  background: transparent !important;
  color: var(--dremo-blau) !important;
  border: none !important;
}
.titelButtons .btn-default.material-icons:hover {
  color: var(--dremo-orange) !important;
}

/* Icon-Buttons in Listen / Tabellen (Power / Bearbeiten / Drucken / Loeschen)
   Hintergrund bleibt Dremo-Blau, das schwarze Icon wird Dremo-Orange.
   color steuert bei den Material-Icon-Fonts die Glyph-Farbe.
   Gilt fuer alle .btn.material-icons ausserhalb des Titelbereichs. */
.btn.material-icons,
.btn-default.material-icons,
.btn-primary.material-icons {
  color: var(--dremo-orange) !important;
}
.btn.material-icons:hover,
.btn-default.material-icons:hover,
.btn-primary.material-icons:hover {
  color: #ffffff !important;   /* beim Hover weiss fuer klaren Kontrast */
}

/* ---------------------------------------------------------------------
   8b) PNG-Icon-Buttons  (input type="image", z.B. power_on.png, delete.png)
   Diese tragen ein SCHWARZES PNG-Symbol auf Dremo-Blau -> schlecht lesbar.
   color wirkt hier NICHT (echte Grafik, kein Icon-Font).
   Zwei Loesungen - eine davon aktiv lassen, die andere auskommentieren.
   --------------------------------------------------------------------- */

/* --- OPTION A (AKTIV): heller Hintergrund, schwarzes Icon bleibt lesbar ---
   Erfasst BEIDE Button-Varianten im Portal:
     1) <input type="image" class="btn-default" src="...png_16/power_on.png">
     2) <a class="contextitem btn btn-default"><img src="...png_16/stopwatch.png"></a>
   Die <a>-Variante traegt das Icon als <img>-KIND, nicht als eigenen src,
   daher muss der Selektor auch a.btn / .contextitem erfassen.
   ACHTUNG: Manche Anmerkung-Buttons haben einen Klassen-TIPPFEHLER im Portal:
   class="cont extitem anmerkung btn btn-default" (Leerzeichen in "contextitem"!)
   -> dadurch zerfaellt es in "cont" + "extitem". Wir fangen das ueber
      .extitem.btn und .anmerkung.btn zusaetzlich ab. */
input[type="image"].btn-default,
input[type="image"].contextitem,
a.btn-default.contextitem,
a.contextitem.btn,
.contextitem.btn,
.extitem.btn,
.anmerkung.btn,
.btn:has(> img[src*="gear.png"]) {
  background: var(--dremo-blau-10) !important;   /* helles Blau-10 */
  border: 1px solid var(--dremo-blau-20) !important;
  padding: 4px !important;
  border-radius: 4px;
}
input[type="image"].btn-default:hover,
input[type="image"].contextitem:hover,
a.btn-default.contextitem:hover,
a.contextitem.btn:hover,
.contextitem.btn:hover,
.extitem.btn:hover,
.anmerkung.btn:hover,
.btn:has(> img[src*="gear.png"]):hover {
  background: var(--dremo-blau-20) !important;
  border-color: var(--dremo-blau-40) !important;
}

/* Up/Down-Pfeil-Buttons (Jahr/Monat-Filter, z.B. Monatskalender).
   Diese haben btn-default (-> sonst blauer Hintergrund) mit einem dunklen
   Pfeil-Icon (per CSS-Background). Auf hellen Hintergrund setzen, damit der
   Pfeil lesbar bleibt. KEIN extra padding/radius - wuerde die schmalen
   Pfeil-Buttons verformen. */
.btn-default.udt_button,
.udt_button.udt_up,
.udt_button.udt_down {
  background-color: var(--dremo-blau-10) !important;
  border: 1px solid var(--dremo-blau-20) !important;
}
.btn-default.udt_button:hover,
.udt_button.udt_up:hover,
.udt_button.udt_down:hover {
  background-color: var(--dremo-blau-20) !important;
}

/* Such-Button (search.png): hat im Original weissen Hintergrund mit
   tuerkisem Rahmen, bei Hover komplett tuerkis. Ans CD angleichen:
   weisser Hintergrund + Dremo-Blau Rahmen, bei Hover Dremo-Orange. */
.btn:has(> img[src*="search.png"]) {
  background-color: #ffffff !important;
  border: 1px solid var(--dremo-blau) !important;
}
.btn:has(> img[src*="search.png"]):hover {
  background-color: var(--dremo-orange) !important;
  border-color: var(--dremo-orange) !important;
}

/* --- OPTION B (INAKTIV): blauer Hintergrund bleibt, Icon weiss statt schwarz.
   WICHTIG: filter wirkt auf das GANZE Element (Hintergrund + Icon), nicht
   nur auf das PNG. Da Icon UND Hintergrund auf demselben <input> liegen,
   kann man das schwarze Icon NICHT isoliert orange faerben.
   Praktikabel ist nur: Hintergrund weglassen (transparent) und das Icon
   per filter aufhellen/invertieren. Dann sitzt ein helles Icon direkt
   auf dem Zeilenhintergrund - ohne blauen Button-Kasten.
   Zum Nutzen: Option A oben auskommentieren, folgendes einkommentieren. ---

input[type="image"].btn-default,
input[type="image"].contextitem {
  background: transparent !important;
  border: none !important;
  padding: 4px !important;
  filter: invert(48%) sepia(89%) saturate(1200%) hue-rotate(360deg);
}
*/

/* HINWEIS: Manche Icons im Portal sind PNG-Grafiken (z.B. logout.png,
   delete_red.png unter /assets/.../png_16/). Diese lassen sich per CSS
   NICHT umfaerben (color wirkt nur auf Icon-Fonts). Falls einzelne Icons
   schwarz bleiben, sind es PNGs -> die muessten als Datei getauscht werden. */

/* Cookie-Banner: "Ablehnen"-Button hat inline background #aaa ->
   neutral grau lassen ist ok, aber an CD angleichen (Blau-20 / Text Blau).
   Falls grau gewuenscht, diesen Block entfernen. */
#cClose.btn-primary {
  background: var(--dremo-blau-20) !important;
  color: var(--dremo-blau) !important;
  border-color: var(--dremo-blau-20) !important;
}
#cClose.btn-primary:hover {
  background: var(--dremo-blau-40) !important;
}


/* ---------------------------------------------------------------------
   9) Formularfelder
   --------------------------------------------------------------------- */
.form-control {
  border: 1px solid var(--dremo-blau-40) !important;
}
.form-control:focus {
  border-color: var(--dremo-orange) !important;
  box-shadow: 0 0 0 2px rgba(239, 121, 0, 0.20) !important;
  outline: none;
}

/* Pflichtfelder dezent markieren */
.input_required {
  border-left: 3px solid var(--dremo-orange) !important;
}

/* Validierungsfehler */
.validator_error {
  color: #db6361 !important;   /* CD-Sekundaerfarbe "Pflege"-Rot, gut als Fehlerfarbe */
}


/* ---------------------------------------------------------------------
   10) Links allgemein  (CD: Links farbig = Dremo-Blau)
   --------------------------------------------------------------------- */
a {
  color: var(--dremo-blau);
}
a:hover {
  color: var(--dremo-orange);
}


/* ---------------------------------------------------------------------
   11) Footer
   --------------------------------------------------------------------- */
.footer.portlet {
  border-top: 2px solid var(--dremo-orange);
  background: var(--dremo-blau-10) !important;
}
.footer a {
  color: var(--dremo-blau) !important;
}
.footer a:hover {
  color: var(--dremo-orange) !important;
}


/* ---------------------------------------------------------------------
   12) Statuszeilen-Pfeile (kleine GIF-Trenner) – optional ausblenden,
   falls sie farblich stoeren. Standardmaessig belassen.
   --------------------------------------------------------------------- */
/* .statuszeile_pfeil { opacity: 0.5; } */


/* ---------------------------------------------------------------------
   13) Elemente ausblenden  (Mitarbeiter-Ansicht)
   --------------------------------------------------------------------- */

/* a) Menuepunkt "A1-Antraege" ausblenden */
.item_personal_a1antraege {
  display: none !important;
}

/* a2) Menuepunkt "Anwesenheitsliste" ausblenden */
.item_zeiterfassung_anwesenheitsliste {
  display: none !important;
}

/* ---------------------------------------------------------------------
   13b) Rechnungsliste (Kunde): Spalten "Kunden-Nr." (4) und "Status" (13)
   ausblenden.
   Tabelle: #ctl0_PortalLayoutContent_Main_RechnungsListe
   Spalten: 1,2=Icons 3=Art 4=Kunden-Nr 5=Kunde 6=Rech-Nr 7=Auftrag-Nr
            8=Datum 9=Netto 10=Mwst 11=Brutto 12=Buch-Datum 13=Status.
   Gilt fuer Header (th) und Datenzellen (td) gleichermassen. */
#ctl0_PortalLayoutContent_Main_RechnungsListe > thead > tr > th:nth-child(4),
#ctl0_PortalLayoutContent_Main_RechnungsListe > tbody > tr > td:nth-child(4),
#ctl0_PortalLayoutContent_Main_RechnungsListe > thead > tr > th:nth-child(13),
#ctl0_PortalLayoutContent_Main_RechnungsListe > tbody > tr > td:nth-child(13) {
  display: none !important;
}

/* 13d) Filter "Auftragsnummer" ausblenden (Rechnungen / Monatskalender).
   Der Filter-Block traegt die Klasse .auftrag_filter. */
.auftrag_filter {
  display: none !important;
}

/* 13c) Status-Badges (label-*) ans CD angleichen - greift nur dort, wo
   solche Badges sichtbar bleiben (z.B. andere Listen). In der Rechnungs-
   liste ist die Status-Spalte ohnehin ausgeblendet.
   Bootstrap-Default-Farben -> Dremo-Palette. */
.label-warning {
  background-color: var(--dremo-orange) !important;  /* statt Bootstrap-Gelb */
  color: #ffffff !important;
}
.label-success {
  background-color: #4b7a36 !important;  /* CD-Sekundaer Gruen */
  color: #ffffff !important;
}
.label-danger {
  background-color: #85251b !important;  /* CD-Sekundaer Dunkelrot */
  color: #ffffff !important;
}

/* b) Klassifizierung-Zeile im Upload-Modal ausblenden.
   Die <tr> hat keine eigene ID/Klasse, aber das enthaltene <select> schon.
   Wir treffen die Zeile per :has() ueber die Select-ID. */
tr:has(> td > #ctl0_PortalLayoutContent_Main_UploadEditOverlay_UploadClass) {
  display: none !important;
}


/* ---------------------------------------------------------------------
   14) Cookie-Consent-Banner (#c)
   Enthaelt ein externes zvoove-Logo (go.zvoove.com/.../zvoove-Logo_Cookies.png)
   und neutrale Inline-Farben (#f0f0f0 / #ccc). Wir blenden das fremde Logo
   aus, setzen das Dremo-Logo per ::before davor und faerben den Banner ins CD.
   --------------------------------------------------------------------- */

/* Banner-Hintergrund ins CD (Inline #f0f0f0 ueberschreiben) */
#c {
  background-color: var(--dremo-blau-10) !important;
  border: 1px solid var(--dremo-blau-20) !important;
  border-top: 3px solid var(--dremo-orange) !important;
}

/* Fremdes zvoove-Logo im Banner ausblenden */
#c img[src*="zvoove-Logo_Cookies"] {
  display: none !important;
}

/* Dremo-Logo stattdessen oben im Banner einsetzen */
#c::before {
  content: "" !important;
  display: block !important;
  background: url(../custom/bilder/Logo_farbig_B220xH80_Hintergrund_transparent.png) no-repeat center / contain !important;
  height: 60px !important;
  width: 100% !important;
  margin: 0 auto 12px auto !important;
}


/* ---------------------------------------------------------------------
   15) Personalliste (Kunde): ausgeschiedene Mitarbeiter ausblenden
   Status steckt in einem <img> mit inline background-color:
     aktiv         -> #008000 (gruen)   title="aktiv"
     ausgeschieden -> #FF0000 (rot)     title="ausgeschieden"
   Wir blenden die Tabellenzeile aus, deren Status-Zelle das rote /
   "ausgeschieden"-Icon enthaelt. Treffer ueber title="ausgeschieden"
   (robuster als die Farbe). :has() laeuft von <tr> abwaerts zum <img>.
   --------------------------------------------------------------------- */
tr:has(img[title="ausgeschieden"]) {
  display: none !important;
}


/* ---------------------------------------------------------------------
   16) Personal-Detailansicht (Kunde): Felder/Zeilen ausblenden
   Nur display:none auf einzelne Elemente/Zeilen - KEINE Umpositionierung,
   keine Breiten-Hacks, kein Foto-Eingriff. Dadurch bleibt das responsive
   tablesaw-Verhalten erhalten. (Vom Nutzer manuell verifiziert.)
   Tabelle: #ctl0_PortalLayoutContent_Main_personal_personalTable
     Zeile 3 wohnhaft bei      -> ausblenden
     Zeile 4 Straße/Führerschein -> ausblenden
     Zeile 5 Ort               -> ausblenden
     Zeile 6 Telefon           -> ausblenden
     Zeile 8 Zusatzinfo/BZT    -> ausblenden
     externe Personalnr "(---)" -> ausblenden
   Gesch-St. und Kost-St. bleiben sichtbar.
   --------------------------------------------------------------------- */

/* Externe Personalnr "(---)" (das <small> mit dem span) ausblenden */
small:has(> #ctl0_PortalLayoutContent_Main_personal_personalnrextern) {
  display: none !important;
}

/* Zeilen 3, 4, 5, 8 ausblenden (wohnhaft bei, Straße/Führerschein, Ort,
   Zusatzinfo/BZT). Telefon (Zeile 6) wird wieder ANGEZEIGT. */
#ctl0_PortalLayoutContent_Main_personal_personalTable > tbody > tr:nth-child(3),
#ctl0_PortalLayoutContent_Main_personal_personalTable > tbody > tr:nth-child(4),
#ctl0_PortalLayoutContent_Main_personal_personalTable > tbody > tr:nth-child(5),
#ctl0_PortalLayoutContent_Main_personal_personalTable > tbody > tr:nth-child(8) {
  display: none !important;
}

/* Foto-Zelle (rowspan) auf weissen Hintergrund - damit das Foto nicht auf
   dem grauen Zebra-Hintergrund der Zeile sitzt. */
#ctl0_PortalLayoutContent_Main_personal_personalTable td[rowspan] {
  background-color: white !important;
}

/* "Berufliches / Kenntnisse / Dokumente"-Block ausblenden. Das ist eine
   SEPARATE Tabelle (nicht die personalTable), erkennbar an der Header-Zeile
   #...personal_infoRow. Wir blenden die ganze Tabelle aus, die sie enthaelt. */
table:has(> tbody > #ctl0_PortalLayoutContent_Main_personal_infoRow) {
  display: none !important;
}

/* Button "Profil ergänzen" in der Personaldetail-Ansicht ausblenden */
#ctl0_PortalLayoutContent_Main_ctl0_ProfilErgaenzen {
  display: none !important;
}

/* ---------------------------------------------------------------------
   17) Neuer Menue-Block "Anfragen" (Kunden-Menue)
   Die anderen Block-Koepfe (Kunde, Zeiterfassung, ...) bekommen ihr Icon
   ueber #menue .menue_block_kopf::before mit font-family "Material Icons"
   und einem content-Ligatur-Namen pro Klasse. Die neue Klasse "anfragen"
   hat noch kein content -> wir definieren ein passendes Material-Icon.
   "contact_support" (Sprechblase mit Fragezeichen) passt zu Anfragen.
   Alternativen: help_outline, assignment, mail_outline, quiz, support_agent.
   --------------------------------------------------------------------- */
#menue .menue_block_kopf.anfragen::before,
#menue ul li.menu_open .menue_block_kopf.anfragen::before {
  content: "contact_support" !important;
}