/* =====================================================================
 * leader-refresh.css — Design-Ebene für das Führungskräfte-Dashboard
 *
 * Stand: 24.08.2026 · Grundlage: docs/fuehrungsdashboard-vorschau.html
 *
 * WARUM EINE EIGENE DATEI, statt leader-canvas.css und
 * leader-dashboard-v3.css umzuschreiben:
 *
 * Die beiden bestehenden Dateien sind über Monate gewachsen und tragen
 * an vielen Stellen Begründungen im Kommentar. Sie flächig umzufärben
 * hätte geheißen, Hunderte einzelner Farbwerte anzufassen und dabei
 * genau die Kommentare zu zerreißen, die erklären, warum eine Regel
 * überhaupt dasteht. Diese Datei liegt stattdessen DAHINTER: Sie wird
 * nach den anderen eingebunden, gewinnt damit bei gleicher
 * Spezifität, und lässt sich durch Entfernen einer einzigen Zeile in
 * render_full_html() vollständig zurücknehmen. Das ist der Grund für
 * die vielen !important — nicht Nachlässigkeit, sondern die Ablösung
 * eines bestehenden !important-Bestands.
 *
 * DER UNTERSCHIED ZUM BISHERIGEN STAND, in einem Satz je Punkt:
 *
 *   Karten sind weiß (#FFFFFF), nicht mehr cremefarben (#FFFCF3).
 *   #FFFCF3 wird dadurch frei für das, was ZURÜCKTRETEN soll —
 *   Hinweise, Erledigtes, Vorschauen. Vorher trugen Karte und
 *   Hinweiskasten dieselbe Farbe und damit dasselbe Gewicht.
 *
 *   Der Kopfbereich ist eine helle Zeile statt eines dunklen Blocks.
 *   Der dunkle Block mit Rauschtextur und zwei Farbverläufen war das
 *   auffälligste Element der Seite — und trug die Information mit dem
 *   geringsten Handlungswert (eine Begrüßung).
 *
 *   Genau ein gefüllter Button pro Bildschirm. Alles andere ist weiß
 *   mit Rahmen oder ein unterstrichener Textlink. Wenn jede Aktion wie
 *   die Hauptaktion aussieht, gibt es keine Hauptaktion.
 *
 *   Teal (#507176) für Impulse, Rosé (#BA918A) für Unterlagen und
 *   Fälliges — als 3px-Kante links, nicht als Flächenfarbe.
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 0 · WARUM #mhp-dashboard VIERMAL DASTEHT
 *
 * Weil Ladereihenfolge hier nicht reicht.
 *
 * leader-canvas.css, leader-dashboard-v3.css und der Inline-Block in
 * templates/dashboard.php adressieren dieselben Elemente über eine
 * ZWEITE oder DRITTE ID:
 *
 *   html body #mhp-dashboard.mhp-leader-dashboard #mhp-panel-leadership .mhp-leader-subtab
 *   html body #mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card… button#mhp-leader-head-edit…
 *
 * Gegen 2–3 IDs verliert eine Regel mit einer ID immer — egal, wie spät
 * sie geladen wird und wie viele !important sie trägt. Genau das war in
 * der ersten Fassung zu sehen: Die Reiter blieben dunkle Pillen, der
 * Reiterinhalt behielt seinen cremefarbenen Kasten, und der Kicker lief
 * als rosa Balken über die volle Breite.
 *
 * #mhp-dashboard viermal zu wiederholen ist gültiges CSS, trifft
 * dasselbe Element und hebt die Spezifität auf 4 IDs. Damit gewinnt
 * diese Datei jeden Konflikt in den drei genannten Quellen
 * deterministisch — gemessen, nicht geschätzt: die höchste dort
 * vorkommende Spezifität ist (3,4,3).
 *
 * Der Preis ist Hässlichkeit im Selektor. Die Alternative wäre gewesen,
 * in drei gewachsenen Dateien Hunderte Regeln zu entfernen und dabei
 * die Kommentare zu zerreißen, die erklären, warum sie dastehen. Diese
 * Datei bleibt so das, was sie sein soll: eine Ebene, die man durch
 * Löschen einer Einbindungszeile vollständig zurücknimmt.
 *
 * Wenn die alten Dateien eines Tages aufgeräumt werden, kann das hier
 * auf eine ID zurückgebaut werden — such-und-ersetze
 * „#mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard" durch
 * „#mhp-dashboard".
 * ---------------------------------------------------------------------
 *
 * 1 · Tokens
 * Nur auf dem Führungs-Dashboard definiert. Das Mitarbeiter-Dashboard
 * teilt sich dieselben Klassennamen und darf davon nichts abbekommen.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard {
    --mvf-bg: #FAF6F2;
    --mvf-surface: #FFFFFF;
    --mvf-quiet: #FFFCF3;
    --mvf-sunken: #F5F1E8;
    --mvf-line: #E6E0D4;
    --mvf-line-strong: #DDD8CC;
    --mvf-ink: #293441;
    --mvf-ink-2: #525F6B;
    --mvf-muted: #6B7683;
    --mvf-faint: #8A8578;
    --mvf-teal: #507176;
    --mvf-teal-bg: #E8EFEF;
    --mvf-rose: #BA918A;
    --mvf-rose-ink: #8A5A4E;
    --mvf-rose-bg: #F6EAE7;
    --mvf-rose-line: #E4CFC9;
    --mvf-warn: #A45C4C;
    --mvf-serif: "Lora", Georgia, "Times New Roman", serif;
    --mvf-sans: Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---------------------------------------------------------------------
 * 2 · Flächen
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-main-dashboard,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-dashboard-layout,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-tab-panels,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-tab-panel,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-section-wrapper,
body:has(#mhp-dashboard.mhp-leader-dashboard),
body:has(#mhp-dashboard.mhp-leader-dashboard) #page,
body:has(#mhp-dashboard.mhp-leader-dashboard) .site,
body:has(#mhp-dashboard.mhp-leader-dashboard) .site-content,
body:has(#mhp-dashboard.mhp-leader-dashboard) .elementor,
body:has(#mhp-dashboard.mhp-leader-dashboard) .elementor-page,
body:has(#mhp-dashboard.mhp-leader-dashboard) main,
body:has(#mhp-dashboard.mhp-leader-dashboard) #content,
body:has(#mhp-dashboard.mhp-leader-dashboard) .content-area {
    background: #FAF6F2 !important;
    background-color: #FAF6F2 !important;
}

/* Karten: weiß statt creme. Der Kopfbereich ist ausgenommen — er wird
 * unten eigens behandelt und ist ab jetzt gar keine Karte mehr. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-card:not(.mhp-card-header) {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------------------
 * 3 · Kopfbereich: dunkler Block wird helle Zeile
 *
 * Das Markup bleibt unangetastet. Rauschtextur und die beiden
 * Radial-Verläufe werden ausgeblendet, statt sie aus dashboard.php zu
 * entfernen — so bleibt der Schritt vollständig umkehrbar.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--mvf-ink) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mvf-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 4px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-noise,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-accent,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-accent2 {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell {
    padding: 14px 0 12px !important;
}

/* Die Begrüßung war die größte Schrift der Seite. Sie wird zur
 * Bereichsmarke — klein, serif, teal: „Führung", wie im Entwurf. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-title {
    font-family: var(--mvf-serif) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    color: var(--mvf-teal) !important;
    margin: 0 0 5px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-title-name {
    font-weight: 600 !important;
    color: var(--mvf-ink) !important;
}

/* Kennzahlenzeile: MH-ID, Businesscode, Abteilung, Team.
 * Sie bestätigt, in welchem Konto man ist — dafür genügt Grau. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-line {
    margin: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 16px !important;
    font-size: 12.5px !important;
    color: var(--mvf-muted) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-k {
    font-size: 10.5px !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    color: var(--mvf-faint) !important;
    margin-right: 4px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-line strong,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-line .mhp-businesscode-value {
    font-weight: 500 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
}

/* Der Hinweisstreifen („Willkommen zurück …") stand als dritte Zeile
 * unter Titel und Kennzahlen und sagte nie etwas Fälliges. Er bleibt,
 * aber als ruhige Zeile — nicht als Signal mit Punkt davor. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-notice {
    margin: 8px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    font-size: 13px !important;
    color: var(--mvf-muted) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-notice-dot {
    background: var(--mvf-rose) !important;
}

/* Kopf-Buttons als Pillen wie im Entwurf */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-profile-btn,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-dept__save-btn,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-burger-menu-btn {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    min-height: 36px !important;
    padding: 6px 14px !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    font-family: var(--mvf-sans) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-profile-btn:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-burger-menu-btn:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-burger-menu-btn {
    padding: 6px 10px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-burger-menu-btn svg {
    width: 18px !important;
    height: 18px !important;
    stroke: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-dept__save-btn {
    background: var(--mvf-ink) !important;
    background-color: var(--mvf-ink) !important;
    border-color: var(--mvf-ink) !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
}

/* Bearbeitbare Kennzahlen (Mitarbeiter, Teamgröße) */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-strip {
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    margin-top: 12px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-meta-label {
    color: var(--mvf-faint) !important;
    font-size: 10.5px !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-meta-input,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-meta-value {
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    background: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 8px !important;
}

/* ---------------------------------------------------------------------
 * 4 · Reiterleiste: Pillen werden Unterstrich
 *
 * Fünf dunkle Pillen konkurrieren mit dem Inhalt darunter. Ein
 * Unterstrich sagt dasselbe und nimmt keine Fläche.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab-bar,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab-bar.mhp-ld-v2-subtab-bar {
    display: flex !important;
    gap: 2px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mvf-line) !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 0 clamp(20px, 4vw, 28px) !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab-bar::-webkit-scrollbar {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    margin-bottom: -1px !important;
    padding: 10px 13px 11px !important;
    min-height: 44px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-decoration: none !important;
    text-shadow: none !important;
    white-space: nowrap !important;
    color: var(--mvf-muted) !important;
    -webkit-text-fill-color: var(--mvf-muted) !important;
    box-shadow: none !important;
    filter: none !important;
    cursor: pointer !important;
    transition: color .13s ease, border-color .13s ease !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab:hover {
    background: none !important;
    background-color: transparent !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab.is-active {
    background: none !important;
    background-color: transparent !important;
    border-bottom-color: var(--mvf-teal) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    box-shadow: none !important;
}
/* Der Zähler wird zum Punkt: Die Zahl beantwortet keine Frage, die man
 * vor dem Klick hat — „da ist etwas" genügt. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab .mhp-tab-badge {
    width: 6px !important;
    min-width: 6px !important;
    height: 6px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: var(--mvf-rose) !important;
    background-color: var(--mvf-rose) !important;
    font-size: 0 !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    overflow: hidden !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab.is-active .mhp-tab-badge {
    display: none !important;
}

/* Reiterinhalt trägt keinen eigenen Rahmen mehr — der Reiter IST der
 * Rahmen. Ein Kasten im Kasten kostet auf dem Telefon zweimal Rand. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab-panel {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------------------
 * 5 · Typografie
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-tab-body {
    font-family: var(--mvf-sans) !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-kicker,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-kicker,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-ausw-section-title,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-axis-count {
    font-size: 11.5px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: var(--mvf-faint) !important;
    margin: 0 0 6px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-title,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-panel-intro h3,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-title,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-impulse-find-title,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-pf-h2 {
    font-family: var(--mvf-serif) !important;
    font-size: clamp(19px, 3.4vw, 23px) !important;
    font-weight: 600 !important;
    line-height: 1.22 !important;
    color: var(--mvf-ink) !important;
    margin: 0 0 6px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-copy,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-panel-intro p,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-docs-intro {
    font-size: 14.5px !important;
    line-height: 1.55 !important;
    color: var(--mvf-muted) !important;
    margin: 0 0 18px !important;
}

/* ---------------------------------------------------------------------
 * 6 · Buttons
 *
 * Genau drei Sorten: gefüllt (einmal pro Bildschirm), umrandet, Textlink.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-btn-primary,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-footer-btn--primary,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-coach,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-save,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-profile-save {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    padding: 12px 22px !important;
    border: 1px solid var(--mvf-ink) !important;
    border-radius: 9px !important;
    background: var(--mvf-ink) !important;
    background-color: var(--mvf-ink) !important;
    background-image: none !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
    font-family: var(--mvf-sans) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-btn-primary:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-footer-btn--primary:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-coach:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-save:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-profile-save:hover {
    background: #1F2833 !important;
    background-color: #1F2833 !important;
    border-color: #1F2833 !important;
}

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-btn-secondary,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-footer-btn--secondary,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-btn,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 9px 15px !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-btn-secondary:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-footer-btn--secondary:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-btn:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-link:hover {
    border-color: var(--mvf-teal) !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
}

/* ---------------------------------------------------------------------
 * 7 · „Heute relevant" — die Einstiegskarte
 *
 * Solange die Reduktion auf eine Karte in class-leader-tab-render.php
 * noch nicht steht, sorgt die Gewichtung hier dafür, dass die erste
 * Karte sichtbar die erste ist: teale Kante, weiße Fläche. Die
 * folgenden treten zurück.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-panel {
    margin: 0 0 clamp(24px, 4vw, 32px) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    gap: 10px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: clamp(16px, 3vw, 22px) !important;
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border: 1px solid var(--mvf-line) !important;
    border-left: 3px solid var(--mvf-line-strong) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    overflow: hidden !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card--primary {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border-left-color: var(--mvf-teal) !important;
    padding: clamp(18px, 3.5vw, 26px) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card-kicker {
    position: static !important;
    display: inline-block !important;
    margin: 0 0 10px !important;
    padding: 3px 11px !important;
    border: 1px solid var(--mvf-rose-line) !important;
    border-radius: 999px !important;
    background: var(--mvf-rose-bg) !important;
    background-color: var(--mvf-rose-bg) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-rose-ink) !important;
    -webkit-text-fill-color: var(--mvf-rose-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card-title {
    font-family: var(--mvf-serif) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.28 !important;
    color: var(--mvf-ink) !important;
    margin: 0 0 6px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card--primary .mhp-leader-today-card-title {
    font-size: clamp(19px, 3.4vw, 23px) !important;
    line-height: 1.25 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card-text {
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: var(--mvf-ink-2) !important;
    max-width: 62ch !important;
    margin: 0 0 14px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-actions {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}
/* In den nachrangigen Karten ist auch der erste Button nur umrandet —
 * gefüllt bleibt allein die Hauptkarte. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card:not(.mhp-leader-today-card--primary) .mhp-leader-today-btn-primary {
    min-height: 40px !important;
    padding: 9px 15px !important;
    font-size: 13px !important;
    border: 1px solid var(--mvf-line) !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card:not(.mhp-leader-today-card--primary) .mhp-leader-today-btn-primary:hover {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border-color: var(--mvf-teal) !important;
}

/* Zeile unter der Einstiegskarte: „Sonst ist nichts offen." + Aufklapper */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 14px 2px 0;
    font-size: 13.5px;
    color: var(--mvf-muted);
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more-none {
    color: var(--mvf-muted);
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 6px 0 !important;
    min-height: 34px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more-toggle:hover {
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-more[hidden] {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 15px;
    background: var(--mvf-surface);
    border: 1px solid var(--mvf-line);
    border-radius: var(--mvf-r, 9px);
    border-radius: 9px;
    font-size: 14px;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-row-text {
    color: var(--mvf-ink-2);
    min-width: 0;
}

/* ---------------------------------------------------------------------
 * 8 · Themen-Chips und Statusstreifen
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche {
    margin: clamp(28px, 5vw, 38px) 0 clamp(24px, 4vw, 30px) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-label {
    display: block;
    font-family: var(--mvf-serif);
    font-size: clamp(18px, 3.2vw, 21px);
    font-weight: 600;
    color: var(--mvf-ink);
    margin-bottom: 4px;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-lead {
    margin: 0 0 10px !important;
    font-size: 13.5px !important;
    color: var(--mvf-muted) !important;
}
/* Trefferliste an Ort und Stelle — kein Reiterwechsel, um zu sehen,
 * ob überhaupt etwas da ist. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-treffer {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-treffer[hidden] {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-treffer-zeile {
    display: flex !important;
    gap: 13px !important;
    align-items: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 13px 15px !important;
    background: var(--mvf-surface) !important;
    background-color: var(--mvf-surface) !important;
    background-image: none !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-treffer-zeile:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-treffer-titel {
    font-size: 14.5px;
    font-weight: 500;
    color: var(--mvf-ink);
    min-width: 0;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-fuss {
    margin: 10px 0 0 !important;
    font-size: 13px !important;
    color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-fuss[hidden] {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-mehr {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    box-shadow: none !important;
    font: inherit !important;
    font-weight: 500 !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-chips {
    margin-top: 12px;
}

/* Anlass-Einstieg: die Chips, die jetzt zuerst kommen, sind größer als
 * die Themen darunter — die Reihenfolge allein trüge das Gewicht nicht. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-group-label--anlass {
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-chips--anlass .mhp-lc-pf-chip {
    padding: 10px 16px !important;
    min-height: 44px !important;
    font-size: 14px !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    border-left: 3px solid var(--mvf-rose) !important;
    border-radius: 11px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-chips--anlass .mhp-lc-pf-chip.is-active {
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border-color: var(--mvf-teal) !important;
    border-left-color: var(--mvf-teal) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}

/* „Alle Themen durchsehen" — der Katalog bleibt, aber eingeklappt. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-alle {
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid var(--mvf-line);
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-alle-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    padding: 4px 0 !important;
    min-height: 40px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-alle-toggle:hover {
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-alle-body {
    margin-top: 10px;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-alle-body[hidden] {
    display: none !important;
}
/* Der Modus-Umschalter ist aus dem Markup raus. Die Regel bleibt als
 * Netz für gecachte Reiter-HTML (30 Minuten Lebensdauer). */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-mode {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-chips,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-axes {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-chip,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-chip,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-axis-chip,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-chip {
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    padding: 7px 13px !important;
    min-height: 36px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-shadow: none !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-chip:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-chip:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-axis-chip:hover,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-chip:hover {
    border-color: var(--mvf-teal) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-chip.is-active,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-axis-chip.is-active,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-chip.is-active {
    background: var(--mvf-ink) !important;
    background-color: var(--mvf-ink) !important;
    border-color: var(--mvf-ink) !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
}

/* Statusstreifen: Kennzahlenpaare nebeneinander */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-status-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
    gap: 14px 24px !important;
    margin: clamp(26px, 5vw, 34px) 0 0 !important;
    padding: 16px 0 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--mvf-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 14px !important;
    color: var(--mvf-ink) !important;
}

/*
 * Kontextstreifen ist KEIN Kennzahlenraster, sondern eine Zeile mit
 * Text links und einer Aktion rechts. Bekäme er dasselbe Grid, würde
 * „Kontext bearbeiten" zu einem zweiten, gleich breiten Block — und
 * damit optisch zur Hauptaktion des Reiters.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    margin: clamp(26px, 5vw, 34px) 0 0 !important;
    padding: 16px 0 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--mvf-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__left {
    flex: 1 1 240px !important;
    min-width: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__link {
    flex: 0 0 auto !important;
    width: auto !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 4px 0 !important;
    min-height: 34px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__sep {
    color: var(--mvf-line-strong) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__muted {
    color: var(--mvf-faint) !important;
    font-size: 11.5px !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__strong {
    color: var(--mvf-ink) !important;
    font-weight: 500 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-context-strip__link {
    color: var(--mvf-teal) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* ---------------------------------------------------------------------
 * 9 · Impuls- und Unterlagen-Karten
 *
 * Die Kante links unterscheidet die beiden Sorten. Das ist billiger
 * als ein Symbol und überlebt jede Übersetzung.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-card {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-left: 3px solid var(--mvf-teal) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-card {
    border-left-color: var(--mvf-rose) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-card-title,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-title {
    font-family: var(--mvf-sans) !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-card-summary,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-sub,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-meta {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-tag,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-card-tags > span {
    border-radius: 999px !important;
    padding: 4px 9px !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    background: var(--mvf-teal-bg) !important;
    background-color: var(--mvf-teal-bg) !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-card .mhp-lc-tag,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-tag--occ {
    background: var(--mvf-rose-bg) !important;
    background-color: var(--mvf-rose-bg) !important;
    color: var(--mvf-rose-ink) !important;
    -webkit-text-fill-color: var(--mvf-rose-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-version,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-doc-meta {
    font-size: 11px !important;
    color: var(--mvf-faint) !important;
}

/* Suchfeld des Problemfinders */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-input,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-feld {
    width: 100% !important;
    min-height: 48px !important;
    padding: 14px 16px !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    font-family: var(--mvf-sans) !important;
    font-size: 15px !important;
    color: var(--mvf-ink) !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-pf-input:focus,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-heute-suche-feld:focus {
    outline: 2px solid var(--mvf-teal) !important;
    outline-offset: 2px !important;
    border-color: var(--mvf-teal) !important;
}

/* ---------------------------------------------------------------------
 * 10 · Wochen-Check-in
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-inner {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-left: 3px solid var(--mvf-teal) !important;
    border-radius: 12px !important;
    padding: clamp(18px, 3.5vw, 26px) !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-q {
    font-family: var(--mvf-serif) !important;
    font-size: clamp(18px, 3.2vw, 21px) !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-q-sub,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-hint-text {
    font-size: 13.5px !important;
    color: var(--mvf-muted) !important;
}
/*
 * Ruhezustand des Check-ins: eine Zeile statt eines Formulars.
 *
 * Alles innerhalb von .mhp-leader-checkin-inner wird ausgeblendet, nur
 * die Ruhezeile bleibt. Das Markup ist vollständig da — der Knopf
 * entfernt bloß die Klasse, und das Formular steht sofort ohne
 * Nachladen bereit.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin--ruhe .mhp-leader-checkin-inner > *:not(.mhp-leader-checkin-ruhe),
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin--ruhe .mhp-leader-checkin-banner {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin--ruhe .mhp-leader-checkin-inner {
    padding: 12px 15px !important;
    border-left-width: 1px !important;
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border-left-color: var(--mvf-line) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-ruhe {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-ruhe-text {
    font-size: 13.5px;
    color: var(--mvf-ink-2);
}
/* Nach dem Aufklappen ist die Zeile überflüssig — sie stünde sonst
 * doppelt über der Frage, die sie ankündigt. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin:not(.mhp-leader-checkin--ruhe) .mhp-leader-checkin-ruhe {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-ruhe-open {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    padding: 4px 0 !important;
    min-height: 34px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-ruhe-open:hover {
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}

/* E-Mail-Routinen als Abschnitt in „Meine Arbeit" */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-routines-section {
    margin: clamp(26px, 5vw, 34px) 0 0;
    padding: 18px 0 0;
    border-top: 1px solid var(--mvf-line);
    background: transparent;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-restore-banner {
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border: 1px dashed var(--mvf-line) !important;
    border-radius: 12px !important;
    color: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-restore {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 8px !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-weight: 500 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-restore:hover {
    border-color: var(--mvf-teal) !important;
}

/* ---------------------------------------------------------------------
 * 11 · Maßnahmen und Auswertungen
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-measures-root > div,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-ausw-card {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-ausw-badge {
    border-radius: 999px !important;
    padding: 4px 9px !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    border: 0 !important;
    background: var(--mvf-teal-bg) !important;
    background-color: var(--mvf-teal-bg) !important;
    color: var(--mvf-teal) !important;
    -webkit-text-fill-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-ausw-badge--hold {
    background: var(--mvf-rose-bg) !important;
    background-color: var(--mvf-rose-bg) !important;
    color: var(--mvf-rose-ink) !important;
    -webkit-text-fill-color: var(--mvf-rose-ink) !important;
}

/* Flow-Erklärung „Planen → Review → Coaching": ruhige Fläche statt
 * dreier gleichwertiger Kästen vor dem, weswegen man gekommen ist. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-flow {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
    gap: 12px !important;
    margin: 0 0 20px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-flow > div {
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 11px !important;
    padding: 14px 16px !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-flow span {
    font-size: 10.5px !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-flow strong {
    display: block !important;
    margin: 4px 0 4px !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-measure-flow p {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: var(--mvf-ink-2) !important;
}

/* ---------------------------------------------------------------------
 * 12 · Hinweiskästen
 *
 * Ab jetzt eindeutig nachrangig: cremefarben mit einer 2px-Kante links,
 * nie mit demselben Gewicht wie eine Karte.
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-trust-box,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-ausw-hint,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-auswertung-notice,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-checkin-hint {
    background: var(--mvf-quiet) !important;
    background-color: var(--mvf-quiet) !important;
    border: 1px solid var(--mvf-line) !important;
    border-left: 2px solid var(--mvf-teal) !important;
    border-radius: 0 9px 9px 0 !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: var(--mvf-muted) !important;
    box-shadow: none !important;
}

/* Beratungs-Aufruf */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-booking-cta {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 12px !important;
    padding: clamp(18px, 3.5vw, 24px) !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------------------
 * 13 · Coaching-Dossier
 *
 * Der Hinweis „bitte ohne Namen" steht unmittelbar über dem
 * Absende-Knopf. Im Platzhalter des Eingabefelds wäre er zum Zeitpunkt
 * der Entscheidung längst vergessen — hier liest man ihn genau dann,
 * wenn der Text tatsächlich das Haus verlässt.
 * ------------------------------------------------------------------- */
html body .mhp-leader-coaching-modal__dialog {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line, #E6E0D4) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 44px rgba(41, 52, 65, .18) !important;
}
html body .mhp-leader-coaching-modal__kicker {
    font-size: 11.5px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #8A8578 !important;
    margin: 0 0 6px !important;
}
html body .mhp-leader-coaching-modal__title {
    font-family: "Lora", Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #293441 !important;
    margin: 0 0 8px !important;
}
html body .mhp-leader-coaching-modal__copy {
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: #525F6B !important;
}
html body .mhp-leader-coaching-modal__preview {
    background: #FFFCF3 !important;
    background-color: #FFFCF3 !important;
    border: 1px solid #E6E0D4 !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
    margin: 14px 0 0 !important;
}
html body .mhp-leader-coaching-modal__preview dl {
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    gap: 6px 14px !important;
}
html body .mhp-leader-coaching-modal__preview dt {
    margin: 0 !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: #8A8578 !important;
    white-space: nowrap !important;
    padding-top: 2px !important;
}
html body .mhp-leader-coaching-modal__preview dd {
    margin: 0 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: #525F6B !important;
}
html body .mhp-leader-coaching-modal__noname {
    margin: 12px 0 0 !important;
    padding: 10px 13px !important;
    background: #F6EAE7 !important;
    background-color: #F6EAE7 !important;
    border: 0 !important;
    border-left: 2px solid #BA918A !important;
    border-radius: 0 8px 8px 0 !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    color: #8A5A4E !important;
}
html body .mhp-leader-coaching-modal__noname strong {
    color: #8A5A4E !important;
    font-weight: 700 !important;
}

/* ---------------------------------------------------------------------
 * 14 · Einstellungsblock am Fuß von „Maßnahmen & Coaching"
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings {
    margin: clamp(26px, 5vw, 34px) 0 0;
    padding: 18px 0 0;
    border-top: 1px solid var(--mvf-line);
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-h {
    margin: 0 0 14px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-copy {
    flex: 1 1 280px;
    min-width: 0;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-label {
    display: block !important;
    margin: 0 0 2px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-hint {
    margin: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    color: var(--mvf-muted) !important;
    max-width: 62ch;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-field {
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-input {
    width: 240px !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 11px 14px !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    color: var(--mvf-ink) !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-input:focus {
    outline: 2px solid var(--mvf-teal) !important;
    outline-offset: 2px !important;
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-save {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 11px 18px !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-save:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-save[disabled] {
    opacity: .6 !important;
    cursor: default !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-settings-msg {
    margin: 10px 0 0 !important;
    min-height: 1.2em;
    font-size: 13px !important;
    color: var(--mvf-muted) !important;
}

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-profile-label {
    display: block !important;
    margin: 18px 0 2px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-profile-hint {
    margin: 0 0 8px !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    color: var(--mvf-muted) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-profile-field {
    width: 100% !important;
    padding: 11px 14px !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: var(--mvf-ink) !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------------------
 * 15 · Onboarding
 * ------------------------------------------------------------------- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ob-karte {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ob-frage {
    font-family: var(--mvf-serif) !important;
    font-weight: 600 !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ob-hinweis {
    color: var(--mvf-muted) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ob-balken {
    background: var(--mvf-line) !important;
    background-color: var(--mvf-line) !important;
    border-radius: 999px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ob-balken-fuell {
    background: var(--mvf-teal) !important;
    background-color: var(--mvf-teal) !important;
    border-radius: 999px !important;
}

/* ---------------------------------------------------------------------
 * 16 · Telefon
 * ------------------------------------------------------------------- */
@media (max-width: 700px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell {
        padding: 12px 0 10px !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-line {
        gap: 3px 12px !important;
        font-size: 12px !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab {
        padding: 10px 10px 11px !important;
        font-size: 13.5px !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-grid {
        grid-template-columns: 1fr !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-actions .mhp-leader-today-btn-primary,
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-actions .mhp-leader-today-btn-secondary {
        flex: 1 1 auto !important;
    }
}

/* ---------------------------------------------------------------------
 * 18 · Nachträge aus dem ersten Livegang
 *
 * Drei Stellen, an denen die alten Dateien mit zwei IDs gewonnen haben
 * und die deshalb in der ersten Fassung unverändert aussahen.
 * ------------------------------------------------------------------- */

/* Der Reiterinhalt saß in einem cremefarbenen Kasten mit Rahmen — ein
 * Kasten im Kasten, der auf dem Telefon zweimal Rand kostet. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-panel-leadership .mhp-leader-subtab-panel,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-leadership-lazy-root .mhp-leader-subtab-panel {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/*
 * Der Kicker lief als rosa Balken über die volle Breite.
 *
 * Nicht wegen display — die Karte ist ein Flex-Container, und ein
 * Flex-Item wird von align-items:stretch auf volle Breite gezogen,
 * ganz gleich ob es inline-block heißt. (Der Browser blockifiziert
 * display bei Flex-Items ohnehin; die Regel darüber ist wirkungslos
 * und bleibt nur stehen, falls die Karte je wieder ein normaler
 * Block wird.)
 *
 * Das Mittel ist align-self, nicht display. justify-self deckt den
 * Fall mit ab, dass die Karte auf Grid umgestellt wird.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-today-card-kicker {
    display: inline-block !important;
    align-self: flex-start !important;
    justify-self: start !important;
    width: auto !important;
    max-width: max-content !important;
    flex: 0 0 auto !important;
}

/* Statusstreifen-Marken („Check-in offen") in der Palette der Karten,
 * nicht in Gold. Gold war die einzige Farbe auf dem Bildschirm, die
 * nirgendwo sonst vorkam. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-status-strip .mhp-tab-badge,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-status-strip [class*="badge"] {
    background: #F6EAE7 !important;
    background-color: #F6EAE7 !important;
    border: 1px solid #E4CFC9 !important;
    border-radius: 999px !important;
    padding: 3px 11px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #8A5A4E !important;
    -webkit-text-fill-color: #8A5A4E !important;
    overflow: visible !important;
}

/* =====================================================================
 * 19 · Kopfleiste und Bereichsmenü
 *
 * Der Entwurf hat EINE Zeile oben: Logo · Führung · … · Bereiche ·
 * Konto. Darunter die Reiter, linksbündig mit dem Logo, über die volle
 * Breite. Keine Seitenleiste.
 *
 * Die Seitenleiste zog ein Viertel der Breite und trug eine dunkel
 * gefüllte Pille für den Bereich, auf dem man ohnehin steht. Sie
 * konkurrierte damit mit dem einen gefüllten Knopf der Einstiegskarte —
 * und gewann, weil sie größer ist und weiter oben steht. Die Navigation
 * ist nicht verschwunden, sie wandert per Skript ins Menü „Bereiche".
 * ===================================================================== */

/* Inhaltsspalte über die volle Breite — es gibt keine Seitenspalte mehr */
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-dashboard-layout,
html body:has(#mhp-dashboard.mhp-leader-dashboard) #mhp-main-dashboard.mhp-dashboard-content > .mhp-dashboard-layout {
    display: block !important;
    grid-template-columns: none !important;
}
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-tab-panels {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Kopfzeile: Logo/Marke links, Bedienung rechts, alles in einer Zeile */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-top {
    align-items: center !important;
    gap: 14px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-right {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 0 0 auto !important;
}

/* MH-ID, Businesscode, Abteilung, Team stehen jetzt im Menü.
 * Im Entwurf trägt die Kopfzeile nichts davon — es sind Angaben, die
 * man einmal im Quartal nachschlägt, nicht bei jedem Öffnen. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-meta-line {
    display: none !important;
}
/* Der Hinweisstreifen wandert inhaltlich in die Zeile unter der
 * Überschrift („Nächste Routine … am 26. August") — oben ist er
 * Dopplung. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-notice {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-title {
    font-size: 16px !important;
    margin: 0 !important;
}

/* --- Knopf „Bereiche" --- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas {
    position: relative !important;
    flex: 0 0 auto !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-btn {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    padding: 6px 14px !important;
    min-height: 36px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-btn:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-btn.is-open {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-burger {
    display: grid !important;
    gap: 2.5px !important;
    width: 12px !important;
    flex: 0 0 auto !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-burger i {
    display: block !important;
    height: 1.5px !important;
    background: #525F6B !important;
    border-radius: 2px !important;
}

/* --- Aufklappmenü --- */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-menu {
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 60 !important;
    min-width: 250px !important;
    padding: 6px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 30px rgba(41, 52, 65, .14) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-menu[hidden] {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-kicker {
    margin: 6px 10px 8px !important;
    font-size: 10.5px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-foot {
    margin: 8px 10px 6px !important;
    padding-top: 8px !important;
    border-top: 1px solid var(--mvf-line) !important;
    font-size: 11.5px !important;
    color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-foot strong {
    font-weight: 500 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
}

/* Die umgezogene Navigation im Menü: Zeilen mit Punkt, kein Farbblock */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot #mhp-main-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
    overflow: visible !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    justify-content: flex-start !important;
    text-align: left !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    padding: 10px 11px !important;
    min-height: 42px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    cursor: pointer !important;
}
/*
 * DER PUNKT MUSS IN DER ZEILE BLEIBEN.
 *
 * participant.css/dashboard.php geben `.mhp-main-tab.active::before` für
 * die alte Seitenleiste position:absolute mit (left:0, top:50%,
 * transform). Diese Regel hier war spezifischer und hat Größe, Form und
 * Farbe überschrieben — position, inset und transform aber NICHT, weil
 * sie hier gar nicht standen. Zusammen mit `.mhp-main-tab {position:
 * static}` weiter unten war der nächste positionierte Vorfahr dann das
 * Menü selbst: Der Punkt der aktiven Zeile sprang an dessen linken Rand
 * auf halbe Höhe — sichtbar als loser Punkt neben „Weitere Beratung",
 * der zu keiner Zeile gehörte.
 *
 * Deshalb werden alle vier Positionsangaben hier ausdrücklich
 * zurückgenommen. Der Punkt ist ein Flex-Kind der Zeile, sonst nichts.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab::before {
    content: "" !important;
    position: static !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: transparent !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab:hover {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab.active {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-weight: 600 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab.active::before {
    background: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-tab-text {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    font: inherit !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-tab-badge {
    width: 6px !important;
    min-width: 6px !important;
    height: 6px !important;
    margin-left: auto !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: var(--mvf-rose) !important;
    background-color: var(--mvf-rose) !important;
    font-size: 0 !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

/*
 * Solange das Skript die Navigation noch nicht umgezogen hat, darf sie
 * nicht als breite Spalte aufblitzen: erst ausblenden, im Slot wieder
 * einblenden. Die zweite Regel trägt fünf IDs gegen zwei und gewinnt,
 * sobald das Element angekommen ist — kein :not() mit Kombinator nötig,
 * das nicht überall gleich zuverlässig ist.
 */
html body:has(#mhp-dashboard.mhp-leader-dashboard) #mhp-main-nav.mhp-main-nav-sidebar {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot #mhp-main-nav.mhp-main-nav-sidebar {
    display: flex !important;
}

@media (max-width: 700px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-btn-label {
        display: none !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-menu {
        min-width: 220px !important;
    }
}

/* Das Menü klappt nach unten aus dem Kopfbereich heraus — jeder
 * overflow:hidden auf dem Weg dorthin schneidet es ab. Die alten
 * Dateien setzen es an drei Stellen, weil dort einmal Verläufe
 * beschnitten werden mussten, die es nicht mehr gibt. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-dashboard-header,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-top,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-right {
    overflow: visible !important;
}

/*
 * Der Kopfbereich muss über dem Inhalt liegen, sonst verschwindet das
 * aufgeklappte Menü hinter dem Suchfeld.
 *
 * Der Wert ist nicht beliebig: Die Reiterleiste (#…-subtabs) ist
 * position:sticky mit z-index:50 und steht später im DOM — bei
 * Gleichstand gewinnt sie. 200 setzt den Kopf eindeutig darüber, ohne
 * mit Modalen (die deutlich höher liegen) zu kollidieren.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card {
    position: relative !important;
    z-index: 200 !important;
}

/* =====================================================================
 * 20 · Die eine Kopfzeile
 *
 * Logo, Telefon, Sprache und Abmelden lagen als position:fixed-Blöcke
 * über der Seite. Ein Skript holt sie in den Kopfbereich; hier bekommen
 * sie dort ihre Form. Alles unter .mhp-leader-dashboard — für alle
 * anderen bleiben die Blöcke, wo sie sind.
 * ===================================================================== */

/* Die leeren Hüllen der ehemals schwebenden Gruppen dürfen keinen Platz
 * mehr beanspruchen und nichts mehr überlagern. */
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-header-right-container,
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-header-actions-desktop {
    position: static !important;
    display: contents !important;
    pointer-events: auto !important;
}

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    padding-right: 14px !important;
    margin-right: 2px !important;
    border-right: 1px solid var(--mvf-line-strong) !important;
    min-height: 28px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot #mhp-logo-header-desktop {
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: auto !important;
    display: block !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot .mhp-logo-img {
    height: 26px !important;
    width: auto !important;
    max-width: none !important;
    display: block !important;
}

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 0 0 auto !important;
}

/* Telefon: aus der Karte wird eine Zeile. Die Nummer bleibt sichtbar —
 * in einem Produkt für psychische Gesundheit ist die Rufnummer keine
 * Zierde, die man beim Aufräumen wegwirft. Sie hört nur auf, als
 * eigener Kasten über dem Inhalt zu schweben. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-desktop {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 !important;
    padding: 5px 12px !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    min-height: 34px !important;
    z-index: auto !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-desktop:hover {
    border-color: var(--mvf-line) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-desktop svg {
    width: 14px !important;
    height: 14px !important;
    stroke: var(--mvf-teal) !important;
    flex: 0 0 auto !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-info a {
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
/* Die Öffnungszeiten verschwinden aus der Zeile — sie stehen auf der
 * Seite hinter der Nummer und beantworten keine Frage, die man beim
 * Öffnen des Dashboards hat. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-hours {
    display: none !important;
}

/* Sprachumschalter */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop {
    position: static !important;
    z-index: auto !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Abmelden: gleiche Pille wie „Bereiche", nur ohne Rahmenbetonung */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-btn-businesscode-logout {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 6px 14px !important;
    min-height: 36px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    z-index: auto !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-btn-businesscode-logout:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-btn-businesscode-logout svg {
    width: 15px !important;
    height: 15px !important;
    margin: 0 !important;
    stroke: var(--mvf-ink-2) !important;
}

/* Der Burger im Kopf war der Zugang zu genau der Navigation, die jetzt
 * unter „Bereiche" steht. Zwei Knöpfe für dasselbe Ziel sind einer zu
 * viel. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card #mhp-burger-menu-btn {
    display: none !important;
}

@media (max-width: 900px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-desktop,
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-leader-head-edit {
        display: none !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot .mhp-logo-img {
        height: 22px !important;
    }
}

/* =====================================================================
 * 21 · Ausrichtung, Breite und der doppelte Kopf auf dem Telefon
 * ===================================================================== */

/*
 * Der Kopfbereich war schmaler als der Inhalt darunter: Er ist eine
 * .mhp-card und brachte deren Innenabstand und Rundung mit, während die
 * Reiter direkt am Spaltenrand sitzen. Logo und „Jetzt" standen dadurch
 * nicht untereinander — und genau das fällt als Erstes auf.
 *
 * Er wird jetzt randlos und bündig: gleiche Breite, gleiche Kante.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-dashboard-header,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell {
    padding: 14px 0 12px !important;
}

/* Die Inhaltsspalte darf die Breite nutzen, die ohne Seitenleiste frei
 * geworden ist. 1280px, weil Fließtext darüber hinaus schlechter zu
 * lesen ist — die Karten begrenzen sich ohnehin auf 62 Zeichen. */
html body:has(#mhp-dashboard.mhp-leader-dashboard) #mhp-main-dashboard.mhp-dashboard-content {
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: clamp(16px, 4vw, 24px) !important;
    padding-right: clamp(16px, 4vw, 24px) !important;
}

/*
 * ZWEI KOPFZEILEN AUF DEM TELEFON.
 *
 * Das Dashboard bringt einen eigenen Mobil-Kopf mit (Logo, Abmelden,
 * Burger). Er war die Antwort darauf, dass die schwebenden Blöcke auf
 * kleinen Bildschirmen nicht funktionierten - eine Frage, die sich mit
 * der einen Kopfzeile nicht mehr stellt. Für Führungskräfte trägt sie
 * dieselben drei Dinge und ist überall gleich, also fällt der zweite Kopf
 * weg. Bei allen anderen bleibt er unberührt.
 */
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-mobile-header-container,
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-header-actions-mobile,
html body:has(#mhp-dashboard.mhp-leader-dashboard) .mhp-header-actions-mobile-inline {
    display: none !important;
}

@media (max-width: 760px) {
    /* Auf dem Telefon bricht die Zeile um: Marke oben, Bedienung darunter. */
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-top {
        flex-wrap: wrap !important;
        gap: 10px !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-header-left {
        flex: 1 1 auto !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-header-right {
        flex: 1 1 100% !important;
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}

/* =====================================================================
 * 22 · Das verschobene Bereichsmenü und das Profil-Modal
 * ===================================================================== */

/*
 * WARUM DIE VIELEN ZURÜCKSETZUNGEN:
 *
 * participant.css gibt .mhp-main-nav-sidebar position, top, left,
 * height UND transform mit — für die Seitenleisten-Darstellung völlig
 * richtig. Nach dem Umzug ins Menü wirkt das weiter: Die Navigation
 * hing an ihrer alten Position und lief oben aus dem weißen Feld
 * heraus, während die Fußzeile darin korrekt saß.
 *
 * transform ist der unangenehmste Teil — es erzeugt einen eigenen
 * Bezugsrahmen und hätte auch ohne position-Angabe gestört. Deshalb
 * werden hier ALLE fünf zurückgenommen, nicht nur position.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot #mhp-main-nav.mhp-main-nav-sidebar {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-main-tab {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    height: auto !important;
}
/* Falls die Liste je länger wird als der Bildschirm hoch ist. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-menu {
    max-height: min(70vh, 560px) !important;
    overflow-y: auto !important;
}

/* --- Profil-Modal --- */
html body .mhp-leader-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
}
html body .mhp-leader-modal[hidden] {
    display: none !important;
}
html body .mhp-leader-modal__backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(41, 52, 65, .38) !important;
}
html body .mhp-leader-modal__dialog {
    position: relative !important;
    z-index: 1 !important;
    width: min(520px, 100%) !important;
    max-height: 86vh !important;
    overflow-y: auto !important;
    padding: 26px 28px 24px !important;
    background: #FFFFFF !important;
    border: 1px solid #E6E0D4 !important;
    border-radius: 14px !important;
    box-shadow: 0 22px 54px rgba(41, 52, 65, .22) !important;
}
html body .mhp-leader-modal__close {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #F5F1E8 !important;
    background-image: none !important;
    color: #6B7683 !important;
    -webkit-text-fill-color: #6B7683 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
html body .mhp-leader-modal__close:hover {
    background: #E6E0D4 !important;
    color: #293441 !important;
    -webkit-text-fill-color: #293441 !important;
}
html body .mhp-leader-modal__kicker {
    margin: 0 0 6px !important;
    font-family: Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 11.5px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #8A8578 !important;
}
html body .mhp-leader-modal__title {
    margin: 0 0 18px !important;
    font-family: "Lora", Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #293441 !important;
}
/* Der Streifen war für die Kopfzeile gebaut — im Modal darf er atmen. */
html body .mhp-leader-modal__slot .mhp-leader-header-meta-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
    gap: 14px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
html body .mhp-leader-modal__slot .mhp-leader-meta-label {
    display: block !important;
    margin-bottom: 4px !important;
    font-size: 10.5px !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    color: #8A8578 !important;
}
html body .mhp-leader-modal__slot .mhp-leader-meta-input {
    width: 100% !important;
    min-height: 44px !important;
    padding: 11px 14px !important;
    border: 1px solid #E6E0D4 !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    font-size: 15px !important;
    color: #293441 !important;
}
html body .mhp-leader-modal__slot .mhp-leader-header-dept__save-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    padding: 12px 22px !important;
    border: 1px solid #293441 !important;
    border-radius: 9px !important;
    background: #293441 !important;
    background-image: none !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
html body .mhp-leader-modal__slot .mhp-leader-header-dept__msg {
    margin: 10px 0 0 !important;
    font-size: 13px !important;
    color: #6B7683 !important;
}

/* Solange nichts geöffnet ist, hat der Bearbeiten-Streifen in der
 * Kopfzeile nichts verloren — er wartet unsichtbar auf den Umzug.
 * „Speichern" ebenso: Der Knopf gehört zum Formular, nicht in die
 * Kopfleiste, wo er als zweiter gefüllter Knopf neben der Einstiegskarte
 * stand. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell > .mhp-leader-header-meta-strip--editonly,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell > .mhp-leader-header-dept__msg,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-right > #mhp-leader-head-save {
    display: none !important;
}

/* =====================================================================
 * 23 · Der Sprachumschalter
 *
 * WPML bringt für den Legacy-Dropdown eigene Formen mit: rechteckiger
 * Rahmen, eigener Innenabstand, ein absolut gesetztes Dreieck rechts.
 * In einer Zeile aus Pillen ist das der eine Kasten mit Ecken — er zieht
 * den Blick auf sich, obwohl er von allen Elementen der Kopfzeile am
 * seltensten gebraucht wird.
 *
 * Hier bekommt er dieselbe Pille wie „Bereiche" und „Abmelden": gleiche
 * Höhe, gleicher Radius, gleiche Linie. Die Fahne wird auf eine feste
 * Größe gebracht (WPML liefert je nach Sprache 18x12 oder 16x11), damit
 * die Zeile nicht je nach aktiver Sprache anders hoch ist.
 * ===================================================================== */

/* Hülle: kein Kasten, nur ein Flex-Element in der Zeile. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-legacy-dropdown,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-legacy-dropdown-click {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls ul {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls li::marker,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls li::before {
    content: none !important;
    display: none !important;
}
/* Das Element, an dem das Untermenü hängt, muss der Bezugsrahmen bleiben. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-legacy-dropdown,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-legacy-dropdown-click {
    position: relative !important;
}

/* Die Pille selbst. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .js-wpml-ls-item-toggle {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 6px 26px 6px 12px !important;
    min-height: 36px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle:hover {
    border-color: var(--mvf-teal) !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
}

/* Fahne: feste Größe, damit die Zeilenhöhe nicht mit der Sprache wandert. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-flag {
    display: block !important;
    width: 18px !important;
    height: 12px !important;
    margin: 0 !important;
    object-fit: cover !important;
    border-radius: 2px !important;
    box-shadow: 0 0 0 1px rgba(41, 52, 65, .10) !important;
    vertical-align: middle !important;
    flex: 0 0 auto !important;
}

/* Sprachname in der Pille: nur der Kurzcode wäre schöner, den liefert
 * WPML aber nicht zuverlässig. Also bleibt der Name — mit der Schrift
 * der Nachbarn statt WPMLs Standard. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle .wpml-ls-native,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle .wpml-ls-display {
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}

/*
 * Der Pfeil. WPML setzt ihn absolut mit right:10px und einem
 * border-top-Dreieck in der Textfarbe. Er bleibt absolut — in einer
 * Pille mit rundem Rand ist das die ruhigere Lösung als ein weiteres
 * Flex-Kind — wird aber kleiner, heller und optisch mittig gesetzt.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 11px !important;
    left: auto !important;
    width: 0 !important;
    height: 0 !important;
    margin: -1px 0 0 !important;
    border-left: 3.5px solid transparent !important;
    border-right: 3.5px solid transparent !important;
    border-top: 4px solid #8A8578 !important;
    border-bottom: 0 !important;
    background: transparent !important;
    transform: none !important;
    opacity: 1 !important;
}

/* Das Untermenü in derselben Sprache wie das Bereichsmenü. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-sub-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    left: auto !important;
    z-index: 300 !important;
    min-width: 168px !important;
    margin: 0 !important;
    padding: 6px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 30px rgba(41, 52, 65, .14) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-sub-menu a {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 9px 11px !important;
    min-height: 38px !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 8px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-sub-menu a:hover {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-sub-menu a::after {
    content: none !important;
    display: none !important;
}

/* Auf dem Telefon reicht die Fahne — der Name macht die Zeile zu lang. */
@media (max-width: 760px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle .wpml-ls-native,
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle .wpml-ls-display {
        display: none !important;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop .wpml-ls-item-toggle {
        padding: 6px 22px 6px 10px !important;
    }
}

/* =====================================================================
 * 24 · Gleiche Höhe für alle Bedienelemente der Kopfzeile
 *
 * Die Flagge stand „zu tief": Ihre Mitte lag zwar exakt auf einer Linie
 * mit den Nachbarn (alle mid = 39px), die Pille war aber kleiner als
 * ihre Nachbarn — und genau das sieht man.
 *
 * Der Grund ist box-sizing. „Bereiche" und „Profil bearbeiten" sind
 * <button>, die im Browser border-box sind: min-height:36px heißt dort
 * 36px AUSSENMASS. „Abmelden" ist ein <a> und die Telefonzeile ein
 * <div> — beide content-box. Dort heißt min-height:36px 36px INNENMASS,
 * plus 12px Polsterung plus 2px Rahmen:
 *
 *     Abmelden  36 + 12 + 2 = 50px
 *     Telefon   34 + 10 + 2 = 46px
 *     Flagge                  36px   (hier war box-sizing gesetzt)
 *
 * Also bekommen alle dasselbe Kastenmodell und dieselbe Höhe.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-btn-businesscode-logout,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-logo-phone-desktop,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-btn,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-leader-head-edit.mhp-leader-header-profile-btn {
    box-sizing: border-box !important;
    min-height: 36px !important;
    height: 36px !important;
}

/* =====================================================================
 * 25 · Logo in die linke Ecke, Trennlinie, dann „Führung"
 *
 * order:-1 statt bloßer Markup-Reihenfolge: Sollte ein anderes Skript
 * je etwas vor den Logo-Slot hängen, bleibt das Logo trotzdem das erste
 * Element der Zeile. margin/padding links auf 0, damit es bündig mit
 * der Inhaltsspalte darunter steht — die Kante ist das, was man als
 * „in der Ecke" wahrnimmt.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot {
    order: -1 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    align-self: center !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-header-left {
    order: 0 !important;
    margin-left: 0 !important;
}
/* Das Logo hat den Umzug hinter sich — die fixe Position aus
 * participant.css darf hier nicht mehr durchschlagen. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-logo-slot #mhp-logo-header-desktop.mhp-logo-header {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
}

/* =====================================================================
 * 26 · Die Kopfzeile über die volle Bildschirmbreite
 *
 * Im Entwurf sitzt das Logo in der linken Bildschirmecke, nicht am Rand
 * einer mittigen 1280px-Spalte. Auf einem breiten Monitor sind das
 * schnell 600px Unterschied — deshalb wirkte das Logo „nicht in der
 * Ecke", obwohl es korrekt am Spaltenanfang stand.
 *
 * Gelöst wird das NICHT mit einem 100vw-Ausbruch (der rechnet die
 * Scrollleiste mit und erzeugt auf Windows eine waagerechte
 * Bildlaufleiste), sondern indem die Spalte selbst über die volle
 * Breite geht. Ein gemeinsamer Seitenabstand für Kopfzeile, Reiter und
 * Inhalt hält alles auf einer Kante — genau wie im Entwurf, wo Logo,
 * „Heute" und „DIENSTAG, 25. AUGUST" bündig untereinander stehen.
 *
 * Die Zeilenlänge leidet nicht: Die Karten begrenzen ihren Fließtext
 * ohnehin selbst.
 * ===================================================================== */

html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard {
    --mvf-gutter: clamp(20px, 2.6vw, 40px);
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 0 !important;
    padding-left: var(--mvf-gutter) !important;
    padding-right: var(--mvf-gutter) !important;
}
html body:has(#mhp-dashboard.mhp-leader-dashboard) #mhp-main-dashboard.mhp-dashboard-content {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/*
 * Höhen wie im Entwurf: Kopfzeile knapp 48px (36px Bedienelemente plus
 * 6px oben und unten), darunter eine Haarlinie, dann die Reiter, dann
 * wieder eine Haarlinie. Vorher waren es 14px/12px — die Zeile war
 * dadurch rund ein Viertel höher als gezeichnet.
 */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid var(--mvf-line) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card .mhp-leader-header-shell {
    padding: 6px 0 !important;
}

/* Reiterleiste: bündig mit dem Logo, Haarlinie darunter, danach Luft
 * bis zum ersten Inhalt (im Entwurf rund 30px). */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtabs {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 30px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-bottom: 1px solid var(--mvf-line) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtab-bar {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Auf dem Telefon wird der Seitenabstand kleiner, sonst bleibt für den
 * Inhalt zu wenig übrig. */
@media (max-width: 600px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard {
        --mvf-gutter: 16px;
    }
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtabs {
        margin-bottom: 22px !important;
    }
}

/* =====================================================================
 * 27 · Weniger Luft zwischen Kopfzeile und Reitern
 *
 * Gemessen im Screenshot: von der Haarlinie unter der Kopfzeile bis zur
 * Oberkante von „Jetzt" waren es rund 45px. Der Abstand steht nicht an
 * einer Stelle, sondern summiert sich aus den Abständen der Hüllen
 * dazwischen (Panel, Lazy-Root, Reiter-Container) — jede für sich
 * unauffällig. Deshalb werden die Hüllen auf 0 gesetzt und der Abstand
 * EINMAL an der Reiterleiste vergeben. Dann steht er an einer Stelle
 * und ist beim nächsten Mal in einer Zeile änderbar.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-tab-panels,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-tab-panel,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-panel-leadership,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-leadership-lazy-root,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-tab-body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-subtabs.mhp-ld-v2-subtabs--top {
    margin-top: 18px !important;   /* <- hier stellst du den Abstand ein */
    padding-top: 0 !important;
}

/* =====================================================================
 * 28 · Sprachumschalter — Rückfallregeln
 *
 * Abschnitt 23 formt den WPML-Umschalter zur Pille. Im Screenshot wirkt
 * er nicht: Der Kasten ist 28px hoch und sitzt 18px tiefer als seine
 * Nachbarn (Abmelden: 46px von oben, 36px hoch — Flagge: 64px von oben,
 * 28px hoch). Abschnitt 24 greift also, Abschnitt 23 nicht.
 *
 * Wahrscheinlichste Erklärung: WPML liefert auf dieser Installation
 * eine andere Umschalter-Variante als den Legacy-Dropdown, den
 * Abschnitt 23 adressiert (dashboard.php nennt in einer alten
 * Regelliste ausdrücklich auch `select`). Diese Regeln hier greifen
 * deshalb unabhängig von der Variante: Sie formen, was immer als
 * erstes Bedienelement im Umschalter steckt.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop {
    display: inline-flex !important;
    align-items: center !important;
    align-self: center !important;
    box-sizing: border-box !important;
    min-height: 36px !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop > *,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop > * > * {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
/* Variante <select> */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop select {
    box-sizing: border-box !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 30px 0 12px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink) !important;
    cursor: pointer !important;
}
/* Variante <a> oder <button> als direktes Bedienelement */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop a[class*="toggle"],
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop > a,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop button[class*="wpml"] {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 26px 0 12px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* =====================================================================
 * 29 · Die Stellvertreter-Einträge im Bereichsmenü
 *
 * Das Menü zeigt nicht mehr die echte Navigation, sondern Knöpfe, die
 * beim Klick den echten Reiter an seinem Platz betätigen (siehe
 * Kommentar im Skript in dashboard.php). Sie bekommen hier dieselbe
 * Form wie zuvor die umgezogenen Reiter.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-leader-areas-item {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    justify-content: flex-start !important;
    text-align: left !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    padding: 10px 11px !important;
    min-height: 42px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-leader-areas-item::before {
    content: "" !important;
    position: static !important;
    flex: 0 0 auto !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: transparent !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-leader-areas-item:hover {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-leader-areas-item.is-active {
    background: var(--mvf-sunken) !important;
    background-color: var(--mvf-sunken) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-weight: 600 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-areas-slot .mhp-leader-areas-item.is-active::before {
    background: var(--mvf-teal) !important;
}

/* =====================================================================
 * 30 · „Wer sieht was?" — die Zusicherung als eine Zeile
 *
 * Der Block war ein aufgeschlagener Kasten am Anfang von „Mein Team".
 * Er ist jetzt ein <details> direkt über dem Startformular; hier bekommt
 * er die Form einer ruhigen Zeile statt eines Aushangs.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box {
    display: block !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-left: 1px solid var(--mvf-line) !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__summary {
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 11px 14px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__summary::-webkit-details-marker {
    display: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__summary::before {
    content: "" !important;
    flex: 0 0 auto !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 5px solid var(--mvf-faint) !important;
    border-top: 4px solid transparent !important;
    border-bottom: 4px solid transparent !important;
    transition: transform .15s ease !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box[open] .mhp-leader-trust-box__summary::before {
    transform: rotate(90deg) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__list {
    display: block !important;
    margin: 0 !important;
    padding: 0 14px 14px 32px !important;
    list-style: none !important;
    background: transparent !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__list li {
    margin: 0 0 6px !important;
    padding: 0 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    background: transparent !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard details.mhp-leader-trust-box .mhp-leader-trust-box__list li strong {
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-weight: 600 !important;
}

/* =====================================================================
 * 31 · Der Sprachumschalter darf nicht schrumpfen
 *
 * Die Pille lag über „Abmelden". Grund: .mhp-header-meta-desktop trägt
 * im Markup inline `min-width: 0` und ist als Flex-Kind schrumpfbar.
 * Sobald die Zeile eng wird, fällt seine Breite auf 0 zusammen — der
 * Inhalt ragt heraus und legt sich über den Nachbarn.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .mhp-header-meta-desktop {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot {
    flex-wrap: nowrap !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot > * {
    flex: 0 0 auto !important;
}

/* =====================================================================
 * 32 · Die Kopfzeile bleibt in JEDEM Bereich stehen
 *
 * dashboard.php blendet die Kopfkarte in einzelnen Bereichen aus
 * (toggleHeaderVisibility, plus feste Regeln für den Beratungs-Tab).
 * Das war richtig, solange die Karte nur eine Begrüßung trug. Seit Logo,
 * Sprache, Abmelden und das Bereichsmenü darin sitzen, verschwindet mit
 * ihr die gesamte Bedienung — sichtbar bei „Gruppenberatungen".
 *
 * Für Führungskräfte bleibt sie deshalb immer stehen. Die JS-Zeile setzt
 * `style="display:none"` ohne !important und verliert hier.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard #mhp-dashboard-header-card.mhp-leader-header-card {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

/* =====================================================================
 * 33 · Kontoreihe als Raster statt als Flex-Zeile
 *
 * Die Sprachpille lag weiterhin über „Abmelden", obwohl die Elemente
 * nicht mehr schrumpfen. In einer Flex-Zeile kann sich ein Kind trotzdem
 * über den Nachbarn schieben - durch negative Ränder, durch float, durch
 * einen Versatz auf einem position:relative-Element. Welcher davon es
 * ist, lässt sich aus einem Bildschirmfoto nicht ablesen.
 *
 * Ein Raster mit je einer Spalte pro Element kennt keinen dieser Wege:
 * Jedes Kind sitzt in seiner eigenen Spalte, und alle Ränder, floats und
 * Versätze werden hier ausdrücklich zurückgenommen. Danach ist eine
 * Überlappung technisch nicht mehr möglich.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: max-content !important;
    align-items: center !important;
    justify-content: end !important;
    gap: 10px !important;
    float: none !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot > * {
    grid-row: 1 !important;
    margin: 0 !important;
    float: none !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    align-self: center !important;
    justify-self: start !important;
    min-width: 0 !important;
    width: max-content !important;
    max-width: none !important;
}
/* Das Untermenü des Umschalters darf weiterhin aus der Zeile ausbrechen. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-chrome-slot .wpml-ls-sub-menu {
    width: auto !important;
    min-width: 168px !important;
}

/* =====================================================================
 * 34 · „Situationen" — drei Schritte statt einer Kastenwand
 *
 * Der Reiter versprach eine Wahl und zeigte als erstes ein Feld mit der
 * Überschrift „Oder frei suchen". Die Anlässe standen klein darunter.
 * Das Markup ist jetzt in drei nummerierte Schritte gegliedert (siehe
 * class-leader-tab-render.php); hier bekommen sie ihre Form.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step {
    display: block !important;
    margin: 0 0 26px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 4px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-no {
    flex: 0 0 auto !important;
    display: grid !important;
    place-items: center !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background: var(--mvf-ink) !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
    font-family: var(--mvf-sans) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-title {
    font-family: var(--mvf-serif, Lora, Georgia, serif) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-opt {
    font-family: var(--mvf-sans) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
    color: var(--mvf-faint) !important;
    -webkit-text-fill-color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-hint {
    margin: 0 0 12px 32px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    color: var(--mvf-faint) !important;
    -webkit-text-fill-color: var(--mvf-faint) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step .mhp-lc-pf-chips,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step .mhp-lc-pf-input-wrap {
    margin-left: 32px !important;
}

/* Schritt 1: Die Anlässe sind die Navigation - also Karten, keine Chips. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chips--anlass {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 12px !important;
    max-width: 900px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 62px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 14px 18px !important;
    text-align: left !important;
    justify-content: flex-start !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    cursor: pointer !important;
    transition: border-color .12s ease, background-color .12s ease !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ:hover {
    border-color: var(--mvf-teal) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ.is-active {
    border-color: var(--mvf-teal) !important;
    background: var(--mvf-teal-bg) !important;
    background-color: var(--mvf-teal-bg) !important;
}

/* Schritt 2: Themen bleiben Chips - sie grenzen ein, sie navigieren nicht. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chip {
    display: inline-flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
    cursor: pointer !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chip:hover {
    border-color: var(--mvf-teal) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chip.is-active {
    background: var(--mvf-ink) !important;
    background-color: var(--mvf-ink) !important;
    border-color: var(--mvf-ink) !important;
    color: #FFFCF3 !important;
    -webkit-text-fill-color: #FFFCF3 !important;
}

/* Schritt 3: Das Suchfeld ist der Ausweg, nicht der Einstieg. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--frei .mhp-lc-pf-input {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 660px !important;
    min-height: 46px !important;
    padding: 0 15px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--mvf-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    font-family: var(--mvf-sans) !important;
    font-size: 14px !important;
    color: var(--mvf-ink) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--frei .mhp-lc-pf-input:focus {
    outline: 2px solid var(--mvf-teal) !important;
    outline-offset: 1px !important;
    border-color: var(--mvf-teal) !important;
}

@media (max-width: 700px) {
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step-hint,
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step .mhp-lc-pf-chips,
    html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step .mhp-lc-pf-input-wrap {
        margin-left: 0 !important;
    }
}

/* =====================================================================
 * 35 · Situationen: Angleichung an den Entwurf
 *
 * Drei Abweichungen gegenüber dem Mockup waren übrig:
 *   - Die Schritte steckten in einer cremefarbenen Karte. Im Entwurf
 *     stehen sie auf dem Seitengrund; die Karte war ein Rahmen um
 *     etwas, das ohnehin zusammengehört.
 *   - Die Anlass-Karten trugen nur ihre Beschriftung, mittig und
 *     ohne Kontext.
 *   - Die Überschrift hatte keinen Kicker.
 * ===================================================================== */

/* Kein Kasten um die drei Schritte. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-lc-problem-finder.mhp-lc-problem-finder--v2 {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 26px !important;
}

/* Kicker über der Überschrift. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-leader-panel-kicker {
    margin: 0 0 6px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
    color: var(--mvf-faint) !important;
    -webkit-text-fill-color: var(--mvf-faint) !important;
}

/* Anlass-Karten: Titel, Beschreibung, Anzahl — linksbündig gestapelt. */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 16px 18px !important;
    text-align: left !important;
    white-space: normal !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-occ-t {
    display: block !important;
    font-family: var(--mvf-sans) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    margin-bottom: 4px !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-occ-d {
    display: block !important;
    font-family: var(--mvf-sans) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    color: var(--mvf-ink-2) !important;
    -webkit-text-fill-color: var(--mvf-ink-2) !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-occ-n {
    display: block !important;
    margin-top: 8px !important;
    font-family: var(--mvf-sans) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: var(--mvf-faint) !important;
    -webkit-text-fill-color: var(--mvf-faint) !important;
}

/* =====================================================================
 * 36 · Gewählt sieht überall gleich aus
 *
 * Die Themen-Chips waren im gewählten Zustand dunkel gefüllt, die
 * Anlass-Karten hell-teal hinterlegt. Zwei Sprachen für dieselbe
 * Aussage („das ist gerade gewählt") auf einem Bildschirm. Beide
 * benutzen jetzt dieselbe: teal-Rahmen, teal-Grund.
 * ===================================================================== */
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chip.is-active,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--themen .mhp-lc-pf-chip[aria-pressed="true"] {
    background: var(--mvf-teal-bg) !important;
    background-color: var(--mvf-teal-bg) !important;
    border-color: var(--mvf-teal) !important;
    color: var(--mvf-ink) !important;
    -webkit-text-fill-color: var(--mvf-ink) !important;
    font-weight: 600 !important;
}
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ.is-active,
html body #mhp-dashboard#mhp-dashboard#mhp-dashboard#mhp-dashboard.mhp-leader-dashboard .mhp-ld-v2-step--anlass .mhp-lc-pf-chip--occ[aria-pressed="true"] {
    background: var(--mvf-teal-bg) !important;
    background-color: var(--mvf-teal-bg) !important;
    border-color: var(--mvf-teal) !important;
    box-shadow: inset 0 0 0 1px var(--mvf-teal) !important;
}