/* Wichtig, damit in Toolbar-Schaltflächen kein Rahmen angezeigt wird, wenn diese den Fokus erhalten */
    .dxbl-toolbar-item:focus-visible {
        outline: none !important;
    }

    .udm-userhelp-text {
        background-color: var(--bs-light);
        line-height: 1.2;
        border-bottom: 1px var(--bs-dark-border-subtle) solid;
    }

    .udm-time-badge {
        font-weight: 600;
        font-size: 0.8em;
        padding: 0.2em 0.5em;
        border-radius: 0.25rem;
        display: inline-block;
        box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    }




    .udm-dialog .header {
        padding: 0.75rem;
        color: var(--bs-primary);
        font-weight: bold;
        width: 100%;
        background-color: rgba(var(--bs-primary-rgb), 0.2);
        border-bottom: 1px var(--bs-dark-bg-subtle) solid;
    }


    .udm-dialog .toolbar {
        background-color: var(--bs-light-border-subtle);
        padding: 0.15rem;
    }





    .udm-appbar {
        display: flex;
        width: 100%;
        align-items: center;
        padding: 0.5rem 0.5rem;
        background-color: rgba(var(--bs-primary-rgb), 0.2);
    }

    .udm-appbar-buttongroup {
        display: flex;
        border-width: 1px;
        border-style: solid;
        border-radius: 4px;
        padding: 0.2rem;
        border-color: var(--bs-dark-text-emphasis);
        background-color: var(--bs-dark-text-emphasis);
    }
    
    .udm-button.appbar-button {
        box-shadow: none;
        margin: 0;
        font-size: 0.85em;
        font-weight: bold;
        padding: 0.2rem 1rem;
        color: var(--bs-body-bg);
    }

    .udm-button.appbar-button:hover {
        color: var(--bs-primary) !important;
        background-color: var(--bs-dark-bg-subtle) !important;
    }


    .udm-appbar .left-header {
        padding: 0;
    }


    .udm-appbar .header {
        padding: 0.75rem;
        color: var(--bs-primary);
        font-weight: bold;
        width: 100%;
        justify-items: center;
        text-align: center;
    }


    .udm-appbar .navigationinfo {
        display: flex;
        flex-grow: 1;
        height: 100%;
    }

    .udm-appbar .navigationinfo .smallscreen {
        display: none;
    }

    .udm-appbar .right-header {
        display: flex;
        text-wrap-mode: nowrap;
        font-size: 0.85em;
        font-weight: lighter;
    }


    
    .udm-content-panel {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
    }

    .udm-content-panel .header {
        padding: 0.65rem 0 0.65rem 0.25rem;
        font-weight: bold;
        background-color: rgba(var(--bs-primary-rgb), 0.25);
        align-items: center;
        display: flex;
        border-top: 1px rgba(var(--bs-primary-rgb), 0.5) solid;
    }

    .udm-content-panel .header.smallscreen {
        padding: 0.5rem 0rem;
    }

    .udm-content-panel .toolbar {
        padding: 0.25rem;
        background-color: var(--bs-light-border-subtle);
    }

    .udm-content-panel .content {
        width: 100%;
        height: 100%;
        overflow: auto;
        padding: 0.5rem;
    }



    .udm-contentpage-header {
        display: flex;
        padding: 0.25rem;
        padding-bottom: 0;
        width: 100%;
        align-items: center;
    }
    

    .udm-panel-container {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .udm-popup-panel-container {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        padding: 0.5rem;
        overflow: auto;
        background-color: var(--bs-light-border-subtle);
        box-shadow: 0px 2px 4px 1px var(--bs-dark-border-subtle) !important;
        height: 100%;
        min-width: 220px;
        max-width: 300px;
    }

    
    .udm-content-drawer {
    }

        .udm-content-drawer .dxbl-drawer-body
        {
            padding: 0 !important;
        }

    .udm-content-drawer .dxbl-drawer-panel {
        background-color: var(--bs-light-border-subtle);
        border: 1px var(--bs-dark-bg-subtle) solid !important;
    }

    .udm-content-drawer .dxbl-drawer-content {
        display: flex;
        flex-direction: column;
    }
    
    /* Kein linker Rand bei unsichtbarem Unterdialog-Panel */
    .dxbl-drawer-closed .dxbl-drawer-content {
        margin-left: 0;
    }

    .dxbl-drawer-open .dxbl-drawer-content {
        margin-left: 0;
    }

    /* Kein linker Rand bei unsichtbarem Unterdialog-Panel */
    .udm-content-drawer.dxbl-drawer-closed {
        margin-left: 0;
        padding-left: 0;
    }

    .udm-subdialog-area {
        height: 100%;
        padding: 0 0.25rem !important;
        display: flex;
        flex-direction: column;
        background-color: var(--bs-light-border-subtle);
    }





    .udm-subdialogs-popup-area {
        display: flex;
        margin-bottom: 0.5rem;
        border-bottom: 1px var(--bs-light-border-subtle) solid;
        border-radius: 0;
        width: 100%;
    }

    .udm-subdialogs-popup-area .subdialogs-button {
        color: var(--bs-primary);
        font-size: 0.85em;
        margin: 0;
        font-weight: normal;
        justify-content: center;
        border-radius: 0;
        padding: 0.15rem 1rem;
        background-color: rgba(var(--bs-primary-rgb), 0.2);
    }

    .udm-subdialogs-popup-area .dxbl-btn-caption {
        text-wrap-mode: wrap;
    }

    .udm-subdialog-dropdown {

    }

    .udm-subdialogs-switch-popup-button {
        padding: 0;
        margin: 0;
        box-shadow: none;
        margin-bottom: 0.25rem;
        background-color: transparent;
    }

    .udm-subdialog-description-area {
        font-size: 0.85em;
        font-weight: 100;
        background-color: transparent;
        width: 100%;
        padding-left: 0.5rem;
        align-content: center;
        height: 100%;
        line-height: 1.2;
    }


    /* --- Subdialog Chip-Navigation: Scroll-Wrapper --- */
    .subdialog-toolbar-wrapper {
        display: flex;
        width: 100%;
        align-items: center;
        position: relative;
    }

    .subdialog-scroll-btn {
        display: none;
        align-items: center;
        justify-content: center;
        width: 1.5rem;
        flex-shrink: 0;
        border: none;
        background: transparent;
        color: var(--bs-tertiary-color);
        cursor: pointer;
        font-size: 0.7em;
        padding: 0;
        z-index: 1;
        transition: color 0.15s;
    }

    .subdialog-scroll-btn:hover {
        color: var(--bs-primary);
    }

    /* Scroll-Buttons nur anzeigen wenn Toolbar ueberfliessen kann */
    .subdialog-toolbar-wrapper:has(.subdialog-toolbar.has-overflow) .subdialog-scroll-btn {
        display: flex;
    }
     /* === Subdialog-Tabs: Text mit Unterstrich (V6-Konzept) === */
    .subdialog-toolbar {
        display: flex;
        gap: 0;
        padding: 0;
        width: 100%;
        flex-wrap: wrap;
        background-color: var(--bs-tertiary-bg);
        border-bottom: 1px solid var(--bs-border-color);
    }

    .subdialog-button {
        width: auto;
        border: none;
        border-bottom: 3px solid transparent;
        background-color: transparent;
        padding: 0.5em 0.75em;
        display: flex;
        align-items: center;
        cursor: pointer;
        transition: border-color 0.15s, color 0.15s;
    }

    .subdialog-button.active {
        border-bottom: 3px solid var(--bs-primary);
    }

    .subdialog-button:hover:not(.active) {
        border-bottom: 3px solid rgba(var(--bs-primary-rgb), 0.3);
    }

    .subdialog-button .title {
        font-weight: 500;
        padding: 0;
        line-height: 1.2;
        color: var(--bs-secondary-color);
    }

    .subdialog-button.active .title {
        font-weight: 600;
        color: var(--bs-primary);
    }

    .subdialog-button:hover:not(.active) .title {
        color: var(--bs-body-color);
    }

    .subdialog-button .subtitle {
        padding: 0.1rem 0.25rem;
        background-color: var(--bs-light);
    }


    /* --- Gruppen-Dropdown fuer sekundaere Subdialoge --- */
    .subdialog-group-dropdown {
        position: relative;
        display: flex;
        align-items: center;
        gap: 0.3em;
        padding: 0.25em 0.5em;
        border: 1px solid rgba(var(--bs-primary-rgb), 0.4);
        background-color: rgba(var(--bs-primary-rgb), 0.08);
        border-radius: 0.2em;
        cursor: pointer;
        font-size: 0.85em;
        font-weight: 600;
        color: var(--bs-primary);
        white-space: nowrap;
        user-select: none;
    }

    .subdialog-group-dropdown:hover {
        background-color: rgba(var(--bs-primary-rgb), 0.15);
    }

    .subdialog-group-dropdown-label {
        line-height: 1.2;
    }

    .subdialog-group-dropdown-caret {
        font-size: 0.65em;
        opacity: 0.7;
    }

    /* Backdrop zum Schliessen */
    .subdialog-group-dropdown-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1000;
        background: transparent;
    }

    /* Popup-Liste der Gruppen */
    .subdialog-group-dropdown-popup {
        position: absolute;
        top: 100%;
        left: 0;
        margin-top: 0.25em;
        z-index: 1001;
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: 0.35em;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
        min-width: 10em;
        padding: 0.2em;
        display: flex;
        flex-direction: column;
        gap: 0.1em;
    }

    .subdialog-group-dropdown-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.4em 0.6em;
        border-radius: 0.2em;
        cursor: pointer;
        font-size: 1rem;
        font-weight: 500;
        color: var(--bs-body-color);
        transition: background-color 0.1s;
        white-space: nowrap;
    }

    .subdialog-group-dropdown-item:hover {
        background-color: rgba(var(--bs-primary-rgb), 0.1);
    }

    .subdialog-group-dropdown-item.active {
        background-color: rgba(var(--bs-primary-rgb), 0.15);
        color: var(--bs-primary);
        font-weight: 600;
    }

    .subdialog-group-dropdown-count {
        font-size: 0.75em;
        color: var(--bs-secondary-color);
        font-weight: 500;
        background-color: rgba(var(--bs-primary-rgb), 0.1);
        padding: 0.1em 0.45em;
        border-radius: 0.8em;
        margin-left: 1em;
    }

    /* Separator zwischen Dropdown und Tabs */
    .subdialog-group-separator {
        width: 1px;
        align-self: stretch;
        background-color: var(--bs-border-color);
        margin: 0.15em 0.1em;
    }


    /* === Nav-Badge Erweiterungen: Icon + Counter === */

    .subdialog-badge-icon {
        opacity: 0.7;
        margin-right: 0.1em;
    }

    .subdialog-badge-count {
        font-size: 0.8em;
        font-weight: 700;
        color: var(--bs-primary);
        margin-right: 0.15em;
    }

    .subdialog-button.active .subdialog-badge-count {
        color: var(--bs-primary);
    }


    /* === Overflow-Button + Dropdown fuer Prio-2-Subforms === */

    .subdialog-overflow-container {
        position: relative;
        flex-shrink: 0;
    }

    .subdialog-overflow-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.25em;
        padding: 0.2em 0.5em;
        border-radius: 1em;
        font-size: 0.72em;
        cursor: pointer;
        border: 1px solid var(--bs-border-color);
        background: var(--bs-body-bg);
        color: var(--bs-secondary-color);
        transition: all 0.12s;
    }

    .subdialog-overflow-btn:hover {
        border-color: var(--bs-primary);
        color: var(--bs-primary);
    }

    .subdialog-overflow-count {
        font-size: 0.85em;
        font-weight: 600;
    }

    /* Fixed-Popup: Unabhaengig vom Stacking Context, immer im Vordergrund */
    .subdialog-fixed-backdrop {
        position: fixed;
        inset: 0;
        z-index: 9999;
    }

    .subdialog-fixed-popup {
        position: fixed;
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: 0.5em;
        padding: 0.25em 0;
        min-width: 220px;
        max-height: 70vh;
        overflow-y: auto;
        z-index: 10000;
        box-shadow: 0 0.5em 2em rgba(0,0,0,0.15);
    }

    .subdialog-overflow-item {
        display: flex;
        align-items: center;
        gap: 0.5em;
        padding: 0.2em 0.75em;
        cursor: pointer;
        transition: background 0.1s;
    }

    .subdialog-overflow-item:hover {
        background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-body-bg) 94%);
    }

    .subdialog-overflow-item.active {
        color: var(--bs-primary);
        font-weight: 600;
    }

    .subdialog-overflow-icon {
        opacity: 0.6;
    }

    .subdialog-overflow-item-count {
        margin-left: auto;
        font-size: 0.85em;
        font-weight: 600;
        color: var(--bs-secondary-color);
    }

    /* Auffaelliges Badge fuer Subforms mit Anzahl > 0 */
    .subdialog-overflow-item-badge {
        margin-left: auto;
        font-size: 0.72em;
        font-weight: 700;
        color: var(--bs-primary);
        background: rgba(var(--bs-primary-rgb), 0.12);
        padding: 0.1em 0.5em;
        border-radius: 0.8em;
        min-width: 1.5em;
        text-align: center;
    }

    .subdialog-overflow-group-title {
        font-size: 0.925em;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: var(--bs-secondary-color);
        padding: 0.5em 0.25em 0.2em;
    border-bottom: 1px solid var(--bs-border-color);
    }

    .subdialog-overflow-group-title:not(:first-child) {
        margin-top: 0.3em;
    }


    /* === Nav-Badges-Bar: Alle Subdialoge als Badges in einer Zeile === */

    .udm-nav-badges-bar {
        display: flex;
        align-items: center;
        gap: 0.3em;
        padding: 0.3em 0.75em;
        background: var(--bs-tertiary-bg);
        border-bottom: 1px solid var(--bs-border-color);
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: thin;
        flex-wrap: nowrap;
        position: relative;
        /* Verhindert Kompression in Flex-Columns (z.B. Udm2026ContentPage):
           die Bar darf niemals schmaler werden als ihr Button-Hoehenbedarf —
           sonst werden Buttons oben/unten abgeschnitten (overflow-y: hidden). */
        flex-shrink: 0;
        min-height: 2.5em;
    }

    /* Innere subdialog-toolbar: Inline, keine eigene Zeile, kein Border */
    .udm-nav-badges-bar .subdialog-toolbar,
    .udm2026-pagebar-pills .subdialog-toolbar {
        display: contents;
        border: none;
        background: none;
    }

    /* Subdialog-Buttons -> Badge-Pill-Look (Override aller alten Tab-Styles).
       Scope: altes 2025-Layout (.udm-nav-badges-bar) UND neue PageBar
       (.udm2026-pagebar-pills) — dieselbe Pill-Optik in beiden Layouts. */
    .udm-nav-badges-bar .subdialog-button,
    .udm-nav-badges-bar .subdialog2-button,
    .udm2026-pagebar-pills .subdialog-button,
    .udm2026-pagebar-pills .subdialog2-button {
        border: 1px solid var(--bs-border-color) !important;
        border-radius: 1em !important;
        padding: 0.35em 0.8em !important;
        background: var(--bs-body-bg) !important;
        font-size: 0.92em;
        white-space: nowrap;
        flex-shrink: 0;
        transition: all 0.12s;
        gap: 0.3em;
    }

    .udm-nav-badges-bar .subdialog-button:hover,
    .udm-nav-badges-bar .subdialog2-button:hover,
    .udm2026-pagebar-pills .subdialog-button:hover,
    .udm2026-pagebar-pills .subdialog2-button:hover {
        border-color: color-mix(in srgb, var(--bs-primary) 40%, var(--bs-border-color) 60%) !important;
    }

    /* Aktiver primaerer Badge */
    .udm-nav-badges-bar .subdialog-button.active,
    .udm2026-pagebar-pills .subdialog-button.active {
        border-color: var(--bs-primary) !important;
        background: color-mix(in srgb, var(--bs-primary) 12%, var(--bs-body-bg) 88%) !important;
        color: var(--bs-primary);
        font-weight: 600;
    }

    .udm-nav-badges-bar .subdialog-button.active .title,
    .udm2026-pagebar-pills .subdialog-button.active .title {
        color: var(--bs-primary);
        font-weight: 600;
    }

    .udm-nav-badges-bar .subdialog-button.active .subdialog-badge-icon,
    .udm-nav-badges-bar .subdialog-button.active .subdialog-badge-count,
    .udm2026-pagebar-pills .subdialog-button.active .subdialog-badge-icon,
    .udm2026-pagebar-pills .subdialog-button.active .subdialog-badge-count {
        color: var(--bs-primary);
    }

    /* Aktiver sekundaerer Badge: Teal-Akzent */
    .udm-nav-badges-bar .subdialog2-button.active,
    .udm2026-pagebar-pills .subdialog2-button.active {
        border-color: var(--bs-teal, #20c997) !important;
        background: color-mix(in srgb, var(--bs-teal, #20c997) 10%, var(--bs-body-bg) 90%) !important;
        color: var(--bs-teal, #20c997);
        font-weight: 600;
    }

    .udm-nav-badges-bar .subdialog2-button.active .title,
    .udm2026-pagebar-pills .subdialog2-button.active .title {
        color: var(--bs-teal, #20c997);
        font-weight: 600;
    }

    .udm-nav-badges-bar .subdialog2-button:hover,
    .udm2026-pagebar-pills .subdialog2-button:hover {
        border-color: color-mix(in srgb, var(--bs-teal, #20c997) 50%, var(--bs-border-color) 50%) !important;
    }

    .udm-nav-badges-bar .subdialog-button .title,
    .udm-nav-badges-bar .subdialog2-button .title,
    .udm2026-pagebar-pills .subdialog-button .title,
    .udm2026-pagebar-pills .subdialog2-button .title {
        font-weight: 500;
    }

    /* Gruppen-Label: rechts ausgerichtet, vor den sekundaeren Badges */
    .subdialog-group-label {
        display: inline-flex;
        align-items: center;
        gap: 0.3em;
        padding: 0.25em 0.5em;
        font-weight: 600;
        color: var(--bs-secondary-color);
        cursor: pointer;
        border-radius: 0.3em;
        transition: all 0.12s;
        white-space: nowrap;
        flex-shrink: 0;
        border-left: 1px solid var(--bs-border-color);
    }

    .subdialog-group-label:hover {
        color: var(--bs-body-color);
        background: rgba(0, 0, 0, 0.04);
    }


    .udm-subdialog .dxbl-toolbar-item-tmpl {
        width: 100%;
        margin: 0.25rem;
        min-width: 220px;
    }

    /* Sekundaere Tabs: identisches Text-Unterstrich-Design wie primaere */
    .subdialog2-button {
        width: auto;
        border: none;
        border-bottom: 3px solid transparent;
        background-color: transparent;
        padding: 0.5em 0.75em;
        display: flex;
        align-items: center;
        cursor: pointer;
        transition: border-color 0.15s, color 0.15s;
    }

    .subdialog2-button.active {
        border-bottom: 3px solid var(--bs-primary);
    }

    .subdialog2-button:hover:not(.active) {
        border-bottom: 3px solid rgba(var(--bs-primary-rgb), 0.3);
    }

    .subdialog2-button .title {
        font-weight: 500;
        padding: 0;
        line-height: 1.2;
        color: var(--bs-secondary-color);
    }

    .subdialog2-button.active .title {
        font-weight: 600;
        color: var(--bs-primary);
    }

    .subdialog2-button:hover:not(.active) .title {
        color: var(--bs-body-color);
    }



    /* Container: scrollbar */
    .ei-panel { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }

    /* Gemeinsamer Block: jeder Bereich bekommt Margin + Border + Radius */
    .ei-block { margin: 0.3em 0.4em; border: 1px solid var(--bs-border-color); border-radius: 0.3em; overflow: hidden; }

    /* Pager ueber der Tabelle */
    .ei-pager { padding: 0.2em 0.5em; border-bottom: 1px solid var(--bs-border-color); }

    /* Element-Karte: klickbar, primaerfarbig, sticky am oberen Rand */
    .ei-card { display: flex; flex-direction: column; gap: 0.4em; padding: 0.5em; cursor: pointer; transition: background 0.15s;
        background: color-mix(in srgb, var(--bs-primary) 5%, var(--bs-body-bg) 95%);
        border-color: color-mix(in srgb, var(--bs-primary) 18%, var(--bs-border-color) 82%);
        position: sticky; top: 0; z-index: 1; }
    .ei-card:hover { background: color-mix(in srgb, var(--bs-primary) 10%, var(--bs-body-bg) 90%); border-color: var(--bs-primary); }
    .ei-card-row1 { display: flex; gap: 0.5em; align-items: flex-start; }
    .ei-card-icon { width: 2.8em; height: 2.8em; border-radius: 0.35em; flex-shrink: 0;
        display: flex; align-items: center; justify-content: center;
        background: color-mix(in srgb, var(--bs-primary) 12%, var(--bs-body-bg) 88%); color: var(--bs-primary); }
    .ei-card-body { flex: 1; min-width: 0; line-height: 1.25; }
    .ei-card-subtype { font-size: 0.82em; font-weight: 700; color: var(--bs-primary); text-transform: uppercase; letter-spacing: 0.05em; }
    .ei-card-title { font-weight: 700; font-size: 1.15em; }
    .ei-card-desc { color: var(--bs-secondary-color); }
    .ei-card-id { font-size: 0.75em; font-family: monospace; color: var(--bs-secondary-color); opacity: 0.7; }

    /* Footer der Element-Karte: skalierbar via flex+wrap */
    .ei-card-footer { display: flex; flex-direction: column; gap: 0.15em;
        padding-top: 0.4em; font-size: 0.8em;
        border-top: 1px solid color-mix(in srgb, var(--bs-primary) 18%, var(--bs-border-color) 82%); }
    .ei-card-footer-row { display: flex; flex-wrap: wrap; gap: 0.4em;
        align-items: baseline; min-width: 0; }
    .ei-card-footer-label { color: var(--bs-secondary-color); font-weight: 600;
        display: inline-flex; align-items: center; gap: 0.3em; white-space: nowrap; }
    .ei-card-footer-label i { opacity: 0.55; }
    .ei-card-footer-time { display: inline-flex; align-items: center; gap: 0.4em;
        color: var(--bs-body-color); flex-wrap: wrap; }
    .ei-card-footer-user { color: var(--bs-secondary-color);
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
        flex: 1 1 auto; min-width: 0; }
    .ei-card-footer-app { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0.4em;
        padding-top: 0.25em; margin-top: 0.15em;
        border-top: 1px dashed color-mix(in srgb, var(--bs-primary) 14%, var(--bs-border-color) 86%);
        color: var(--bs-body-color); }
    .ei-card-footer-app-lbl { color: var(--bs-secondary-color); font-weight: 600;
        display: inline-flex; align-items: center; gap: 0.3em; white-space: nowrap; }
    .ei-card-footer-app-lbl i { opacity: 0.55; }

    .ei-time-badge { font-weight: 700; padding: 0.05em 0.3em; border-radius: 0.2em; white-space: nowrap; }

    /* Aktions-Karte: Aktionen + Wizards gleichwertig in einer Box */
    .ei-actionbar { margin: 0.3em 0.4em; padding: 0.4em;
        background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: 0.35em;
        display: flex; flex-wrap: wrap; gap: 0.3em; align-items: center; }

    /* Stats: KPI-Look kompakt im getoenten Wrap */
    .ei-stats-wrap { margin: 0.7em 0.4em 0.4em 0.4em; padding: 0.4em;
        background: color-mix(in srgb, var(--bs-primary) 4%, var(--bs-body-bg) 96%);
        border: 1px solid color-mix(in srgb, var(--bs-primary) 14%, var(--bs-border-color) 86%);
        border-radius: 0.35em; }
    .ei-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.35em; }
    .ei-stat { display: flex; align-items: center; gap: 0.45em;
        padding: 0.35em 0.5em;
        border: 1px solid color-mix(in srgb, var(--bs-primary) 12%, var(--bs-border-color) 88%);
        border-radius: 0.3em; background: var(--bs-body-bg); cursor: pointer;
        transition: border-color 0.15s, box-shadow 0.15s; }
    .ei-stat:hover { border-color: var(--bs-primary); box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.10); }
    .ei-stat-icon { font-size: 1em; color: var(--bs-primary); opacity: 0.55; width: 1.2em; text-align: center; }
    .ei-stat-val { font-size: 1.15em; font-weight: 700; color: var(--bs-primary); line-height: 1; }
    .ei-stat-val.zero { color: var(--bs-secondary-color); opacity: 0.4; }
    .ei-stat-lbl { font-size: 0.7em; color: var(--bs-secondary-color);
        text-transform: uppercase; font-weight: 700; letter-spacing: 0.03em;
        margin-top: 0.1em; line-height: 1; }

    /* Sektion: aufklappbarer Bereich mit Header (Default) */
    .ei-section-head { display: flex; align-items: center; gap: 0.35em; padding: 0.35em 0.55em;
        font-weight: 700; color: var(--bs-secondary-color); text-transform: uppercase;
        cursor: pointer; background: var(--bs-tertiary-bg); font-size: 0.82em; letter-spacing: 0.03em; }
    .ei-section-head:hover { background: color-mix(in srgb, var(--bs-tertiary-bg) 80%, var(--bs-primary) 20%); }
    .ei-sh-count { background: var(--bs-secondary-color); color: white;
        padding: 0.05em 0.45em; border-radius: 0.7em; font-size: 0.92em; font-weight: 700; }
    .ei-sh-toggle { margin-left: auto; opacity: 0.55; }

    /* Sektion-Typ-Akzente: Theme-adaptiv via Bootstrap 5.3 Subtle-Variablen.
       Pille (sh-count) folgt Bootstrap-Badge-Praxis: vollfarbiger Hintergrund mit weisser Schrift. */
    .ei-section-head-mappings { background: var(--bs-info-bg-subtle); color: var(--bs-info-text-emphasis); }
    .ei-section-head-mappings:hover { background: color-mix(in srgb, var(--bs-info-bg-subtle) 85%, var(--bs-info) 15%); }
    .ei-section-head-mappings .ei-sh-count { background: var(--bs-info); color: #fff; }
    .ei-block-mappings .ei-table .icon-col { color: var(--bs-info-text-emphasis); }

    .ei-section-head-jobs { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
    .ei-section-head-jobs:hover { background: color-mix(in srgb, var(--bs-warning-bg-subtle) 85%, var(--bs-warning) 15%); }
    .ei-section-head-jobs .ei-sh-count { background: var(--bs-warning); color: var(--bs-warning-text-emphasis); }
    .ei-block-jobs .ei-table .icon-col { color: var(--bs-warning-text-emphasis); }

    .ei-section-head-history { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); }
    .ei-section-head-history:hover { background: color-mix(in srgb, var(--bs-primary-bg-subtle) 85%, var(--bs-primary) 15%); }
    .ei-section-head-history .ei-sh-count { background: var(--bs-primary); color: #fff; }

    /* Tabelle: kompakt, klickbare Zeilen */
    .ei-table { width: 100%; border-collapse: collapse; font-size: 0.88em; }
    .ei-table th { font-weight: 600; color: var(--bs-secondary-color); padding: 0.2em 0.5em;
        border-bottom: 1px solid var(--bs-border-color); text-align: left; white-space: nowrap;
        text-transform: uppercase; font-size: 0.85em;
        background: var(--bs-light, #f8f9fa); }
    .ei-table td { padding: 0.25em 0.5em; border-bottom: 1px solid rgba(0,0,0,0.04); white-space: nowrap; }
    .ei-table td:last-child { white-space: normal; }
    .ei-table tr.clickable { cursor: pointer; }
    .ei-table tr.clickable:hover { background: rgba(var(--bs-primary-rgb), 0.04); }
    .ei-table .icon-col { width: 1.5em; text-align: center; color: var(--bs-primary); }

    /* Badges */
    .ei-log-badge { font-size: 0.82em; padding: 0.1em 0.35em; border-radius: 0.2em; font-weight: 600; white-space: nowrap; }

    /* Wizard-Chips: gleichwertig zu UdmActionButtons (kein Akzent-Stripe) */
    .ei-wizard-chip { display: inline-flex; align-items: center; gap: 0.35em;
        padding: 0.3em 0.65em; border-radius: 0.3em;
        border: 1px solid var(--bs-border-color);
        background: var(--bs-body-bg); color: var(--bs-body-color);
        font-size: 0.85em; font-weight: 500;
        cursor: pointer; transition: background 0.15s, border-color 0.15s; white-space: nowrap; }
    .ei-wizard-chip:hover { background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-body-bg) 94%);
        border-color: var(--bs-primary); }
    .ei-wizard-chip i { color: var(--bs-primary); opacity: 0.85; font-size: 0.9em; }



    .pageinfo {
        text-align: start;
        font-size: 1.15em;
        line-height: 1;
        min-width: 200px;
        display: flex;
        padding-left: 0.25rem;
        flex-wrap: wrap;
        font-weight: 100;
        color: var(--bs-primary);
    }

    .pageinfo.smallscreen {
        font-size: 0.85em;
        width: 100%;
        line-height: 1;
        font-weight: 400;
    }

    .pageinfo .title {
        font-weight: bold;
        padding-right: 0.25rem;
        text-wrap-mode: nowrap;
    }

    .pageinfo .subtitle {
        text-wrap-mode: wrap;
    }


    .udm-pageheader-toolbar .pageinfo-container {
        background-color: transparent;
        border: 0;
    }

    .udm-pageheader-toolbar .pageinfo-container:hover {
        background-color: transparent;
    }

    .udm-pageheader-toolbar .dxbl-btn-group {
        align-self: center;
    }
    
    .udm-pageheader-toolbar .dxbl-btn {
            
    }

    .udm-pageheader-toolbar .dxbl-btn:hover {
        background-color: rgba(var(--bs-primary-rgb), 0.5) !important;
    }



    .udm-form-toolbar {
        display: flex;
        width: 100%;
    }

    /* Dialog-Toolbar im Content-Bereich (ViewModel- + Subdialog-Actions).
       Linker/rechter Rand bewusst knapp, damit der erste Button nah am
       Rand sitzt und die Toolbar optisch zur PageBar darueber buendig ist.
       overflow: visible erlaubt, dass ein Dropdown-Popup (z.B. sekundaerer
       Subdialog-Dropdown im 2026-Layout) ueber die Toolbar-Grenzen hinausragt. */
    .udm-dialog-toolbar-wrapper {
        flex-shrink: 0;
        /* bs-light — gleiche Farbe wie Sidebar + PageHeader. Trennung zum
           Content uebernimmt der inset-Shadow am .udm-pane-sheet darunter —
           daher hier kein eigener box-shadow. z-index: 20 muss hoeher sein
           als die sticky Header im Content (z.B. .ds-header im UDM-Info-Panel
           mit z-index: 10), damit das Sekundaer-Dropdown-Popup nicht von
           solchen Sticky-Elementen ueberdeckt wird. */
        background-color: var(--bs-light);
        border-bottom: 1px solid var(--bs-border-color);
        position: relative;
        z-index: 20;
        padding: 0.25em 0.35em;
        overflow: visible;
        /* Flex-Row damit Sekundaer-Titel-Dropdown (inline-flex) und die
           nachfolgende Toolbar (block-div von Udm2025ContentPageToolbar) in
           derselben Zeile stehen — sonst bricht die Block-Toolbar auf die
           naechste Zeile und die rechte Toolbar wird hoeher als die linke. */
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }

    /* Leere Toolbar ausblenden (keine sichtbaren Buttons).
       AUSNAHME: .udm-toolbar-label-dropdown (klickbarer Sekundaer-Titel im 2026-Layout)
       zaehlt ebenfalls als "Inhalt" — die Sekundaer-Toolbar soll auch dann sichtbar
       bleiben, wenn es keine Actions gibt, damit der Titel-Dropdown erreichbar bleibt. */
    .udm-dialog-toolbar-wrapper:not(:has(.dxbl-btn, .udm-split-btn-container, .udm-dropdown-btn, .udm-toolbar-label-dropdown)) {
        display: none;
    }

    /* Splitter-Handle: subtiler Primary-Tint statt Standard-Grau */
.dxbl-splitter-separator {
    background-color: rgba(var(--bs-primary-rgb), 0.28) !important;
    border-color: rgba(var(--bs-primary-rgb), 0.15) !important;
    border-right: 1px rgba(var(--bs-primary-rgb), 0.25) solid !important;
    border-left: 1px rgba(var(--bs-primary-rgb), 0.25) solid !important;
}

    .dxbl-splitter-separator:hover {
        background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
    }



    .udm-navigation-systempages {
        border-bottom: 1px var(--bs-dark-bg-subtle) solid;
    }

    .udm-nav-button {
        padding: 0;
        border: none;
        background-color: transparent;
        box-shadow: none;
    }

    .udm-nav-area {
        list-style: none;
        width: 100%;
        padding: 0.1rem 0;
        margin: 0;
        border-bottom: 1px rgba(var(--bs-primary-rgb), 0.2) solid;
        --indent: 0.6rem;
    }


    .udm-nav-area ul {
        list-style: none;
        margin: 0;
        padding-left: var(--indent);
    }

    .udm-nav-area li {
        position: relative;
        padding-left: var(--indent);
    }

    /* Keine Baum-Linien */
    .udm-nav-area li::before,
    .udm-nav-area li::after {
        display: none;
    }

    .udm-nav-item {
        cursor: pointer;
        width: 100%;
        padding: 0.15rem 0.3rem;
        font-weight: normal;
        display: flex;
        flex-direction: column;
        border: none;
    }

    /* Admin-Modus: Einzeilig — Text links, Badge rechts */
    .udm-nav-item-grouped {
        flex-direction: row;
        align-items: center;
        gap: 0.25rem;
        padding: 0.05rem 0.4rem;
        position: relative;
        border: none;
    }

    /* Kind-Eintraege: leicht eingerueckt, kleinere Schrift */
    .udm-nav-item-child-grouped {
        opacity: 0.85;
    }

    .udm-nav-item-child-grouped .udm-nav-item-subtitle {
        font-size: 0.9em;
    }

    .udm-nav-item-grouped .udm-nav-item-subtitle {
        flex: 1;
        min-width: 0;
        font-weight: 400;
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* Close-Button: erscheint bei Hover, ueberdeckt Badge */
    .udm-nav-close {
        display: none;
        position: absolute;
        right: 0.25rem;
        top: 50%;
        transform: translateY(-50%);
        border: none;
        background: rgba(var(--bs-body-bg-rgb, 255,255,255), 0.85);
        color: var(--bs-body-color);
        cursor: pointer;
        padding: 0.2rem 0.35rem;
        border-radius: 3px;
        font-size: 0.75em;
        line-height: 1;
        z-index: 1;
    }

    .udm-nav-item-grouped:hover .udm-nav-close {
        display: flex;
    }

    .udm-nav-close:hover {
        color: var(--bs-danger);
        background: rgba(var(--bs-danger-rgb), 0.15);
    }

    .udm-nav-item-title {
        font-size: 0.85em;
        font-weight: 400;
    }

    .udm-nav-item-subtitle {
        font-size: inherit;
        font-weight: 400;
        line-height: 1.2;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

        .udm-nav-item:hover {
            background-color: rgba(var(--bs-primary-rgb), 0.06) !important
        }

    /* Aktiver Dialog (User-Modus: li-basiert) */
    li.udm-nav-active > .d-flex {
        background-color: rgba(var(--bs-primary-rgb), 0.18);
        border-left: 3px solid var(--bs-primary);
    }

    li.udm-nav-active > .d-flex .udm-nav-item-subtitle {
        color: var(--bs-primary);
        font-weight: 500;
    }

    /* Aktiver Dialog (Admin-Modus: div-basiert) */
    .udm-nav-item-grouped.udm-nav-active {
        background-color: rgba(var(--bs-primary-rgb), 0.12);
    }

    .udm-nav-item-grouped.udm-nav-active:not([class*="udm-nav-chain-"]) {
        border-left: none;
    }

    .udm-nav-item-grouped.udm-nav-active .udm-nav-item-subtitle {
        color: var(--bs-primary);
        font-weight: 500;
    }

    /* ═══ Admin-Navigation: Gruppen-Karten ═══ */

    .udm-nav-group {
        margin: 0.25rem 0.4rem 0.5rem 0.15rem;
        border: 1px solid color-mix(in srgb, var(--bs-primary) 38%, var(--bs-border-color) 82%);
        border-radius: 6px;
        overflow: hidden;
    }

    .udm-nav-group.udm-nav-group-sys {
    }

    .udm-nav-group-header {
        display: flex;
        align-items: center;
        padding: 0.4rem 0.4rem;
        gap: 0.35rem;
        cursor: pointer;
        background: rgba(var(--bs-primary-rgb), 0.16);
        border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.12);
        user-select: none;
    }

    .udm-nav-group.udm-nav-group-sys .udm-nav-group-header {
        background: rgba(var(--bs-dark-rgb), 0.10);
        border-bottom-color: color-mix(in srgb, var(--bs-secondary) 20%, var(--bs-border-color) 80%);
    }

    .udm-nav-group-header:hover {
        background: rgba(var(--bs-primary-rgb), 0.20);
    }

    .udm-nav-group.udm-nav-group-sys .udm-nav-group-header:hover {
        background: rgba(var(--bs-dark-rgb), 0.14);
    }

    .udm-nav-group-icon {
        font-size: 1.1em;
        color: var(--bs-primary);
        width: 20px;
        text-align: center;
        flex-shrink: 0;
    }

    .udm-nav-group-img {
        width: 20px;
        height: 20px;
        object-fit: contain;
        flex-shrink: 0;
        border-radius: 3px;
    }

    .udm-nav-group.udm-nav-group-sys .udm-nav-group-icon {
        color: var(--bs-secondary-color);
    }

    .udm-nav-group-name {
        flex: 1;
        min-width: 0;
        font-weight: 700;
        font-size: 0.95em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: var(--bs-primary-text-emphasis);
    }

    .udm-nav-group.udm-nav-group-sys .udm-nav-group-name {
        color: var(--bs-body-color);
    }

    .udm-nav-group-count {
        font-size: 0.7em;
        color: var(--bs-secondary-color);
        background: rgba(var(--bs-primary-rgb), 0.08);
        padding: 0.05rem 0.35rem;
        border-radius: 8px;
        flex-shrink: 0;
        min-width: 1.2em;
        text-align: center;
    }

    .udm-nav-group.udm-nav-group-sys .udm-nav-group-count {
        background: rgba(var(--bs-dark-rgb), 0.06);
    }

    .udm-nav-group-close {
        display: none;
        border: none;
        background: none;
        color: var(--bs-secondary-color);
        cursor: pointer;
        padding: 0.1rem 0.25rem;
        border-radius: 3px;
        font-size: 0.65em;
        flex-shrink: 0;
        line-height: 1;
    }

    .udm-nav-group-header:hover .udm-nav-group-close {
        display: flex;
    }

    .udm-nav-group-close:hover {
        color: var(--bs-danger);
        background: rgba(var(--bs-danger-rgb), 0.08);
    }

    /* Aktiver Gruppen-Header (UserClient: Root-Seite ist aktiv) */
    .udm-nav-group-header.udm-nav-active {
        background: rgba(var(--bs-primary-rgb), 0.22);
    }

    .udm-nav-group-header.udm-nav-active .udm-nav-group-name {
        color: var(--bs-primary);
    }

    .udm-nav-group-chevron {
        font-size: 0.5em;
        color: var(--bs-secondary-color);
        flex-shrink: 0;
    }

    .udm-nav-group-body {
        padding: 0.25rem 0;
    }

    /* Innerhalb von Gruppen: Nav-Items kompakt, ohne Borders */
    .udm-nav-group-body .udm-nav-item {
        padding: 0.15rem 0.4rem;
        border: none;
        margin: 0.2em 0;
    }

    /* Zeilendichte: Normal = mehr Abstand */
    .udm-nav-density-normal .udm-nav-group-body .udm-nav-item {
        padding: 0.25rem 0.4rem;
    }

    /* Zeilendichte: Ultra = minimaler Abstand */
    .udm-nav-density-ultra .udm-nav-group-body .udm-nav-item {
        padding: 0.05rem 0.4rem;
    }


.has-tooltip { position: relative; }

.has-tooltip::after{
  content: attr(data-tooltip);
  position: absolute;
  right: 0.1rem;
    top: 50%;
    transform: translateY(-50%);
  background-color: rgba(var(--bs-primary-rgb), 1);
  color: #fff;
  font-size: 0.75em;
  padding: .15rem .5rem;
  border-radius: .25rem;

    max-width: 220px; /* begrenzt die Zeilenlänge */
    white-space: normal; /* erlaubt Umbruch */
    word-break: break-word; /* bricht lange Wörter */
    line-height: 1.3;

  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
  z-index: 99999;
}

.has-tooltip:hover::after{ opacity: 1; }




    .udm-documentation-text {
    }

    /* Verhindert Abstand zwischen den Zeilen */
    .udm-documentation-text > p {
        margin-bottom: 0;
    }

    /* Styling für hervorgehobenen Suchtext */
    .udm-documentation-text mark {
        background-color: yellow;
        font-weight: bold;
        padding: 0 2px;
    }



    /* =================================================================
       MOBILE PAGE LAYOUT
       ================================================================= */
    .udm-mobile-page-layout {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        position: relative;
    }

    /* =================================================================
       MOBILE HEADER — leicht schwebende Karte
       ================================================================= */
    .udm-mobile-header {
        flex-shrink: 0;
        padding: 0.5rem 0.75rem 0.35rem;
        background: rgba(var(--bs-primary-rgb), 0.16);
        border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.15);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
        text-align: center;
    }

    .udm-mobile-header-title {
        font-size: 1.05em;
        font-weight: 700;
        color: var(--bs-primary);
        line-height: 1.25;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .udm-mobile-header-subtitle {
        font-size: 0.8em;
        font-weight: 400;
        color: var(--bs-secondary-color);
        line-height: 1.3;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* =================================================================
       MOBILE SCROLL AREA
       ================================================================= */
    .udm-mobile-scroll-area {
        flex: 1;
        overflow-y: auto;
        min-height: 0;
        padding: 0.25rem;
    }

    /* =================================================================
       MOBILE SIDEBAR — von rechts, oberhalb der Bottom-Bar
       Nicht fullscreen, sondern als Panel im Layout-Kontext.
       ================================================================= */
    .udm-mobile-sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1060;
        background: rgba(0, 0, 0, 0.4);
        animation: fadeIn 0.15s ease-out;
    }

    .udm-mobile-sidebar-panel {
        position: absolute;
        right: 0;
        bottom: 3.5rem;
        width: 85vw;
        max-width: 320px;
        max-height: calc(100% - 3.5rem);
        z-index: 1065;
        background: var(--bs-body-bg);
        border-left: 2px solid rgba(var(--bs-primary-rgb), 0.2);
        border-top: 2px solid rgba(var(--bs-primary-rgb), 0.2);
        border-radius: 0.75rem 0 0 0;
        overflow-y: auto;
        padding: 0.5rem;
        animation: slideInRight 0.2s ease-out;
        display: flex;
        flex-direction: column-reverse;
    }

    @@keyframes slideInRight {
        from { transform: translateX(100%); }
        to { transform: translateX(0); }
    }

    /* =================================================================
       MOBILE BOTTOM BAR
       Links:  Subdialog-Titel + Untertitel
       Rechts: [Pfeil] 1/6 [Pfeil] | [Menue] [Sidebar]
       ================================================================= */
    .udm-mobile-bottom-bar {
        flex-shrink: 0;
        display: flex;
        align-items: stretch;
        background: rgba(var(--bs-primary-rgb), 0.16);
        border-top: 1px solid rgba(var(--bs-primary-rgb), 0.15);
        box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.18);
    }

    /* --- Linker Bereich: Subdialog-Titel --- */
    .udm-mobile-bar-left {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0.3rem 0.5rem;
        gap: 0.05rem;
    }

    .udm-mobile-bar-subdialog-title {
        font-size: 0.8em;
        font-weight: 600;
        color: var(--bs-primary);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }

    .udm-mobile-bar-subdialog-subtitle {
        font-size: 0.7em;
        font-weight: 400;
        color: var(--bs-secondary-color);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }

    /* --- Rechter Bereich: SNP + Counter + Menue + Sidebar --- */
    .udm-mobile-bar-right {
        display: flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.35rem 0.4rem;
        flex-shrink: 0;
        border-left: 1px solid rgba(var(--bs-primary-rgb), 0.15);
    }

    /* SNP-Pfeile — gleiche Groesse wie Menue-Buttons */
    .udm-mobile-nav-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2.75rem;
        height: 2.75rem;
        border: none;
        border-radius: 50%;
        background: rgba(var(--bs-primary-rgb), 0.12);
        color: var(--bs-primary);
        font-size: 1em;
        cursor: pointer;
        transition: background 0.15s, transform 0.1s;
        flex-shrink: 0;
    }

    .udm-mobile-nav-btn:active {
        transform: scale(0.9);
        background: rgba(var(--bs-primary-rgb), 0.25);
    }

    /* Counter-Button "1/6" — oval, gleiche Backcolor wie SNP */
    .udm-mobile-bar-counter-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
        width: 3.25rem;
        height: 2.75rem;
        padding: 0.25rem 0rem;
        border: none;
        border-radius: 1.375rem;
        background: rgba(var(--bs-primary-rgb), 0.12);
        color: var(--bs-primary);
        cursor: pointer;
        flex-shrink: 0;
        white-space: nowrap;
        transition: background 0.15s, transform 0.1s;
    }

    .udm-mobile-bar-counter-btn:active {
        transform: scale(0.9);
        background: rgba(var(--bs-primary-rgb), 0.25);
    }

    .udm-mobile-bar-counter-icon {
        font-size: 1em;
        line-height: 1;
    }

    .udm-mobile-bar-counter-sep {
        width: 70%;
        height: 1px;
        background: rgba(var(--bs-primary-rgb), 0.2);
    }

    .udm-mobile-bar-counter-text {
        font-size: 0.75em;
        font-weight: 700;
        line-height: 1;
    }

    /* Runde Buttons (Menue + Sidebar) */
    .udm-mobile-menu-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2.75rem;
        height: 2.75rem;
        border-radius: 50%;
        border: none;
        background: rgba(var(--bs-primary-rgb), 0.4);
        color: var(--bs-primary);
        font-size: 1.1em;
        cursor: pointer;
        flex-shrink: 0;
        transition: transform 0.2s, background 0.2s;
    }

    .udm-mobile-menu-btn:hover {
        background: rgba(var(--bs-primary-rgb), 0.3);
    }

    .udm-mobile-menu-btn:active {
        transform: scale(0.92);
    }

    .udm-mobile-menu-btn.open {
        background: rgba(var(--bs-primary-rgb), 0.3);
        transform: rotate(90deg);
    }

    /* =================================================================
       SPEED-DIAL MENU (Dialog-Aktionen)
       ================================================================= */
    .udm-mobile-fab-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1045;
        background: rgba(0, 0, 0, 0.3);
        animation: fadeIn 0.15s ease-out;
    }

    .udm-mobile-fab-menu {
        position: fixed;
        bottom: 4rem;
        right: 0.5rem;
        z-index: 1050;
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
        align-items: flex-end;
        animation: fabMenuIn 0.2s ease-out;
        transform-origin: bottom right;
    }

    @@keyframes fabMenuIn {
        from { opacity: 0; transform: scale(0.8) translateY(10px); }
        to { opacity: 1; transform: scale(1) translateY(0); }
    }

    @@keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    .udm-mobile-fab-action {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.4rem 0.75rem;
        border: 1px solid var(--bs-border-color);
        border-radius: 1.5rem;
        background: var(--bs-body-bg);
        color: var(--bs-body-color);
        font-size: 0.85em;
        cursor: pointer;
        white-space: nowrap;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
        transition: background 0.15s, transform 0.1s;
    }

    .udm-mobile-fab-action:active {
        transform: scale(0.96);
        background: rgba(var(--bs-primary-rgb), 0.08);
    }

    .udm-mobile-fab-action.disabled {
        opacity: 0.45;
        pointer-events: none;
    }

    .udm-mobile-fab-action-label {
        font-weight: 500;
    }

    /* =================================================================
       SUBDIALOG-POPUP
       ================================================================= */
    .udm-mobile-subdialog-popup {
        position: fixed;
        bottom: 4rem;
        right: 0.5rem;
        z-index: 1050;
        width: auto;
        min-width: 14rem;
        max-width: 20rem;
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
        padding: 0.3rem;
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: 0.75rem;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        max-height: 60vh;
        overflow-y: auto;
        animation: fabMenuIn 0.2s ease-out;
        transform-origin: bottom right;
    }

    /* Karten-Stil fuer Popup-Eintraege */
    .udm-mobile-subdialog-popup-item {
        display: flex;
        flex-direction: column;
        gap: 0.05rem;
        padding: 0.35rem 0.6rem;
        border: 1px solid rgba(var(--bs-primary-rgb), 0.08);
        border-radius: 0.5rem;
        background: rgba(var(--bs-primary-rgb), 0.02);
        text-align: left;
        cursor: pointer;
        transition: background 0.12s, border-color 0.12s;
    }

    .udm-mobile-subdialog-popup-item:active {
        background: rgba(var(--bs-primary-rgb), 0.1);
    }

    .udm-mobile-subdialog-popup-item.active {
        background: rgba(var(--bs-primary-rgb), 0.1);
        border-color: rgba(var(--bs-primary-rgb), 0.35);
        border-left: 3px solid var(--bs-primary);
    }

    .udm-mobile-subdialog-popup-title {
        font-size: 0.8em;
        font-weight: 600;
        color: var(--bs-body-color);
        line-height: 1.25;
    }

    .udm-mobile-subdialog-popup-item.active .udm-mobile-subdialog-popup-title {
        color: var(--bs-primary);
    }

    .udm-mobile-subdialog-popup-subtitle {
        font-size: 0.7em;
        font-weight: 400;
        color: var(--bs-secondary-color);
        line-height: 1.2;
    }

    /* Sekundaere Subdialoge im Popup: leichte Einrueckung + Border */
    .udm-mobile-subdialog-popup-item.udm-mobile-subdialog-secondary {
        margin-left: 0.5rem;
        border-left: 2px solid rgba(var(--bs-primary-rgb), 0.3);
    }

    .udm-mobile-subdialog-popup-item.udm-mobile-subdialog-secondary.active {
        border-left: 3px solid var(--bs-primary);
    }

    .udm-mobile-subdialog-secondary-label {
        font-size: 0.65em;
        font-weight: 600;
        color: var(--bs-secondary-color);
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }