/* _content/bettERFramework.Shared.UI/Components/AiBadge.razor.rz.scp.css */
/* Kennzeichnung muss auffallen, ohne die eigentliche Aktion zu überstrahlen: kleiner Chip in
   Akzentfarbe, der sich neben einen Button setzen lässt. */
.ai-badge[b-zx5ayu3485] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.1em 0.55em;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.5;
    white-space: nowrap;
    vertical-align: middle;
}

.ai-badge-dot[b-zx5ayu3485] {
    width: 0.45em;
    height: 0.45em;
    border-radius: 50%;
    background: currentColor;
}
/* _content/bettERFramework.Shared.UI/Components/AiOriginBadge.razor.rz.scp.css */
/* Gleiche Optik wie AiBadge — die Kennzeichnung soll über alle Ebenen hinweg wiedererkennbar sein.
   (Scoped CSS ist pro Komponente isoliert, deshalb hier bewusst dupliziert statt geteilt.) */
.ai-badge[b-twq7bkwqpu] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.1em 0.55em;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.5;
    white-space: nowrap;
    vertical-align: middle;
}

.ai-badge-dot[b-twq7bkwqpu] {
    width: 0.45em;
    height: 0.45em;
    border-radius: 50%;
    background: currentColor;
}
/* _content/bettERFramework.Shared.UI/Components/Features/AiSettingsFeature.razor.rz.scp.css */
/* Eine Karte je Anbieter — gleiche Höhe, damit die Aktionsleisten trotz unterschiedlich langer
   Statustexte auf einer Linie liegen. */
.ai-provider-card[b-pi5zhb1gpx] {
    border: 1px solid rgba(128, 128, 128, 0.35);
    border-radius: 0.35rem;
    padding: 1rem;
    height: 100%;
}

/* Ampel zum Verbindungsstatus (verbunden / Fehler / nicht eingerichtet, §2.2). */
.ai-status[b-pi5zhb1gpx] {
    display: inline-flex;
    align-items: center;
    padding: 0.1em 0.6em;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.ai-status-ok[b-pi5zhb1gpx] {
    background: rgba(39, 174, 96, 0.15);
    color: #1e8449;
}

.ai-status-error[b-pi5zhb1gpx] {
    background: rgba(192, 57, 43, 0.15);
    color: #c0392b;
}

.ai-status-unknown[b-pi5zhb1gpx] {
    background: rgba(128, 128, 128, 0.15);
    color: inherit;
}
/* _content/bettERFramework.Shared.UI/Components/Features/BugReportFeature.razor.rz.scp.css */
.BugReportFeatureIcon.e-btn-icon[b-c5ezfhn71g] {
    content: url("/Icons/Bug--Streamline-Sharp-Remix.svg");
}
/* _content/bettERFramework.Shared.UI/Components/Features/PartnerCustomFieldsEditor.razor.rz.scp.css */
/* Zusatzfeld-Editor: neutrale, theme-erbende Optik (Dialog + Kundenakte). */

.pcf[b-oyysun6i31] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.pcf-empty[b-oyysun6i31] {
    font-size: 0.85rem;
    opacity: 0.7;
    font-style: italic;
    margin: 0;
}

.pcf-rows[b-oyysun6i31] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pcf-row[b-oyysun6i31] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.pcf-label[b-oyysun6i31] {
    flex: 0 0 38%;
    font-size: 0.85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pcf-save[b-oyysun6i31] {
    display: flex;
    justify-content: flex-end;
}
/* _content/bettERFramework.Shared.UI/Components/Features/PartnerFieldsDialog.razor.rz.scp.css */
/* Verwaltungs-Dialog der Zusatzspalten: neutrale, theme-erbende Optik. */

.pfd[b-srwa2j7pak] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pfd-hint[b-srwa2j7pak] {
    font-size: 0.8rem;
    opacity: 0.7;
    margin: 0;
}

.pfd-add[b-srwa2j7pak] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.pfd-empty[b-srwa2j7pak] {
    font-size: 0.85rem;
    opacity: 0.7;
    font-style: italic;
}

.pfd-table[b-srwa2j7pak] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.pfd-table td[b-srwa2j7pak] {
    padding: 0.3rem 0.4rem;
    border-bottom: 1px solid rgba(128, 128, 128, 0.18);
}

.pfd-name[b-srwa2j7pak] {
    width: 55%;
}

.pfd-actions[b-srwa2j7pak] {
    text-align: right;
    white-space: nowrap;
}

.pfd-row--inactive[b-srwa2j7pak] {
    opacity: 0.55;
}

.pfd-inactive-tag[b-srwa2j7pak] {
    font-size: 0.75rem;
    font-style: italic;
    margin-right: 0.5rem;
}
/* _content/bettERFramework.Shared.UI/Components/Features/PartnerImportWizard.razor.rz.scp.css */
/* Import-Assistent: neutrale, theme-erbende Optik (läuft im FiBu- wie im XRM-Kontext). */

.piw[b-pzlwatohqz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 320px;
}

/* Lila-Akzent des Dialogs — bewusst hier lokal, damit er auch im Syncfusion-Modal (rendert außerhalb
   des .xrm-theme-Scopes) sicher greift. */
.piw[b-pzlwatohqz] {
    --piw-accent: var(--bp-purple, #7e5bef);
}

/* Indeterminierte Laufleiste: sichtbar, solange der Assistent arbeitet (Lesen/Analyse/Import). */
.piw-progress[b-pzlwatohqz] {
    position: relative;
    height: 3px;
    width: 100%;
    background: rgba(126, 91, 239, 0.15);
    border-radius: 2px;
    overflow: hidden;
}

.piw-progress[b-pzlwatohqz]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 35%;
    background: var(--piw-accent);
    border-radius: 2px;
    animation: piw-progress-slide-b-pzlwatohqz 1.1s ease-in-out infinite;
}

@keyframes piw-progress-slide-b-pzlwatohqz {
    0% { left: -35%; }
    100% { left: 100%; }
}

/* Schritt-Anzeige */
.piw-steps[b-pzlwatohqz] {
    display: flex;
    gap: 1.25rem;
    list-style: none;
    margin: 0;
    padding: 0 0 0.5rem;
    border-bottom: 1px solid rgba(128, 128, 128, 0.25);
    font-size: 0.85rem;
}

.piw-steps li[b-pzlwatohqz] {
    opacity: 0.55;
}

.piw-steps li.piw-step--active[b-pzlwatohqz] {
    opacity: 1;
    font-weight: 600;
}

.piw-steps li.piw-step--done[b-pzlwatohqz] {
    opacity: 0.8;
}

.piw-toolbar[b-pzlwatohqz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.piw-label[b-pzlwatohqz] {
    font-size: 0.85rem;
    font-weight: 600;
}

.piw-hint[b-pzlwatohqz] {
    font-size: 0.8rem;
    opacity: 0.7;
}

.piw-empty[b-pzlwatohqz] {
    font-size: 0.85rem;
    opacity: 0.7;
    font-style: italic;
    margin: 0.5rem 0;
}

/* Vorschau-/Mapping-Tabellen */
.piw-scroll[b-pzlwatohqz] {
    max-height: 380px;
    overflow: auto;
    border: 1px solid rgba(128, 128, 128, 0.25);
    border-radius: 6px;
}

/* Mapping-Tabelle etwas niedriger, damit der Feste-Werte-Bereich darunter Platz hat. */
.piw-scroll--mapping[b-pzlwatohqz] {
    max-height: 300px;
}

/* Feste Werte für alle Zeilen (unter der Mapping-Tabelle). */
.piw-fixed[b-pzlwatohqz] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-top: 0.4rem;
    border-top: 1px dashed rgba(128, 128, 128, 0.3);
}

.piw-fixed__row[b-pzlwatohqz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.piw-fixed__add[b-pzlwatohqz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.piw-product-choices[b-pzlwatohqz] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.9rem;
}

/* Footer: „Neue Spalte" links, Navigations-Buttons rechts. */
.piw-footer[b-pzlwatohqz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
}

.piw-footer__left[b-pzlwatohqz],
.piw-footer__right[b-pzlwatohqz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.piw-table[b-pzlwatohqz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

.piw-table th[b-pzlwatohqz],
.piw-table td[b-pzlwatohqz] {
    padding: 0.3rem 0.55rem;
    border-bottom: 1px solid rgba(128, 128, 128, 0.18);
    text-align: left;
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.piw-table thead th[b-pzlwatohqz] {
    position: sticky;
    top: 0;
    background: inherit;
    backdrop-filter: blur(2px);
    font-weight: 600;
}

/* Kopfzeilen-Wahl: Zeilen sind klickbar, die gewählte ist markiert. */
.piw-table tbody tr[b-pzlwatohqz] {
    cursor: pointer;
}

.piw-table--mapping tbody tr[b-pzlwatohqz] {
    cursor: default;
}

.piw-table tbody tr.piw-selected[b-pzlwatohqz] {
    outline: 2px solid var(--piw-accent);
    outline-offset: -2px;
    background: rgba(126, 91, 239, 0.14);
    font-weight: 600;
}

.piw-table tbody tr:not(.piw-selected):hover[b-pzlwatohqz] {
    background: rgba(128, 128, 128, 0.12);
}

.piw-rownum[b-pzlwatohqz] {
    opacity: 0.55;
    text-align: right;
    width: 2.5rem;
}

.piw-radio[b-pzlwatohqz] {
    width: 2rem;
    text-align: center;
}

.piw-radio input[b-pzlwatohqz] {
    cursor: pointer;
    accent-color: var(--piw-accent);
}

.piw-colname[b-pzlwatohqz] {
    font-weight: 600;
}

.piw-example[b-pzlwatohqz] {
    opacity: 0.7;
    font-style: italic;
}

.piw-note[b-pzlwatohqz] {
    max-width: 320px;
}

/* Ergänzungs-/Abweichungs-Liste im Dubletten-Folgeschritt */
.piw-dup-list[b-pzlwatohqz] {
    margin: 0;
    padding-left: 1.1rem;
}

.piw-dup-list li[b-pzlwatohqz] {
    white-space: normal;
    padding: 0.1rem 0;
}

.piw-dup-field[b-pzlwatohqz] {
    font-weight: 600;
    margin-right: 0.4rem;
}

.piw-choice[b-pzlwatohqz] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-right: 0.9rem;
    cursor: pointer;
}

.piw-choice input[b-pzlwatohqz] {
    cursor: pointer;
    accent-color: var(--piw-accent);
}

/* Vorschau-Zähler + Status-Chips */
.piw-counts[b-pzlwatohqz] {
    display: flex;
    gap: 0.75rem;
    font-size: 0.85rem;
}

.piw-count[b-pzlwatohqz] {
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    border: 1px solid rgba(128, 128, 128, 0.35);
}

.piw-count--new[b-pzlwatohqz] {
    border-color: rgba(80, 190, 120, 0.7);
}

.piw-count--dup[b-pzlwatohqz] {
    border-color: rgba(240, 180, 60, 0.7);
}

.piw-count--invalid[b-pzlwatohqz] {
    border-color: rgba(230, 90, 90, 0.7);
}

.piw-status[b-pzlwatohqz] {
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    border: 1px solid transparent;
}

.piw-status--new[b-pzlwatohqz] {
    border-color: rgba(80, 190, 120, 0.7);
}

.piw-status--duplicate[b-pzlwatohqz] {
    border-color: rgba(240, 180, 60, 0.7);
}

.piw-status--invalid[b-pzlwatohqz] {
    border-color: rgba(230, 90, 90, 0.7);
}

/* Markierung „Ergänzungen verfügbar" an Dubletten-Zeilen der Vorschau */
.piw-offer-tag[b-pzlwatohqz] {
    margin-left: 0.5rem;
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(80, 190, 120, 0.7);
    font-size: 0.72rem;
    white-space: nowrap;
}
/* _content/bettERFramework.Shared.UI/Components/Features/PartnerProductsDialog.razor.rz.scp.css */
/* Verwaltungs-Dialog des Produktkatalogs: gleiche neutrale Optik wie der Zusatzfelder-Dialog. */

.ppd[b-f3cdjm34km] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ppd-hint[b-f3cdjm34km] {
    font-size: 0.8rem;
    opacity: 0.7;
    margin: 0;
}

.ppd-add[b-f3cdjm34km] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.ppd-empty[b-f3cdjm34km] {
    font-size: 0.85rem;
    opacity: 0.7;
    font-style: italic;
}

.ppd-table[b-f3cdjm34km] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.ppd-table td[b-f3cdjm34km] {
    padding: 0.3rem 0.4rem;
    border-bottom: 1px solid rgba(128, 128, 128, 0.18);
}

.ppd-name[b-f3cdjm34km] {
    width: 55%;
}

.ppd-actions[b-f3cdjm34km] {
    text-align: right;
    white-space: nowrap;
}

.ppd-row--inactive[b-f3cdjm34km] {
    opacity: 0.55;
}

.ppd-inactive-tag[b-f3cdjm34km] {
    font-size: 0.75rem;
    font-style: italic;
    margin-right: 0.5rem;
}
/* _content/bettERFramework.Shared.UI/Components/Layout/ActionSidebar.razor.rz.scp.css */
/* Aktions-Dock (Runde 2): kontextsensitives rechtes Panel im Vorlage-Stil.
   Leerzustand = globale Seiten-Aktionen (Sektions-Labels + ruhige Aktionszeilen + EIN gelber
   Primär-CTA); Auswahl-/Kontextzustand liefert die Seite über denselben Section-Slot und
   setzt die Zeilen-Optik über .bp-dock__context zurück. */

/* Normales Flex-Kind: die Breite hier steuert das Layout, der Body rückt automatisch nach. */
.action-sidebar[b-slp8yvdpei] {
    width: 380px;
    height: 100%;
    transition: width 0.25s ease;

    display: flex;
    flex-direction: column;

    background-color: var(--bp-panel-solid, #12202F);
    border-left: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    color: var(--bp-text, #E6EDF3);

    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
}

.action-sidebar.closed[b-slp8yvdpei] {
    width: 40px;
}

.action-sidebar-head[b-slp8yvdpei] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 8px 8px 16px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
}

.action-sidebar-title[b-slp8yvdpei] {
    font-family: var(--bp-font-head);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bp-text-faint, #5E7183);
}

/* Ein-/Ausklapp-Button als ruhiger Ghost-Button. */
[b-slp8yvdpei] .sidebar-toggle.e-btn {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--bp-text-muted, #8296A9);
}

    [b-slp8yvdpei] .sidebar-toggle.e-btn:hover,
    [b-slp8yvdpei] .sidebar-toggle.e-btn:focus {
        background: var(--bp-panel-hover, rgba(255, 255, 255, 0.05));
        border-color: transparent;
        color: var(--bp-text, #E6EDF3);
    }

.action-sidebar-inner[b-slp8yvdpei] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.4rem;
    padding: 0 0.75rem 0.75rem;
}

/* ---------- Dock-Bausteine (von den Seiten im Section-Slot verwendet) ---------- */

/* Sektions-Label („Zuordnen", „Erfassen", „Auswahl (3)" …). */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__label {
    font-family: var(--bp-font-head);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bp-text-faint, #5E7183);
    margin: 0.6rem 0.15rem 0.1rem;
}

    .action-sidebar-inner[b-slp8yvdpei]  .bp-dock__label:first-child {
        margin-top: 0.35rem;
    }

/* Trennlinie zwischen Kontextzustand und den darunter weiterlaufenden globalen Aktionen. */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__divider {
    border-top: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    margin: 0.4rem -0.75rem 0.1rem;
}

/* Hinweis-/Zählerzeile unter einer Aktion. */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__hint {
    font-size: 0.78rem;
    color: var(--bp-text-faint, #5E7183);
    margin: -0.15rem 0.15rem 0;
}

/* Aktionszeilen: ALLE Buttons im Dock werden zu ruhigen, vollbreiten Zeilen —
   transparent, linksbündig, Hover-Fläche. Der Primär-CTA (e-primary) bleibt Gelb. */
.action-sidebar-inner[b-slp8yvdpei]  .e-btn {
    width: 100%;
    text-align: left;
    overflow-x: hidden;
    text-overflow: ellipsis;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--bp-text-muted, #8296A9);
}

    .action-sidebar-inner[b-slp8yvdpei]  .e-btn:hover,
    .action-sidebar-inner[b-slp8yvdpei]  .e-btn:focus {
        background: rgba(255, 255, 255, 0.05);
        border-color: transparent;
        color: var(--bp-text, #E6EDF3);
    }

    .action-sidebar-inner[b-slp8yvdpei]  .e-btn:active {
        background: rgba(230, 255, 3, 0.10);
        border-color: transparent;
        color: var(--bp-yellow, #E6FF03);
    }

    .action-sidebar-inner[b-slp8yvdpei]  .e-btn:disabled,
    .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-disabled {
        background: transparent;
        border-color: transparent;
        color: var(--bp-text-faint, #5E7183);
        opacity: 0.6;
    }

    /* Der EINE Primär-CTA je Seite: Gelb, mittig, gewichtig (Vorlage-Stil). */
    .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-primary {
        background: var(--bp-yellow, #E6FF03);
        border-color: var(--bp-yellow, #E6FF03);
        color: var(--bp-black, #121212);
        text-align: center;
        font-weight: 600;
    }

    /* Zähler-Pill im Primär-CTA (z. B. „566 offen") — dunkle, halbtransparente Kapsel auf Gelb. */
    .action-sidebar-inner[b-slp8yvdpei]  .e-btn .bp-dock__pill {
        display: inline-block;
        margin-left: 8px;
        padding: 1px 8px;
        border-radius: 20px;
        background: rgba(18, 18, 18, 0.15);
        font-size: 11px;
        font-weight: 500;
        font-variant-numeric: tabular-nums;
        vertical-align: 1px;
    }

        .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-primary:hover,
        .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-primary:focus {
            background: color-mix(in srgb, var(--bp-yellow, #E6FF03) 85%, #ffffff);
            border-color: color-mix(in srgb, var(--bp-yellow, #E6FF03) 85%, #ffffff);
            color: var(--bp-black, #121212);
        }

        .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-primary:disabled,
        .action-sidebar-inner[b-slp8yvdpei]  .e-btn.e-primary.e-disabled {
            background: color-mix(in srgb, var(--bp-yellow, #E6FF03) 30%, var(--bp-surface, #0D1A29));
            border-color: transparent;
            color: rgba(255, 255, 255, 0.35);
            opacity: 1;
        }

/* ---------- Kontextzustand ---------- */

/* Im Kontext-Container (ausgewählter Datensatz) gelten wieder normale Button-Proportionen:
   Pager, kleine Zuweisen-Buttons usw. sollen keine vollbreiten Zeilen sein.
   Kein flex-grow: die globalen Aktionen laufen darunter weiter, das Dock scrollt bei Bedarf. */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__context {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .action-sidebar-inner[b-slp8yvdpei]  .bp-dock__context .e-btn {
        width: auto;
        text-align: center;
    }

/* Info-Zeilen im Kontextzustand (Schlüssel → Wert, z. B. Vertragsdaten). */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__kv {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__kv-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 3px 0;
    font-size: 12.5px;
}

.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__kv-key {
    flex: 0 0 auto;
    color: var(--bp-text-faint, #5E7183);
}

.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__kv-val {
    min-width: 0;
    margin-left: auto;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Kopfzeile des Kontextzustands: Titel + Untertitel + Schließen. */
.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__title {
    font-family: var(--bp-font-head);
    font-weight: 600;
    font-size: 0.95rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.action-sidebar-inner[b-slp8yvdpei]  .bp-dock__sub {
    font-size: 0.78rem;
    color: var(--bp-text-faint, #5E7183);
    margin-top: 2px;
}
/* _content/bettERFramework.Shared.UI/Components/Layout/ActionSidebarLayout.razor.rz.scp.css */
.page[b-i0a8di5xmj] {
    height: 100vh;
}

.mobile-block-overlay[b-i0a8di5xmj] {
    display: none;
}

.nav-sidebar-container[b-i0a8di5xmj] {
    display: flex;
    height: 100%;

    /*Disable scrollbar*/
    overflow-x: hidden;


    /* App-weite dunkle Arbeitsfläche (Navy) — einheitlich für Header, Body, Gaps. */
    background-color: var(--bp-surface, #0D1A29);
    color: var(--bp-text, #E6EDF3);
}

/* Unter 900px Viewport-Breite (Handys, zu schmale Fenster) ist die App nicht bedienbar
   (Sidebar-Layout, Syncfusion-Grids) — statt kaputter UX einen Hinweis zeigen.
   Muss NACH der Basisregel stehen, sonst überschreibt das spätere display:flex das display:none. */
@media (max-width: 899px) {
    .mobile-block-overlay[b-i0a8di5xmj] {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        height: 100%;
        padding: 2rem;
        text-align: center;
        background-color: var(--bp-black, #121212);
        color: var(--bp-off-white, #FDFCFC);
    }

    .nav-sidebar-container[b-i0a8di5xmj] {
        display: none;
    }
}

/* Feste Sidebar-Breite der Runde-2-Shell; Flächen liegen bündig aneinander
   (Panel-Grenzen ziehen die Trennlinien, kein Zwischenraum). */
.nav-menu-container[b-i0a8di5xmj] {
    flex: 0 0 236px;
    width: 236px;
    height: auto;
}


.header-container[b-i0a8di5xmj] {
    width: auto;
    height: auto;
    flex-grow: 1;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}


.header-menu-container[b-i0a8di5xmj] {
    width: auto;
    height: auto;
    flex: 0 0 auto;
}


.main-container[b-i0a8di5xmj] {
    width: auto;
    flex-grow: 1;

    display: flex;

    overflow: hidden;
}


.body-container[b-i0a8di5xmj] {
    flex: 1 1 auto;
    padding: 1rem 1.25rem 1.25rem;

    min-height: 0;
    overflow: auto;

    /* App-weite dunkle Arbeitsfläche (Navy). Grids/Cards im App-Bereich werden zentral
       über .body-container in bp-components.css darauf abgestimmt. */
    background-color: var(--bp-surface);
    color: var(--bp-text);
}

.action-sidebar-container[b-i0a8di5xmj] {
    /* Breite kommt vom Kind (.action-sidebar, 380px offen / 40px zu) */
    flex: 0 0 auto;

    height: 100%;
}
/* _content/bettERFramework.Shared.UI/Components/Layout/HeaderMenu.razor.rz.scp.css */
/* Topbar der Runde-2-Shell: schmale Navy-Leiste mit Breadcrumb links und ruhigen
   Ghost-Icon-Buttons rechts (Gelb bleibt Inhalten und der Sidebar vorbehalten). */

.header-menu[b-muvm1tzey0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 56px;
    padding: 0 20px;
    background-color: var(--bp-panel-solid, #12202F);
    border-bottom: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
}

/* ---------- Breadcrumb ---------- */

.crumb[b-muvm1tzey0] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    color: var(--bp-text-muted, #8296A9);
}

.crumb-firm[b-muvm1tzey0] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.crumb-sep[b-muvm1tzey0] {
    color: var(--bp-text-faint, #5E7183);
}

.crumb-page[b-muvm1tzey0] {
    color: var(--bp-text, #E6EDF3);
    font-weight: 500;
    white-space: nowrap;
}

/* ---------- Globale Suche ---------- */

/* Rechtsbündig vor den Icon-Buttons; Breite wie in der Vorlage (~300px). */
.header-search[b-muvm1tzey0] {
    margin-left: auto;
    width: 320px;
}

    .header-search[b-muvm1tzey0]  .e-input-group {
        background: var(--bp-panel-solid-2, #182839);
    }

/* ---------- Icon-Buttons ---------- */

.header-menu-buttons[b-muvm1tzey0] {
    display: flex;
    gap: 0.25rem;
    margin-left: 0.75rem;
}

/* Ghost-Stil für die Topbar-Buttons: transparent, erst beim Hover eine leichte Fläche. */
[b-muvm1tzey0] .bp-ghost-btn.e-btn,
[b-muvm1tzey0] .bp-ghost-btn.e-dropdown-btn {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--bp-text-muted, #8296A9);
}

    [b-muvm1tzey0] .bp-ghost-btn.e-btn:hover,
    [b-muvm1tzey0] .bp-ghost-btn.e-btn:focus,
    [b-muvm1tzey0] .bp-ghost-btn.e-dropdown-btn:hover,
    [b-muvm1tzey0] .bp-ghost-btn.e-dropdown-btn:focus {
        background: var(--bp-panel-hover, rgba(255, 255, 255, 0.05));
        border-color: transparent;
        color: var(--bp-text, #E6EDF3);
    }

    [b-muvm1tzey0] .bp-ghost-btn.e-btn:active,
    [b-muvm1tzey0] .bp-ghost-btn.e-dropdown-btn:active {
        background: rgba(255, 255, 255, 0.09);
        border-color: transparent;
        color: var(--bp-text, #E6EDF3);
    }

/* Die Bild-Icons (Glocke, Bug) sind schwarze Grafiken — auf Navy aufhellen. */
[b-muvm1tzey0] .bp-ghost-btn .e-btn-icon.CustomNotificationsIcon,
[b-muvm1tzey0] .bp-ghost-btn .e-btn-icon.BugReportFeatureIcon {
    filter: invert(0.72);
}

/* ---------- Einstellungen-Popover (Optik wie der Mandantenwechsel in der Sidebar) ---------- */

.settings-wrap[b-muvm1tzey0] {
    position: relative;
    display: inline-flex;
}

.settings-backdrop[b-muvm1tzey0] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

.settings-pop[b-muvm1tzey0] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 210px;
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: var(--bp-panel-solid-2, #182839);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    padding: 8px;
}

.settings-option[b-muvm1tzey0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 9px;
    border-radius: 6px;
    color: var(--bp-text-muted, #8296A9);
    font-size: 12.5px;
    text-decoration: none;
}

    .settings-option:hover[b-muvm1tzey0] {
        background: rgba(255, 255, 255, 0.06);
        color: var(--bp-text, #E6EDF3);
    }

    .settings-option .e-icons[b-muvm1tzey0] {
        font-size: 13px;
    }

.settings-divider[b-muvm1tzey0] {
    height: 1px;
    margin: 4px 0;
    background: var(--bp-panel-border, rgba(255, 255, 255, 0.08));
}

/* ---------- Sprachwahl ---------- */

/* Der Ghost-Button zeigt das aktive Sprachkürzel (DE/EN/FR/UK) statt eines Icons —
   der Zustand ist so ohne Öffnen erkennbar; Optik bleibt die der Icon-Buttons. */
[b-muvm1tzey0] .bp-ghost-btn.lang-btn.e-btn {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Aktive Sprache: gleiche Auszeichnung wie der aktuelle Mandant im Sidebar-Popover. */
.settings-option.current[b-muvm1tzey0] {
    color: var(--bp-yellow, #E6FF03);
}

    .settings-option.current:hover[b-muvm1tzey0] {
        color: var(--bp-yellow, #E6FF03);
    }

    .settings-option.current .e-icons[b-muvm1tzey0] {
        margin-left: auto;
        font-size: 12px;
    }

.notification-bell[b-muvm1tzey0] {
    position: relative;
    display: inline-flex;
}

.notification-badge[b-muvm1tzey0] {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 9px;
    background-color: var(--bp-yellow, #E6FF03);
    color: var(--bp-black, #121212);
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    text-align: center;
    pointer-events: none;
}

[b-muvm1tzey0] .notification-item {
    padding: 8px 10px;
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    cursor: pointer;
}

[b-muvm1tzey0] .notification-item:hover {
    background-color: var(--bp-panel-hover, rgba(255, 255, 255, 0.05));
}
/* _content/bettERFramework.Shared.UI/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-hhe3s77kmf] {
    height: 100vh;
}

.mobile-block-overlay[b-hhe3s77kmf] {
    display: none;
}

.nav-sidebar-container[b-hhe3s77kmf] {
    display: flex;
    height: 100%;
    /*Disable scrollbar*/
    overflow-x: hidden;
    /* App-weite dunkle Arbeitsfläche (Navy) — einheitlich für Header, Body und Auth-Seiten. */
    background-color: var(--bp-surface, #0D1A29);
    color: var(--bp-text, #E6EDF3);
}

/* Unter 900px Viewport-Breite (Handys, zu schmale Fenster) ist die App nicht bedienbar
   (Sidebar-Layout, Syncfusion-Grids) — statt kaputter UX einen Hinweis zeigen.
   Muss NACH der Basisregel stehen, sonst überschreibt das spätere display:flex das display:none. */
@media (max-width: 899px) {
    .mobile-block-overlay[b-hhe3s77kmf] {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        height: 100%;
        padding: 2rem;
        text-align: center;
        background-color: var(--bp-black, #121212);
        color: var(--bp-off-white, #FDFCFC);
    }

    .nav-sidebar-container[b-hhe3s77kmf] {
        display: none;
    }
}

/* Feste Sidebar-Breite der Runde-2-Shell; Flächen liegen bündig aneinander
   (Panel-Grenzen ziehen die Trennlinien, kein Zwischenraum). */
.nav-menu-container[b-hhe3s77kmf] {
    flex: 0 0 236px;
    width: 236px;
    height: auto;
}


.header-container[b-hhe3s77kmf] {
    width: auto;
    height: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}


.header-menu-container[b-hhe3s77kmf] {
    width: auto;
    height: auto;
    flex: 0 0 auto;
}


.main-container[b-hhe3s77kmf] {
    width: auto;
    flex-grow: 1;
    display: flex;
    overflow: hidden;
}


.body-container[b-hhe3s77kmf] {
    flex: 1 1 auto;
    padding: 1rem 1.25rem 1.25rem;
    min-height: 0;
    overflow: auto;
}
/* _content/bettERFramework.Shared.UI/Components/Layout/NavigationMenu.razor.rz.scp.css */
/* Sidebar der Runde-2-Shell: ruhige Navy-Fläche, Gelb nur als Signal (aktiver Eintrag,
   Zähler, Avatar). Struktur: Logo → Mandanten-Karte → Bereichs-Gruppen → Rechtliches/Nutzer. */

.nav-menu[b-kn017p7jh1] {
    display: flex;
    flex-direction: column;
    height: 100%;
    /* Kein overflow:hidden — das Mandanten-Popover ragt bewusst über den Sidebar-Rand
       in die Content-Fläche; gescrollt wird nur innerhalb von .nav-groups. */
    overflow: visible;
    background-color: var(--bp-panel-solid, #12202F);
    border-right: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    color: var(--bp-text, #E6EDF3);
    font-family: var(--bp-font-body);
}

/* ---------- Logo ---------- */

.side-top[b-kn017p7jh1] {
    padding: 18px 16px 14px;
}

.logo-btn[b-kn017p7jh1] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--bp-text);
}

.logo-mark[b-kn017p7jh1] {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.logo-text[b-kn017p7jh1] {
    font-family: var(--bp-font-head);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -0.01em;
}

    .logo-text b[b-kn017p7jh1] {
        font-weight: 700;
    }

/* ---------- Marke = Modul-Umschalter ----------
   Ersetzt die frühere separate Modul-Pille: die Wortmarke oben zeigt das aktive Modul und ist
   zugleich der Umschalter. Bewusst transparent wie das Logo — EIN Element für „welches Modul",
   das nicht wie ein zweiter Chip mit der Firmen-Karte konkurriert. */

.brand-wrap[b-kn017p7jh1] {
    position: relative;
}

.brand-switch[b-kn017p7jh1] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 4px 8px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--bp-radius-ctl, 8px);
    color: var(--bp-text);
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color 150ms ease-out, border-color 150ms ease-out;
}

    .brand-switch:hover[b-kn017p7jh1] {
        background: rgba(255, 255, 255, 0.05);
        border-color: var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    }

    .brand-switch:focus-visible[b-kn017p7jh1] {
        outline: 2px solid var(--bp-yellow);
        outline-offset: 1px;
    }

    .brand-switch .logo-text[b-kn017p7jh1] {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.brand-chevron[b-kn017p7jh1] {
    flex: 0 0 auto;
    color: var(--bp-text-faint, #5E7183);
    font-size: 13px;
}

@media (prefers-reduced-motion: reduce) {
    .brand-switch[b-kn017p7jh1] {
        transition: none;
    }
}

/* ---------- Mandanten-Karte ---------- */

.mandant-wrap[b-kn017p7jh1] {
    position: relative;
    margin: 0 12px 6px;
}

.mandant[b-kn017p7jh1] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    background: var(--bp-panel-solid-2, #182839);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    color: var(--bp-text);
    font-family: inherit;
    text-align: left;
    cursor: pointer;
}

    .mandant:hover[b-kn017p7jh1] {
        border-color: rgba(255, 255, 255, 0.18);
    }

    .mandant.static[b-kn017p7jh1] {
        cursor: default;
    }

        .mandant.static:hover[b-kn017p7jh1] {
            border-color: var(--bp-panel-border, rgba(255, 255, 255, 0.08));
        }

.mandant-avatar[b-kn017p7jh1] {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bp-yellow);
    color: var(--bp-black);
    font-family: var(--bp-font-head);
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
}

.mandant-text[b-kn017p7jh1] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.mandant-name[b-kn017p7jh1] {
    font-size: 12.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mandant-sub[b-kn017p7jh1] {
    font-size: 10.5px;
    color: var(--bp-text-faint, #5E7183);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mandant-chevron[b-kn017p7jh1] {
    margin-left: auto;
    color: var(--bp-text-faint, #5E7183);
    font-size: 14px;
}

/* ---------- Modul-Umschalter (Prototyp-Vorbild: Kachel-Grid-Popover) ----------
   Jedes Modul bringt seine Kennfarbe als --module-accent mit (Token-Referenz aus ModuleInfo);
   Icon-Kachel und aktive Zustände färben sich darüber — kein Modul-Wissen im Shell-CSS. */

.module-wrap[b-kn017p7jh1] {
    position: relative;
    margin: 0 12px 6px;
}

.module-pill .mandant-name[b-kn017p7jh1] {
    font-family: var(--bp-font-head);
}

.module-avatar[b-kn017p7jh1] {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--module-accent, var(--bp-yellow)) 16%, transparent);
    color: var(--module-accent, var(--bp-yellow));
    font-size: 14px;
    border-radius: 6px;
}

.module-name b[b-kn017p7jh1] {
    font-weight: 700;
}

.module-pop[b-kn017p7jh1] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 288px;
    z-index: 41;
    background: var(--bp-panel-solid-2, #182839);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-lg, 12px);
    padding: 10px;
    animation: module-pop-in-b-kn017p7jh1 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes module-pop-in-b-kn017p7jh1 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .module-pop[b-kn017p7jh1] {
        animation: none;
    }
}

.module-pop-lbl[b-kn017p7jh1] {
    font-family: var(--bp-font-head);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bp-text-faint, #5E7183);
    padding: 2px 4px 8px;
}

.module-grid[b-kn017p7jh1] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.module-tile[b-kn017p7jh1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
    padding: 10px;
    background: var(--bp-panel, rgba(255, 255, 255, 0.035));
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    color: var(--bp-text);
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 150ms ease-out, background-color 150ms ease-out;
}

    .module-tile:hover[b-kn017p7jh1] {
        background: var(--bp-panel-hover, rgba(255, 255, 255, 0.05));
        border-color: rgba(255, 255, 255, 0.2);
    }

    .module-tile:focus-visible[b-kn017p7jh1] {
        outline: 2px solid var(--bp-yellow);
        outline-offset: 1px;
    }

    /* Aktive Kachel: heller Umriss wie im Prototyp — Zustand über Kontur, nicht Farbe allein. */
    .module-tile.current[b-kn017p7jh1] {
        background: var(--bp-panel-hover, rgba(255, 255, 255, 0.05));
        border-color: rgba(255, 255, 255, 0.38);
    }

.module-tile-head[b-kn017p7jh1] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.module-tile .module-name[b-kn017p7jh1] {
    font-family: var(--bp-font-head);
    font-size: 12.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.module-tile-sub[b-kn017p7jh1] {
    font-size: 10.5px;
    line-height: 1.35;
    color: var(--bp-text-muted, #8296A9);
}

/* Popover des Schnellwechsels: liegt über der Sidebar, Backdrop schließt bei Außenklick. */
.mandant-backdrop[b-kn017p7jh1] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

.mandant-pop[b-kn017p7jh1] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 260px;
    z-index: 41;
    display: flex;
    flex-direction: column;
    background: var(--bp-panel-solid-2, #182839);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    padding: 8px;
}

.mandant-filter[b-kn017p7jh1] {
    width: 100%;
    height: 32px;
    padding: 0 10px;
    margin-bottom: 6px;
    background: var(--bp-panel-solid, #12202F);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--bp-radius-ctl, 8px);
    color: var(--bp-text);
    font-family: inherit;
    font-size: 12.5px;
}

    .mandant-filter:focus[b-kn017p7jh1] {
        outline: none;
        border-color: rgba(230, 255, 3, 0.45);
    }

    .mandant-filter[b-kn017p7jh1]::placeholder {
        color: var(--bp-text-faint, #5E7183);
    }

.mandant-list[b-kn017p7jh1] {
    max-height: 260px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.mandant-option[b-kn017p7jh1] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 9px;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: var(--bp-text-muted, #8296A9);
    font-family: inherit;
    font-size: 12.5px;
    text-align: left;
    cursor: pointer;
}

    .mandant-option:hover[b-kn017p7jh1] {
        background: rgba(255, 255, 255, 0.06);
        color: var(--bp-text);
    }

    .mandant-option.current[b-kn017p7jh1] {
        color: var(--bp-yellow);
    }

.mandant-option-name[b-kn017p7jh1] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mandant-option .e-icons[b-kn017p7jh1] {
    margin-left: auto;
    font-size: 12px;
}

.mandant-empty[b-kn017p7jh1] {
    padding: 10px 9px;
    font-size: 12px;
    color: var(--bp-text-faint, #5E7183);
}

.mandant-pop-foot[b-kn017p7jh1] {
    display: flex;
    gap: 12px;
    padding: 8px 9px 4px;
    margin-top: 4px;
    border-top: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
}

    .mandant-pop-foot a[b-kn017p7jh1] {
        font-size: 11.5px;
        color: var(--bp-yellow);
        text-decoration: none;
    }

        .mandant-pop-foot a:hover[b-kn017p7jh1] {
            text-decoration: underline;
        }

/* ---------- Bereichs-Navigation ---------- */

.nav-groups[b-kn017p7jh1] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 12px;
    scrollbar-width: thin;
}

.nav-lbl[b-kn017p7jh1] {
    font-family: var(--bp-font-head);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bp-text-faint, #5E7183);
    padding: 14px 10px 7px;
}

.nav-link[b-kn017p7jh1] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    margin-bottom: 1px;
    border-radius: var(--bp-radius-ctl, 8px);
    color: var(--bp-text-muted, #8296A9);
    font-size: 13.5px;
    line-height: 1.3;
    text-decoration: none;
}

.nav-ico[b-kn017p7jh1] {
    flex: 0 0 auto;
    font-size: 16px;
    color: var(--bp-text-faint, #5E7183);
}

.nav-text[b-kn017p7jh1] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-link:hover[b-kn017p7jh1] {
    background: rgba(255, 255, 255, 0.05);
    color: var(--bp-text);
}

    .nav-link:hover .nav-ico[b-kn017p7jh1] {
        color: var(--bp-text-muted, #8296A9);
    }

.nav-link.on[b-kn017p7jh1] {
    background: rgba(230, 255, 3, 0.10);
    color: var(--bp-yellow);
    font-weight: 500;
}

    .nav-link.on .nav-ico[b-kn017p7jh1] {
        color: var(--bp-yellow);
    }

    /* Aktiv-Balken am linken Sidebar-Rand. */
    .nav-link.on[b-kn017p7jh1]::before {
        content: "";
        position: absolute;
        left: -12px;
        top: 6px;
        bottom: 6px;
        width: 3px;
        background: var(--bp-yellow);
        border-radius: 0 3px 3px 0;
    }

.nav-badge[b-kn017p7jh1] {
    margin-left: auto;
    padding: 1px 6px;
    border-radius: 20px;
    background: rgba(230, 255, 3, 0.16);
    color: var(--bp-yellow);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

/* ---------- Fußbereich: Rechtliches + Nutzer-Karte ---------- */

.side-bot[b-kn017p7jh1] {
    flex: 0 0 auto;
    border-top: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    padding: 8px 12px 10px;
}

.legal[b-kn017p7jh1] {
    padding: 2px 10px 4px;
}

    .legal summary[b-kn017p7jh1] {
        font-size: 11px;
        color: var(--bp-text-faint, #5E7183);
        cursor: pointer;
        list-style: none;
    }

        .legal summary[b-kn017p7jh1]::-webkit-details-marker {
            display: none;
        }

        .legal summary:hover[b-kn017p7jh1] {
            color: var(--bp-text-muted, #8296A9);
        }

    .legal a[b-kn017p7jh1] {
        display: block;
        padding: 3px 0 3px 8px;
        font-size: 11px;
        color: var(--bp-text-faint, #5E7183);
        text-decoration: none;
    }

        .legal a:hover[b-kn017p7jh1] {
            color: var(--bp-text);
        }

.usr[b-kn017p7jh1] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 10px;
    border-radius: var(--bp-radius-ctl, 8px);
}

.usr-avatar[b-kn017p7jh1] {
    flex: 0 0 auto;
    width: 27px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bp-panel-solid-2, #182839);
    border: 1px solid var(--bp-panel-border, rgba(255, 255, 255, 0.08));
    border-radius: 50%;
    color: var(--bp-text-muted, #8296A9);
    font-size: 10.5px;
    font-weight: 500;
}

.usr-text[b-kn017p7jh1] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.usr-name[b-kn017p7jh1] {
    font-size: 12.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usr-sub[b-kn017p7jh1] {
    font-size: 10.5px;
    color: var(--bp-text-faint, #5E7183);
}

.usr-logout[b-kn017p7jh1] {
    margin-left: auto;
    padding: 6px;
    border-radius: 6px;
    color: var(--bp-text-faint, #5E7183);
    font-size: 14px;
    text-decoration: none;
}

    .usr-logout:hover[b-kn017p7jh1] {
        background: rgba(255, 255, 255, 0.06);
        color: var(--bp-text);
    }
/* _content/bettERFramework.Shared.UI/Components/Pages/BusinessPartnersPage.razor.rz.scp.css */
/* Geschäftspartner-Liste — nur Struktur; Look kommt aus bp-Tokens (Tabellen-Vorbild XrmCampaigns). */

.bp-partners[b-pqrgpb5zk9] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
    padding: var(--bp-space-3);
    min-height: 100%;
}

/* ---- Werkzeugleiste: Neuanlage + Filter-Chips links, Suche/Schalter/Zähler rechts ---- */

.bp-partners__toolbar[b-pqrgpb5zk9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--bp-space-3);
    flex-wrap: wrap;
}

.bp-partners__filters[b-pqrgpb5zk9],
.bp-partners__actions[b-pqrgpb5zk9] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    flex-wrap: wrap;
}

.bp-partners__toggle[b-pqrgpb5zk9] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-1);
    font-size: 0.8rem;
    color: var(--bp-text-muted);
    white-space: nowrap;
}

.bp-partners__count[b-pqrgpb5zk9] {
    font-size: 0.8rem;
    color: var(--bp-text-muted);
    white-space: nowrap;
}

/* Filter-Chips: Pillen mit Kontur, aktiv = Akzentfläche (im XRM-Modul via Token-Override Lila). */
.bp-partners__chip[b-pqrgpb5zk9] {
    display: inline-flex;
    align-items: center;
    gap: var(--bp-space-1);
    padding: 4px 12px;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl);
    background: transparent;
    color: var(--bp-text);
    font: inherit;
    font-size: 0.83rem;
    cursor: pointer;
    white-space: nowrap;
}

    .bp-partners__chip:hover[b-pqrgpb5zk9] {
        background: var(--bp-panel-hover);
    }

    .bp-partners__chip .e-icons[b-pqrgpb5zk9] {
        font-size: 0.75rem;
    }

.bp-partners__chip--active[b-pqrgpb5zk9] {
    background: var(--bp-yellow);
    border-color: var(--bp-yellow);
    color: var(--bp-black);
}

/* ---- Tabelle (Muster XrmCampaigns: gedämpfte Header, dünne Trenner, ruhiger Hover) ---- */

.bp-partners__list[b-pqrgpb5zk9] {
    overflow-x: auto;
}

.bp-partners__table[b-pqrgpb5zk9] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.bp-partners__table th[b-pqrgpb5zk9] {
    text-align: left;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bp-text-muted);
    padding: var(--bp-space-2);
    border-bottom: 1px solid var(--bp-panel-border);
    white-space: nowrap;
}

.bp-partners__table td[b-pqrgpb5zk9] {
    padding: var(--bp-space-2);
    border-bottom: 1px solid var(--bp-panel-border);
    color: var(--bp-text);
    vertical-align: middle;
}

.bp-partners__table tbody tr:last-child td[b-pqrgpb5zk9] {
    border-bottom: none;
}

.bp-partners__row[b-pqrgpb5zk9] {
    cursor: pointer;
}

    .bp-partners__row:hover[b-pqrgpb5zk9] {
        background: var(--bp-panel-hover);
    }

.bp-partners__num[b-pqrgpb5zk9] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.bp-partners__col-center[b-pqrgpb5zk9] {
    text-align: center;
}

.bp-partners__company[b-pqrgpb5zk9] {
    font-weight: 600;
    margin-right: var(--bp-space-2);
}

.bp-partners__muted[b-pqrgpb5zk9] {
    color: var(--bp-text-muted);
    white-space: nowrap;
}

/* Beziehungs-Badges: Kontur in Rollenfarbe (Muster xrm-campaigns__badge). */
.bp-partners__badges[b-pqrgpb5zk9] {
    display: inline-flex;
    gap: var(--bp-space-1);
    flex-wrap: wrap;
}

.bp-partners__badge[b-pqrgpb5zk9] {
    display: inline-block;
    padding: 0 var(--bp-space-2);
    border-radius: var(--bp-radius-ctl);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.6;
    border: 1px solid currentColor;
    white-space: nowrap;
    color: var(--bp-text-muted);
}

.bp-partners__badge--customer[b-pqrgpb5zk9] { color: var(--bp-saldo); }
.bp-partners__badge--supplier[b-pqrgpb5zk9] { color: var(--bp-petrol); }
.bp-partners__badge--partner[b-pqrgpb5zk9] { color: var(--bp-purple); }
.bp-partners__badge--subcontractor[b-pqrgpb5zk9] { color: var(--bp-warn); }
.bp-partners__badge--prospect[b-pqrgpb5zk9] { color: var(--bp-text-muted); }
.bp-partners__badge--lead[b-pqrgpb5zk9] { color: var(--bp-orange); }
.bp-partners__badge--inactive[b-pqrgpb5zk9] { color: var(--bp-debit); margin-right: var(--bp-space-1); }

/* Betreuer-Avatar: geteilte UserAvatar-Komponente (.bp-avatar in bp-components.css). */

/* ABC-Klasse: kleiner Kreis, Farbe nach Bedeutung (A grün, B blau, C neutral). */
.bp-partners__class[b-pqrgpb5zk9] {
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--bp-black);
    background: var(--bp-text-muted);
}

.bp-partners__class--a[b-pqrgpb5zk9] { background: var(--bp-credit); }
.bp-partners__class--b[b-pqrgpb5zk9] { background: var(--bp-saldo); }
.bp-partners__class--c[b-pqrgpb5zk9] { background: var(--bp-text-muted); }

/* ---- Hinweis-Card unter der Liste ---- */

.bp-partners__hint[b-pqrgpb5zk9] {
    display: flex;
    align-items: flex-start;
    gap: var(--bp-space-2);
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

    .bp-partners__hint .e-icons[b-pqrgpb5zk9] {
        color: var(--bp-purple);
        margin-top: 2px;
    }

    .bp-partners__hint strong[b-pqrgpb5zk9] {
        color: var(--bp-text);
    }
/* _content/bettERFramework.Shared.UI/Components/Tables/TableViewHost.razor.rz.scp.css */
/* Rahmen einer konfigurierbaren Tabelle: schmale Leiste über dem Grid + Spalten-Dialog.
   Die Leiste bleibt bewusst unauffällig — sie steht über JEDER Tabelle und darf die Maske
   nicht dominieren. */

.bp-tableview[b-ugv7fawl5u] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
}

.bp-tableview__bar[b-ugv7fawl5u] {
    display: flex;
    justify-content: flex-end;
}

.bp-tableview__hint[b-ugv7fawl5u] {
    margin: 0 0 var(--bp-space-3) 0;
    color: var(--bp-text-muted);
    font-size: 0.85rem;
}

.bp-tableview__list[b-ugv7fawl5u] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    max-height: 50vh;
    overflow-y: auto;
}

.bp-tableview__row[b-ugv7fawl5u] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
}
/* _content/bettERFramework.Shared.UI/ErrorHandling/AppErrorDisplay.razor.rz.scp.css */
.app-error[b-rin775xjd3] {
    margin: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid #f5c2c7;
    border-left: 4px solid #dc3545;
    border-radius: 6px;
    background: #fdf2f3;
    color: #842029;
}

.app-error__message[b-rin775xjd3] {
    margin: 0;
    font-weight: 500;
}

.app-error__detail[b-rin775xjd3] {
    margin-top: 0.75rem;
}

.app-error__detail summary[b-rin775xjd3] {
    cursor: pointer;
    color: #6c757d;
    font-size: 0.875rem;
}

.app-error__detail pre[b-rin775xjd3] {
    margin-top: 0.5rem;
    padding: 0.75rem;
    max-height: 20rem;
    overflow: auto;
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    font-size: 0.8125rem;
    white-space: pre-wrap;
    word-break: break-word;
}